Accept router params via storybook parameter

packages/profile/.storybook/preview.tsx

@@ -1,12 +1,34 @@
 import React from "react";
-import type { Preview, ReactRenderer } from "@storybook/react";
+import type { Decorator, Preview, ReactRenderer } from "@storybook/react";
 import { withThemeByClassName } from "@storybook/addon-themes";
 import { SonnerToaster } from "@cartridge/ui-next";
 import { Provider } from "../src/components/provider";
 
 import "../src/index.css";
 import { MemoryRouter, Route, Routes } from "react-router-dom";
 
+const routerDecorator: Decorator = (Story, { parameters: { router } }) => {
+  const params = router?.params || {}
+  const path = Object.keys(params).length
+    ? `/:${Object.keys(params).join("/:")}`
+    : "/"
+  const url = `/${Object.values(params).join("/")}`
+
+  return (
+    <MemoryRouter initialEntries={[url]}>
+      <Provider>
+        <Routes>
+          <Route
+            path={path}
+            element={<Story />}
+          />
+        </Routes>
+        <SonnerToaster />
+      </Provider>
+    </MemoryRouter>
+  );
+};
+
 const preview: Preview = {
   parameters: {
     controls: {
@@ -39,18 +61,7 @@ const preview: Preview = {
       },
       defaultTheme: "dark",
     }),
-    (Story,
-      // { parameters }
-    ) => (
-      <MemoryRouter initialEntries={["/project-1"]}>
-        <Provider>
-          <Routes>
-            <Route path="/:project" element={<Story />} />
-          </Routes>
-          <SonnerToaster />
-        </Provider>
-      </MemoryRouter>
-    ),
+    routerDecorator,
   ],
 };
 

packages/profile/src/components/inventory/index.stories.tsx

@@ -5,6 +5,13 @@ import { decorator } from "@/hooks/account.mock";
 
 const meta = {
   component: Inventory,
+  parameters: {
+    router: {
+      params: {
+        project: "test-0",
+      },
+    },
+  },
 } satisfies Meta<typeof Inventory>;
 
 export default meta;

packages/profile/src/components/inventory/token/token.stories.tsx

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from "@storybook/react";
+
+import { Token } from "./token";
+
+const meta = {
+  component: Token,
+} satisfies Meta<typeof Token>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {};