fix: react query 설정을 preview 로 이동

Author: cccwon2

.storybook/preview.ts

@@ -0,0 +1,29 @@
+import type { Preview } from "@storybook/react";
+import "../src/app/globals.css";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import React from "react";
+import { Decorator } from "@storybook/react";
+
+const queryClient = new QueryClient();
+
+const withQueryClient: Decorator = (Story) => {
+  return (
+    <QueryClientProvider client={queryClient}>
+      <Story />
+    </QueryClientProvider>
+  );
+};
+
+const preview: Preview = {
+  parameters: {
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+  decorators: [withQueryClient],
+};
+
+export default preview;

.storybook/preview.tsx

@@ -1,23 +1,13 @@
 import ModalLayout from "@/app/components/modal/ModalLayout";
 import useModalStore from "@/store/modalStore";
 import type { Meta, StoryObj } from "@storybook/react";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-
-const queryClient = new QueryClient();
 
 const meta: Meta<typeof ModalLayout> = {
   title: "Design System/Components/Modal/ModalLayout",
   component: ModalLayout,
   parameters: {
     layout: "centered",
   },
-  decorators: [
-    (Story) => (
-      <QueryClientProvider client={queryClient}>
-        <Story />
-      </QueryClientProvider>
-    ),
-  ],
 };
 
 export default meta;