Fix theme

apps/yaak-client/components/JsonBodyEditor.tsx

@@ -1,6 +1,7 @@
 import { linter } from '@codemirror/lint';
 import type { HttpRequest } from '@yaakapp-internal/models';
 import { patchModel } from '@yaakapp-internal/models';
+import { Icon } from '@yaakapp-internal/ui';
 import { useCallback, useMemo } from 'react';
 import { useKeyValue } from '../hooks/useKeyValue';
 import { textLikelyContainsJsonComments } from '../lib/jsonComments';
@@ -10,7 +11,6 @@ import { Dropdown } from './core/Dropdown';
 import type { EditorProps } from './core/Editor/Editor';
 import { jsonParseLinter } from './core/Editor/json-lint';
 import { Editor } from './core/Editor/LazyEditor';
-import { Icon } from './core/Icon';
 import { IconButton } from './core/IconButton';
 import { IconTooltip } from './core/IconTooltip';
 

apps/yaak-proxy/theme.ts

@@ -1,9 +1,35 @@
+import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow";
+import { setWindowTheme } from "@yaakapp-internal/mac-window";
 import {
   applyThemeToDocument,
   defaultDarkTheme,
+  defaultLightTheme,
+  getCSSAppearance,
   platformFromUserAgent,
   setPlatformOnDocument,
+  subscribeToPreferredAppearance,
+  type Appearance,
 } from "@yaakapp-internal/theme";
 
 setPlatformOnDocument(platformFromUserAgent(navigator.userAgent));
-applyThemeToDocument(defaultDarkTheme);
+
+// Apply a quick initial theme based on CSS media query
+let preferredAppearance: Appearance = getCSSAppearance();
+applyTheme(preferredAppearance);
+
+// Then subscribe to accurate OS appearance detection and changes
+subscribeToPreferredAppearance((a) => {
+  preferredAppearance = a;
+  applyTheme(preferredAppearance);
+});
+
+// Show window after initial theme is applied (window starts hidden to prevent flash)
+getCurrentWebviewWindow().show().catch(console.error);
+
+function applyTheme(appearance: Appearance) {
+  const theme = appearance === "dark" ? defaultDarkTheme : defaultLightTheme;
+  applyThemeToDocument(theme);
+  if (theme.base.surface != null) {
+    setWindowTheme(theme.base.surface);
+  }
+}

crates-tauri/yaak-app-proxy/capabilities/default.json

@@ -12,6 +12,7 @@
     "core:window:allow-is-maximized",
     "core:window:allow-maximize",
     "core:window:allow-minimize",
+    "core:window:allow-show",
     "core:window:allow-start-dragging",
     "core:window:allow-unmaximize",
     "yaak-mac-window:default"

crates-tauri/yaak-app-proxy/src/lib.rs

@@ -48,7 +48,7 @@ pub fn run() {
                     label: "main_0",
                     title: "Yaak Proxy",
                     inner_size: Some((1000.0, 700.0)),
-                    visible: true,
+                    visible: false,
                     hide_titlebar: true,
                     ..Default::default()
                 };