150 lines
4.5 KiB
TypeScript
150 lines
4.5 KiB
TypeScript
import type { Meta, StoryObj } from "@storybook/react-vite";
|
||
|
||
import type { AccountPagePosition } from "../../../../model/positions";
|
||
|
||
import { PositionCard } from "./PositionCard.view";
|
||
|
||
const syntheticPosition
|
||
= {
|
||
absoluteReturn: { currency: "RUB", value: "5000" },
|
||
averagePurchasePrice: { currency: "RUB", value: "200" },
|
||
currentValue: { currency: "RUB", value: "25000" },
|
||
displayName: "Учебные технологии",
|
||
figi: null,
|
||
isin: null,
|
||
issuer: null,
|
||
logoName: null,
|
||
logoSrc: null,
|
||
quantity: "100",
|
||
returnPercent: "25",
|
||
returnPercentText: "+25,00 %",
|
||
returnText: "+5 000 ₽",
|
||
returnTone: "positive",
|
||
sector: null,
|
||
shareText: "20%",
|
||
ticker: "DEMO",
|
||
type: "STOCK",
|
||
} satisfies AccountPagePosition;
|
||
|
||
const meta = {
|
||
args: { kind: "stocks", position: syntheticPosition },
|
||
argTypes: {
|
||
kind: {
|
||
control: "inline-radio",
|
||
options: ["stocks", "bonds", "other"],
|
||
},
|
||
position: { control: false },
|
||
},
|
||
component: PositionCard,
|
||
parameters: {
|
||
docs: {
|
||
description: {
|
||
component:
|
||
"Позиция портфеля WealthLedger: количество, стоимость, результат и доля. Доля и текст результата поступают готовыми из модели представления. Карточка не рассчитывает доходность. Все данные вымышлены; логотип заменён буквенным обозначением.",
|
||
},
|
||
},
|
||
},
|
||
tags: ["autodocs"],
|
||
title: "Product/PositionCard",
|
||
} satisfies Meta<typeof PositionCard>;
|
||
|
||
export default meta;
|
||
|
||
type Story = StoryObj<typeof meta>;
|
||
|
||
export const StockGain: Story = {
|
||
name: "Акция с положительным результатом",
|
||
parameters: {
|
||
docs: {
|
||
description: {
|
||
story:
|
||
"Развёрнутая карточка акции показывает тикер, оценку позиции и положительный результат. Цвет дополняет знак суммы.",
|
||
},
|
||
},
|
||
},
|
||
};
|
||
|
||
export const BondLoss: Story
|
||
= {
|
||
args: {
|
||
kind: "bonds",
|
||
position: {
|
||
...syntheticPosition,
|
||
absoluteReturn: { currency: "RUB", value: "-500" },
|
||
averagePurchasePrice: { currency: "RUB", value: "1000" },
|
||
currentValue: { currency: "RUB", value: "9500" },
|
||
displayName:
|
||
"Учебные облигации для долгосрочных накоплений, выпуск 2030",
|
||
isin: "DEMO-BOND-2030",
|
||
quantity: "10",
|
||
returnPercent: "-5",
|
||
returnPercentText: "-5,00 %",
|
||
returnText: "−500 ₽",
|
||
returnTone: "negative",
|
||
shareText: "7,6%",
|
||
ticker: null,
|
||
type: "BOND",
|
||
},
|
||
},
|
||
name: "Облигация с отрицательным результатом",
|
||
parameters: {
|
||
docs: {
|
||
description: {
|
||
story:
|
||
"Для облигации используется идентификатор выпуска. Длинное имя и отрицательная сумма позволяют проверить компактное представление на узком экране.",
|
||
},
|
||
},
|
||
},
|
||
};
|
||
|
||
export const Other: Story
|
||
= {
|
||
args: {
|
||
kind: "other",
|
||
position: {
|
||
...syntheticPosition,
|
||
displayName: "Учебный фонд",
|
||
isin: "DEMO-FUND",
|
||
ticker: null,
|
||
type: "FUND",
|
||
},
|
||
},
|
||
name: "Прочий инструмент",
|
||
parameters: {
|
||
docs: {
|
||
description: {
|
||
story:
|
||
"Компактный вариант для остальных инструментов сохраняет количество, стоимость и пояснение результата без оформления акции или облигации.",
|
||
},
|
||
},
|
||
},
|
||
};
|
||
|
||
export const MissingValuation: Story
|
||
= {
|
||
args: {
|
||
position: {
|
||
...syntheticPosition,
|
||
absoluteReturn: null,
|
||
averagePurchasePrice: null,
|
||
currentValue: null,
|
||
displayName: "Учебная позиция без текущей оценки",
|
||
returnPercent: null,
|
||
returnPercentText: null,
|
||
returnText: null,
|
||
returnTone: undefined,
|
||
shareText: null,
|
||
ticker: null,
|
||
},
|
||
},
|
||
name: "Оценка и идентификаторы отсутствуют",
|
||
parameters: {
|
||
docs: {
|
||
description: {
|
||
story:
|
||
"При отсутствии оценки остаются название и количество. Неизвестная стоимость, доля и результат не изображаются нулевыми значениями.",
|
||
},
|
||
},
|
||
},
|
||
};
|