feat: add Storybook for WealthLedger components

2026-09-07 22:22:37 +03:00
parent 9e42148f6a
commit e63fd89a39
18 changed files with 2889 additions and 22 deletions
@@ -0,0 +1,115 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { MemoryRouter } from "react-router";
+import type { BrokerageAccount } from "../api/useBrokerageAccounts";
+import { brokerageAccountCards } from "../model/display";
+import { BrokerageAccountList } from "./BrokerageAccountList";
+
+const syntheticAccount = {
+	id: "storybook-account",
+	name: "Учебный брокерский счёт",
+	type: "BROKERAGE",
+	openedOn: "2025-03-15",
+	portfolioSummary: {
+		totalsByCurrency: [
+			{ currency: "RUB", value: "125000.50" },
+			{ currency: "USD", value: "320" },
+			{ currency: "EUR", value: "210" },
+		],
+	},
+} satisfies BrokerageAccount;
+
+const meta = {
+	title: "WealthLedger/BrokerageAccountList",
+	component: BrokerageAccountList,
+	tags: ["autodocs"],
+	argTypes: {
+		accounts: { control: false },
+	},
+	decorators: [
+		(Story) => (
+			<MemoryRouter initialEntries={["/accounts"]}>
+				<Story />
+			</MemoryRouter>
+		),
+	],
+	parameters: {
+		docs: {
+			description: {
+				component:
+					"Карточки счетов WealthLedger со сводкой по валютам. Используйте на экране выбора счёта; отсутствие сводки и отсутствие сумм имеют разные сообщения. Примеры содержат вымышленные данные. Ссылки меняют только локальный маршрут MemoryRouter; страница назначения в этой истории не отображается.",
+			},
+		},
+	},
+	args: { accounts: brokerageAccountCards([syntheticAccount]) },
+} satisfies Meta<typeof BrokerageAccountList>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Available: Story = {
+	name: "Сводка по нескольким валютам",
+	parameters: {
+		docs: {
+			description: {
+				story:
+					"Показываются первые две валюты и количество остальных. Суммы разных валют не складываются в общий итог.",
+			},
+		},
+	},
+};
+
+export const Unavailable: Story = {
+	name: "Сводка недоступна",
+	args: {
+		accounts: brokerageAccountCards([
+			{ ...syntheticAccount, portfolioSummary: null, openedOn: null },
+		]),
+	},
+	parameters: {
+		docs: {
+			description: {
+				story:
+					"Счёт остаётся доступен для открытия, даже если сводка временно недоступна. Неизвестные суммы не заменяются нулём; отсутствующая дата открытия не отображается.",
+			},
+		},
+	},
+};
+
+export const Empty: Story = {
+	name: "Нет текущих сумм",
+	args: {
+		accounts: brokerageAccountCards([
+			{ ...syntheticAccount, portfolioSummary: { totalsByCurrency: [] } },
+		]),
+	},
+	parameters: {
+		docs: {
+			description: {
+				story:
+					"Успешно полученная пустая сводка отличается от ошибки получения данных. Карточка сохраняет название, тип счёта и переход.",
+			},
+		},
+	},
+};
+
+export const LongName: Story = {
+	name: "Длинное название счёта",
+	args: {
+		accounts: brokerageAccountCards([
+			{
+				...syntheticAccount,
+				name: "Учебный индивидуальный инвестиционный счёт для долгосрочных накоплений",
+				type: "INDIVIDUAL_INVESTMENT",
+			},
+		]),
+	},
+	parameters: {
+		docs: {
+			description: {
+				story:
+					"Проверьте перенос длинного названия на узком экране и доступность всей карточки с клавиатуры.",
+			},
+		},
+	},
+};