ALT TanStack + Storybook

ALT Page.stories.ts file containing: import type { Meta, StoryObj } from '@storybook/tanstack-react'; import { Route } from './Page'; const meta = { parameters: { layout: 'fullscreen', tanstack: { router: { route: Route, // 👈 Supply the Route here // 👇 Rest of these properties are type-safe params: { id: '42' }, query: { tab: 'details' }, }, }, }, } satisfies Meta<typeof Route>; export default meta; type Story = StoryObj<typeof meta>; export const Default: Story = {};

ALT Orders.stories.ts file containing: import { mocked } from 'storybook/test'; // 👇 Automatically mocked import { getOrders } from '../server/orders'; import { OrdersList } from './OrdersList'; const meta = { component: OrdersList, } satisfies Meta<typeof OrdersList>; export default meta; type Story = StoryObj<typeof meta>; // 👇 This story will render with a network error export const OrdersFailed: Story = { beforeEach: async () => { mocked(getOrders).mockRejectedValueOnce(new Error('Network unreachable')); }, };