✨ Support theme switching within Storybook

frontend/.storybook/preview.js

@@ -1,5 +1,19 @@
+import { withThemeByClassName } from "@storybook/addon-themes";
+
+export const decorators = [
+  withThemeByClassName({
+    themes: {
+      light: "light",
+      dark: "default",
+    },
+    defaultTheme: "dark",
+    parentSelector: "body",
+  }),
+];
+
 /** @type { import('@storybook/react').Preview } */
 const preview = {
+  decorators: decorators,
   parameters: {
     controls: {
       matchers: {
@@ -7,23 +21,7 @@ const preview = {
         date: /Date$/i,
       },
     },
-    backgrounds: {
-      default: "dark",
-      values: [
-        {
-          name: "dark",
-          value: "#18181a",
-        },
-        {
-          name: "light",
-          value: "#fff",
-        },
-        {
-          name: "debug",
-          value: "#ccc",
-        },
-      ],
-    },
+    backgrounds: { disable: true },
   },
 };