frontend/packages/ui/src/StateView/StateView.stories.tsx

import type { Meta, StoryObj } from "@storybook/react-vite";
import type { ComponentProps } from "react";

import { Button } from "@mantine/core";
import { fn } from "storybook/test";

import { StateView } from "./StateView";

type StateStoryArguments = ComponentProps<typeof StateView> & {
	onAction: () => void;
	withAction: boolean;
};

const meta = {
	args: {
		error: false,
		onAction: fn(),
		text: "Синтетическое пустое состояние. Пользовательские данные не загружаются.",
		title: "Нет учебных данных",
		withAction: false,
	},
	argTypes: {
		action: { table: { disable: true } },
		error: { control: "boolean" },
		onAction: { control: false },
		text: { control: "text" },
		title: { control: "text" },
		withAction: {
			control: "boolean",
			description: "Показать необязательное действие StateView",
		},
	},
	component: StateView,
	parameters: {
		docs: {
			description: {
				component:
					"Общее empty/error состояние WealthLedger с необязательным действием. Error сохраняет alert semantics. Для initial loading используйте skeleton страницы, для refetch — локальное предупреждение рядом с сохранёнными данными. Кнопка вызывает только Actions; API recovery и полный пользовательский сценарий здесь не проверяются.",
			},
		},
	},
	render: (arguments_) => {
		const { onAction, withAction, ...stateProps } = arguments_;
		return (
			<StateView
				{...stateProps}
				action={
					(withAction)
						? ((
								<Button onClick={onAction} variant="default">
									{arguments_.error ? "Повторить локально" : "Выполнить пример"}
								</Button>
							))
						: undefined
				}
			/>
		);
	},
	tags: ["autodocs"],
	title: "Design System/Components/StateView",
} satisfies Meta<StateStoryArguments>;

export default meta;

type Story = StoryObj<typeof meta>;
export const Empty: Story = { name: "Пустое состояние" };
export const EmptyWithAction: Story = {
	args: { withAction: true },
	name: "Пустое состояние с действием",
};
export const Failed: Story = {
	args: {
		error: true,
		text: "Демонстрация недоступных данных без вызова API.",
		title: "Учебная ошибка",
	},
	name: "Ошибка",
};
export const ErrorWithAction: Story = {
	args: { ...Failed.args, withAction: true },
	name: "Ошибка с retry",
};