fix dark mode, storybook config, and minor UI issues

- Add color scheme toggle to Storybook preview via globalTypes
- Remove @storybook/addon-actions (built into Storybook 9+)
- Include .storybook/ files in tsconfig.storybook.json
- Fix InlineError show more button color for readability
- Use transparent variant on Remove button for consistent red in dark mode

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

clients/web/.storybook/main.ts

@@ -7,7 +7,6 @@ const config: StorybookConfig = {
   ],
   "addons": [
     "@chromatic-com/storybook",
-    "@storybook/addon-actions",
     "@storybook/addon-vitest",
     "@storybook/addon-a11y",
     "@storybook/addon-docs",

clients/web/.storybook/preview.tsx

@@ -1,17 +1,53 @@
 import type { Preview } from '@storybook/react-vite'
-import { MantineProvider } from '@mantine/core'
+import { MantineProvider, useMantineColorScheme } from '@mantine/core'
 import { Notifications } from '@mantine/notifications'
 import '@mantine/core/styles.css'
 import '@mantine/notifications/styles.css'
 import '../src/App.css'
 import { theme } from '../src/theme/theme'
+import { useEffect } from 'react'
+
+function ColorSchemeWrapper({
+  colorScheme,
+  children,
+}: {
+  colorScheme: 'light' | 'dark'
+  children: React.ReactNode
+}) {
+  const { setColorScheme } = useMantineColorScheme()
+
+  useEffect(() => {
+    setColorScheme(colorScheme)
+  }, [colorScheme, setColorScheme])
+
+  return <>{children}</>
+}
 
 const preview: Preview = {
+  globalTypes: {
+    colorScheme: {
+      description: 'Mantine color scheme',
+      toolbar: {
+        title: 'Color Scheme',
+        icon: 'mirror',
+        items: [
+          { value: 'light', title: 'Light', icon: 'sun' },
+          { value: 'dark', title: 'Dark', icon: 'moon' },
+        ],
+        dynamicTitle: true,
+      },
+    },
+  },
+  initialGlobals: {
+    colorScheme: 'light',
+  },
   decorators: [
-    (Story) => (
+    (Story, context) => (
       <MantineProvider theme={theme} defaultColorScheme="light">
-        <Notifications position="top-right" />
-        <Story />
+        <ColorSchemeWrapper colorScheme={context.globals.colorScheme ?? 'light'}>
+          <Notifications position="top-right" />
+          <Story />
+        </ColorSchemeWrapper>
       </MantineProvider>
     ),
   ],

clients/web/package-lock.json

@@ -20,7 +20,6 @@
         "@chromatic-com/storybook": "^5.0.1",
         "@eslint/js": "^9.39.4",
         "@storybook/addon-a11y": "^10.2.19",
-        "@storybook/addon-actions": "^9.0.8",
         "@storybook/addon-docs": "^10.2.19",
         "@storybook/addon-onboarding": "^10.2.19",
         "@storybook/addon-vitest": "^10.2.19",
@@ -1696,17 +1695,6 @@
         "storybook": "^10.2.19"
       }
     },
-    "node_modules/@storybook/addon-actions": {
-      "version": "9.0.8",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-9.0.8.tgz",
-      "integrity": "sha512-LFePu7PPnWN0Il/uoUpmA5T0J0C7d6haJIbg0pXrjxW2MQVSYXE4S4LSUz8fOImltBDV3xAl6tLPYHFj6VcrOA==",
-      "dev": true,
-      "license": "MIT",
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/storybook"
-      }
-    },
     "node_modules/@storybook/addon-docs": {
       "version": "10.2.19",
       "resolved": "https://registry.npmjs.org/@storybook/addon-docs/-/addon-docs-10.2.19.tgz",

clients/web/package.json

@@ -26,7 +26,6 @@
     "@chromatic-com/storybook": "^5.0.1",
     "@eslint/js": "^9.39.4",
     "@storybook/addon-a11y": "^10.2.19",
-    "@storybook/addon-actions": "^9.0.8",
     "@storybook/addon-docs": "^10.2.19",
     "@storybook/addon-onboarding": "^10.2.19",
     "@storybook/addon-vitest": "^10.2.19",

clients/web/src/components/atoms/InlineError/InlineError.tsx

@@ -38,7 +38,7 @@ export function InlineError({
             <Button
               variant="transparent"
               size="compact-xs"
-              c="dark"
+              c="var(--inspector-text-primary)"
               onClick={() => setExpanded((v) => !v)}
             >
               {expanded ? "Show less" : "Show more"}

clients/web/src/components/molecules/ServerCard/ServerCard.tsx

@@ -117,7 +117,7 @@ export function ServerCard({
             <Button variant="subtle" size="xs" onClick={onEdit}>
               Edit
             </Button>
-            <Button variant="subtle" size="xs" color="red" onClick={onRemove}>
+            <Button variant="transparent" size="xs" color="red" onClick={onRemove}>
               Remove
             </Button>
           </ActionsRow>

clients/web/tsconfig.storybook.json

@@ -3,6 +3,6 @@
   "compilerOptions": {
     "types": ["vite/client"]
   },
-  "include": ["src/**/*.stories.ts", "src/**/*.stories.tsx"],
+  "include": ["src/**/*.stories.ts", "src/**/*.stories.tsx", ".storybook/**/*.ts", ".storybook/**/*.tsx"],
   "exclude": []
 }