diff --git a/frontend/.storybook/main.cjs b/frontend/.storybook/main.cjs
deleted file mode 100644
index 0f4bd67..0000000
--- a/frontend/.storybook/main.cjs
+++ /dev/null
@@ -1,32 +0,0 @@
-module.exports = {
- stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
- addons: [
- "@storybook/addon-links",
- "@storybook/addon-essentials",
- "@storybook/addon-interactions",
- ],
- framework: "@storybook/react",
- core: {
- builder: "@storybook/builder-vite",
- },
- webpackFinal: async (config) => {
- config.module.rules.push({
- test: /\.css$/,
- use: [
- {
- loader: "postcss-loader",
- options: {
- postcssOptions: {
- plugins: [require("tailwindcss"), require("autoprefixer")],
- },
- },
- },
- ],
- include: path.resolve(__dirname, "../"),
- });
- return config;
- },
- features: {
- storyStoreV7: true,
- },
-};
diff --git a/frontend/.storybook/main.ts b/frontend/.storybook/main.ts
index c84fa33..0d913cd 100644
--- a/frontend/.storybook/main.ts
+++ b/frontend/.storybook/main.ts
@@ -1,25 +1,21 @@
-// .storybook/main.ts
-
import type { StorybookConfig } from "@storybook/react-vite";
+
const config: StorybookConfig = {
- stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
+ stories: ["../src/**/*.stories.@(js|jsx|ts|tsx|mdx)"],
+
addons: [
- "@storybook/addon-actions",
"@storybook/addon-links",
- "@storybook/addon-essentials",
- "@storybook/addon-styling",
- {
- name: "@storybook/addon-styling",
- },
- "@storybook/addon-mdx-gfm",
+ "@storybook/addon-docs"
],
core: {},
+
framework: {
name: "@storybook/react-vite",
options: {},
},
- docs: {
- autodocs: true,
- },
+ features: {
+ mdx2Csf: true,
+ }
};
+
export default config;
diff --git a/frontend/.storybook/preview.cjs b/frontend/.storybook/preview.cjs
deleted file mode 100644
index 67e6942..0000000
--- a/frontend/.storybook/preview.cjs
+++ /dev/null
@@ -1,12 +0,0 @@
-import "../src/index.css";
-import "tailwindcss/tailwind.css";
-
-export const parameters = {
- actions: { argTypesRegex: "^on[A-Z].*" },
- controls: {
- matchers: {
- color: /(background|color)$/i,
- date: /Date$/,
- },
- },
-};
diff --git a/frontend/.storybook/preview.js b/frontend/.storybook/preview.js
deleted file mode 100644
index 9fbc291..0000000
--- a/frontend/.storybook/preview.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import "tailwindcss/tailwind.css";
-import "../src/index.css";
-
-export const parameters = {
- actions: { argTypesRegex: "^on[A-Z].*" },
- controls: {
- matchers: {
- color: /(background|color)$/i,
- date: /Date$/,
- },
- },
-};
diff --git a/frontend/.storybook/preview.tsx b/frontend/.storybook/preview.tsx
new file mode 100644
index 0000000..1f09370
--- /dev/null
+++ b/frontend/.storybook/preview.tsx
@@ -0,0 +1,34 @@
+import "tailwindcss/tailwind.css";
+import "../src/index.css";
+
+import { BrowserRouter } from "react-router-dom";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import type { Preview, StoryFn } from "@storybook/react";
+
+import { AppContextProvider } from "../src/context/AppContext";
+
+const queryClient = new QueryClient();
+
+export const parameters = {
+ actions: { argTypesRegex: "^on[A-Z].*" },
+ controls: {
+ matchers: {
+ color: /(background|color)$/i,
+ date: /Date$/,
+ },
+ },
+};
+
+export const decorators: Preview["decorators"] = [
+ (Story: StoryFn) => (
+