feat: unify upcoming event cards across pages

src/entities/brokerage-event/ui/BrokerageEventCard.tsx

@@ -0,0 +1,45 @@
+import type { FC } from "react";
+import { useTranslation } from "react-i18next";
+import { formatMoney, instrumentLogoUrl } from "@/shared/lib";
+import { EntryCard } from "@/shared/ui";
+import type { BrokerageEvent } from "../api/useBrokerageEvents";
+
+type BrokerageEventCardProps = { event: BrokerageEvent };
+
+const BrokerageEventCard: FC<BrokerageEventCardProps> = (props) => {
+	const { event } = props;
+	const { t } = useTranslation();
+
+	const date = new Intl.DateTimeFormat("ru-RU", {
+		dateStyle: "medium",
+		timeZone: "UTC",
+	}).format(new Date(`${event.date}T00:00:00Z`));
+
+	const metadata = [
+		date,
+		event.dateKind === "registry" ? t("events.dateKind.registry") : null,
+		event.isin,
+	]
+		.filter(Boolean)
+		.join(" · ");
+
+	return (
+		<EntryCard
+			title={`${t(`events.type.${event.type}`)} · ${event.displayName}`}
+			metadata={metadata}
+			initial={(
+				(event.ticker ?? event.displayName).trim()[0] ?? "?"
+			).toUpperCase()}
+			imageSrc={instrumentLogoUrl(event.logoName)}
+			value={
+				event.projectedAmount
+					? formatMoney(event.projectedAmount)
+					: t("events.noAmount")
+			}
+			valueLabel={t("events.projectedAmount")}
+			tone="neutral"
+		/>
+	);
+};
+
+export { BrokerageEventCard };