chore: catch up Storybook preview, coverage, and story hygiene
Stories were throwing without AuthModal/CreateFlow providers, autodocs was a no-op, and several DS/create-flow screens had no stories.
This commit is contained in:
+55
-3
@@ -1,10 +1,43 @@
|
||||
import "../app/globals.css";
|
||||
import "./fonts.css";
|
||||
import { MINIMAL_VIEWPORTS } from "storybook/viewport";
|
||||
import { AuthModalProvider } from "../app/contexts/AuthModalContext";
|
||||
import { MessagesProvider } from "../app/contexts/MessagesContext";
|
||||
import { CreateFlowProvider } from "../app/(app)/create/context/CreateFlowContext";
|
||||
import messages from "../messages/en/index";
|
||||
|
||||
/** Figma / Tailwind breakpoints from `app/tailwind.css`. */
|
||||
const dsViewports = {
|
||||
sm: {
|
||||
name: "sm 430",
|
||||
styles: { width: "430px", height: "932px" },
|
||||
},
|
||||
md: {
|
||||
name: "md 640",
|
||||
styles: { width: "640px", height: "1024px" },
|
||||
},
|
||||
lg: {
|
||||
name: "lg 1024",
|
||||
styles: { width: "1024px", height: "768px" },
|
||||
},
|
||||
xl: {
|
||||
name: "xl 1440",
|
||||
styles: { width: "1440px", height: "900px" },
|
||||
},
|
||||
// Aliases used by existing page stories
|
||||
mobile1: {
|
||||
name: "sm 430",
|
||||
styles: { width: "430px", height: "932px" },
|
||||
},
|
||||
desktop: {
|
||||
name: "xl 1440",
|
||||
styles: { width: "1440px", height: "900px" },
|
||||
},
|
||||
};
|
||||
|
||||
/** @type { import('@storybook/react').Preview } */
|
||||
const preview = {
|
||||
tags: ["autodocs"],
|
||||
parameters: {
|
||||
controls: {
|
||||
matchers: {
|
||||
@@ -12,13 +45,32 @@ const preview = {
|
||||
date: /Date$/i,
|
||||
},
|
||||
},
|
||||
backgrounds: {
|
||||
options: {
|
||||
dark: { name: "Dark", value: "#000000" },
|
||||
light: { name: "Light", value: "#ffffff" },
|
||||
},
|
||||
},
|
||||
viewport: {
|
||||
options: {
|
||||
...MINIMAL_VIEWPORTS,
|
||||
...dsViewports,
|
||||
},
|
||||
},
|
||||
},
|
||||
initialGlobals: {
|
||||
backgrounds: { value: "dark" },
|
||||
},
|
||||
decorators: [
|
||||
(Story) => (
|
||||
<MessagesProvider messages={messages}>
|
||||
<div className="font-inter">
|
||||
<Story />
|
||||
</div>
|
||||
<AuthModalProvider>
|
||||
<CreateFlowProvider>
|
||||
<div className="font-inter">
|
||||
<Story />
|
||||
</div>
|
||||
</CreateFlowProvider>
|
||||
</AuthModalProvider>
|
||||
</MessagesProvider>
|
||||
),
|
||||
],
|
||||
|
||||
Reference in New Issue
Block a user