feat(plugins): read files from a thread workspace

apps/desktop/src/electron/ElectronProtocol.test.ts

@@ -99,7 +99,7 @@ describe("ElectronProtocol", () => {
           assert.equal(yield* Effect.promise(() => response.text()), "ok");
           assert.include(
             response.headers.get("content-security-policy") ?? "",
-            "script-src 'self' 'unsafe-inline' 'wasm-unsafe-eval' https://clerk.t3.codes https://challenges.cloudflare.com",
+            "script-src 'self' 'unsafe-inline' 'wasm-unsafe-eval' blob: https://clerk.t3.codes https://challenges.cloudflare.com",
           );
           assert.include(
             response.headers.get("content-security-policy") ?? "",
@@ -111,7 +111,7 @@ describe("ElectronProtocol", () => {
           );
           assert.include(
             response.headers.get("content-security-policy") ?? "",
-            "font-src 'self' t3code-dev: data:",
+            "font-src 'self' t3code-dev: blob: data:",
           );
         }),
       );

apps/desktop/src/electron/ElectronProtocol.ts

@@ -74,6 +74,8 @@ function makeDesktopContentSecurityPolicy(input: DesktopProtocolRegistrationInpu
     "'self'",
     "'unsafe-inline'",
     "'wasm-unsafe-eval'",
+    // Only the page holds each environment's credentials, so plugin bundles it fetches run from blob URLs.
+    "blob:",
     ...(clerkOrigin ? [clerkOrigin] : []),
     "https://challenges.cloudflare.com",
   ];
@@ -89,7 +91,8 @@ function makeDesktopContentSecurityPolicy(input: DesktopProtocolRegistrationInpu
     `img-src 'self' ${input.scheme}: blob: data: http: https:`,
     `media-src 'self' ${input.scheme}: blob: http: https:`,
     "style-src 'self' 'unsafe-inline'",
-    `font-src 'self' ${input.scheme}: data:`,
+    // `blob:` for fonts a plugin ships, which reach the page through `api.assetUrl`.
+    `font-src 'self' ${input.scheme}: blob: data:`,
     "worker-src 'self' blob:",
     "frame-src 'self' blob: http: https:",
     "object-src 'self' blob: http: https:",

apps/desktop/src/ipc/DesktopIpcHandlers.ts

@@ -53,6 +53,7 @@ import {
   pickProjectFavicon,
   pickThemeFiles,
   setTheme,
+  setWindowBackground,
   syncHtmlFullscreen,
   showContextMenu,
 } from "./methods/window.ts";
@@ -148,6 +149,7 @@ export const installDesktopIpcHandlers = Effect.fn("desktop.ipc.installHandlers"
   yield* ipc.handle(pickProjectFavicon);
   yield* ipc.handle(pickThemeFiles);
   yield* ipc.handle(setTheme);
+  yield* ipc.handle(setWindowBackground);
   yield* ipc.handle(showContextMenu);
   yield* ipc.handle(openExternal);
   yield* ipc.handle(readMedia);

apps/desktop/src/ipc/channels.ts

@@ -3,6 +3,7 @@ export const SET_NOTIFICATION_BADGE_CHANNEL = "desktop:set-notification-badge";
 export const PICK_PROJECT_FAVICON_CHANNEL = "desktop:pick-project-favicon";
 export const PICK_THEME_FILES_CHANNEL = "desktop:pick-theme-files";
 export const SET_THEME_CHANNEL = "desktop:set-theme";
+export const SET_WINDOW_BACKGROUND_CHANNEL = "desktop:set-window-background";
 export const CONTEXT_MENU_CHANNEL = "desktop:context-menu";
 export const OPEN_EXTERNAL_CHANNEL = "desktop:open-external";
 export const READ_MEDIA_CHANNEL = "desktop:read-media";

apps/desktop/src/ipc/methods/window.ts

@@ -4,6 +4,7 @@ import {
   DesktopEnvironmentBootstrapSchema,
   DesktopMediaReadSchema,
   DesktopThemeSchema,
+  DesktopWindowBackgroundSchema,
   EDITORS,
   EditorId,
   PickedThemeFileSchema,
@@ -41,6 +42,7 @@ import * as ElectronTheme from "../../electron/ElectronTheme.ts";
 import * as ElectronWindow from "../../electron/ElectronWindow.ts";
 import * as Electron from "electron";
 import * as MacPermissions from "../../permissions/MacPermissions.ts";
+import * as DesktopWindow from "../../window/DesktopWindow.ts";
 import { safariPermissionCheck } from "../../preview/BrowserImport/SafariPermission.ts";
 import * as IpcChannels from "../channels.ts";
 import * as DesktopIpc from "../DesktopIpc.ts";
@@ -300,6 +302,17 @@ export const setTheme = DesktopIpc.makeIpcMethod({
   }),
 });
 
+export const setWindowBackground = DesktopIpc.makeIpcMethod({
+  channel: IpcChannels.SET_WINDOW_BACKGROUND_CHANNEL,
+  payload: DesktopWindowBackgroundSchema,
+  result: Schema.Void,
+  handler: Effect.fn("desktop.ipc.window.setWindowBackground")(function* (background) {
+    const appSettings = yield* DesktopAppSettings.DesktopAppSettings;
+    const change = yield* appSettings.setWindowBackground(background);
+    if (change.changed) yield* (yield* DesktopWindow.DesktopWindow).syncAppearance;
+  }),
+});
+
 export const showContextMenu = DesktopIpc.makeIpcMethod({
   channel: IpcChannels.CONTEXT_MENU_CHANNEL,
   payload: ContextMenuInput,

apps/desktop/src/preload.ts

@@ -242,6 +242,8 @@ contextBridge.exposeInMainWorld("desktopBridge", {
     ipcRenderer.invoke(IpcChannels.PICK_PROJECT_FAVICON_CHANNEL, initialPath),
   pickThemeFiles: () => ipcRenderer.invoke(IpcChannels.PICK_THEME_FILES_CHANNEL, undefined),
   setTheme: (theme) => ipcRenderer.invoke(IpcChannels.SET_THEME_CHANNEL, theme),
+  setWindowBackground: (background) =>
+    ipcRenderer.invoke(IpcChannels.SET_WINDOW_BACKGROUND_CHANNEL, background),
   showContextMenu: (items, position) =>
     ipcRenderer.invoke(IpcChannels.CONTEXT_MENU_CHANNEL, {
       items,

apps/desktop/src/settings/DesktopAppSettings.test.ts

@@ -1,5 +1,6 @@
 import * as NodeCrypto from "@effect/platform-node/NodeCrypto";
 import * as NodeServices from "@effect/platform-node/NodeServices";
+import { DesktopWindowBackgroundSchema } from "@t3tools/contracts";
 import { assert, describe, it } from "@effect/vitest";
 import * as Effect from "effect/Effect";
 import * as FileSystem from "effect/FileSystem";
@@ -35,6 +36,7 @@ const DesktopSettingsPatch = Schema.Struct({
   wslMode: Schema.optionalKey(Schema.Literals(["local", "wsl"])),
   wslDistro: Schema.optionalKey(Schema.NullOr(Schema.String)),
   wslOnly: Schema.optionalKey(Schema.Boolean),
+  windowCanvases: Schema.optionalKey(DesktopWindowBackgroundSchema),
 });
 
 const decodeDesktopSettingsPatch = Schema.decodeEffect(Schema.fromJsonString(DesktopSettingsPatch));
@@ -191,6 +193,7 @@ describe("DesktopSettings", () => {
           wslBackendEnabled: false,
           wslOnly: false,
           wslDistro: null,
+          windowBackground: null,
         } satisfies DesktopAppSettings.DesktopSettings);
       }),
     ),
@@ -229,6 +232,11 @@ describe("DesktopSettings", () => {
 
         yield* settings.setMainWindowBounds({ x: -1200, y: 40, width: 400, height: 360 }, true);
         yield* settings.setServerExposureMode("network-accessible");
+        const windowBackground = {
+          light: { appearance: "light", color: "#f4f4f4" },
+          dark: { appearance: "dark", color: "#151515" },
+        } as const;
+        yield* settings.setWindowBackground(windowBackground);
 
         const persisted = yield* decodeDesktopSettingsPatch(
           yield* fileSystem.readFileString(environment.desktopSettingsPath),
@@ -237,6 +245,7 @@ describe("DesktopSettings", () => {
           mainWindowBounds: { x: -1200, y: 40, width: 400, height: 360 },
           mainWindowMaximized: true,
           serverExposureMode: "network-accessible",
+          windowCanvases: windowBackground,
         } satisfies typeof DesktopSettingsPatch.Type);
 
         const restored = yield* Effect.gen(function* () {
@@ -245,6 +254,7 @@ describe("DesktopSettings", () => {
         }).pipe(Effect.provide(DesktopAppSettings.layer));
         assert.deepEqual(restored.mainWindowBounds, persisted.mainWindowBounds);
         assert.isTrue(restored.mainWindowMaximized);
+        assert.deepEqual(restored.windowBackground, windowBackground);
       }),
     ),
   );
@@ -322,6 +332,7 @@ describe("DesktopSettings", () => {
           wslBackendEnabled: false,
           wslOnly: false,
           wslDistro: null,
+          windowBackground: null,
         } satisfies DesktopAppSettings.DesktopSettings);
       }),
       { appVersion: "0.0.17-nightly.20260415.1" },
@@ -351,6 +362,7 @@ describe("DesktopSettings", () => {
           wslBackendEnabled: false,
           wslOnly: false,
           wslDistro: null,
+          windowBackground: null,
         } satisfies DesktopAppSettings.DesktopSettings);
       }),
       { appVersion: "0.0.17-nightly.20260415.1" },

apps/desktop/src/settings/DesktopAppSettings.ts

@@ -1,8 +1,11 @@
 import {
   DesktopServerExposureModeSchema,
   DesktopUpdateChannelSchema,
+  DesktopWindowBackgroundSchema,
   type DesktopServerExposureMode,
   type DesktopUpdateChannel,
+  type DesktopWindowBackground,
+  type DesktopWindowCanvas,
 } from "@t3tools/contracts";
 import { fromLenientJson } from "@t3tools/shared/schemaJson";
 import { resolveSymlinkTarget } from "@t3tools/shared/symlink";
@@ -39,6 +42,8 @@ export interface DesktopSettings {
   readonly wslDistro: string | null;
   // Requires restart because the pool chooses its primary spec at layer initialization.
   readonly wslOnly: boolean;
+  /** The renderer's theme canvases, painted before the page loads. */
+  readonly windowBackground: DesktopWindowBackground | null;
 }
 
 export interface DesktopSettingsChange {
@@ -79,6 +84,7 @@ export const DEFAULT_DESKTOP_SETTINGS: DesktopSettings = {
   wslBackendEnabled: false,
   wslDistro: null,
   wslOnly: false,
+  windowBackground: null,
 };
 
 const DesktopWindowBoundsDocument = Schema.Struct({
@@ -102,6 +108,7 @@ const DesktopSettingsDocument = Schema.Struct({
   wslMode: Schema.optionalKey(Schema.Literals(["local", "wsl"])),
   wslDistro: Schema.optionalKey(Schema.NullOr(Schema.String)),
   wslOnly: Schema.optionalKey(Schema.Boolean),
+  windowCanvases: Schema.optionalKey(Schema.Unknown),
 });
 
 type DesktopSettingsDocument = typeof DesktopSettingsDocument.Type;
@@ -112,6 +119,8 @@ const decodeDesktopSettingsJson = Schema.decodeEffect(DesktopSettingsJson);
 const encodeDesktopSettingsJson = Schema.encodeEffect(DesktopSettingsJson);
 const decodeDesktopWindowBounds = Schema.decodeUnknownOption(DesktopWindowBoundsSchema);
 const desktopWindowBoundsEquivalence = Schema.toEquivalence(DesktopWindowBoundsSchema);
+const decodeDesktopWindowBackground = Schema.decodeUnknownOption(DesktopWindowBackgroundSchema);
+const desktopWindowBackgroundEquivalence = Schema.toEquivalence(DesktopWindowBackgroundSchema);
 
 const settingsChange = (settings: DesktopSettings, changed: boolean): DesktopSettingsChange => ({
   settings,
@@ -172,6 +181,9 @@ export class DesktopAppSettings extends Context.Service<
     readonly setWslOnly: (
       enabled: boolean,
     ) => Effect.Effect<DesktopSettingsChange, DesktopSettingsWriteError>;
+    readonly setWindowBackground: (
+      background: DesktopWindowBackground,
+    ) => Effect.Effect<DesktopSettingsChange, DesktopSettingsWriteError>;
     readonly applyWslWindowsFallback: Effect.Effect<
       DesktopSettingsChange,
       DesktopSettingsWriteError
@@ -197,6 +209,21 @@ function normalizeWslDistro(value: unknown): string | null {
   return typeof value === "string" && isValidDistroName(value) ? value : null;
 }
 
+function normalizeWindowColor(value: unknown): string | null {
+  return typeof value === "string" && /^#[0-9a-f]{6}$/i.test(value) ? value.toLowerCase() : null;
+}
+
+function normalizeWindowBackground(value: unknown): DesktopWindowBackground | null {
+  const canvas = ({ appearance, color }: DesktopWindowCanvas): DesktopWindowCanvas => ({
+    appearance,
+    color: normalizeWindowColor(color),
+  });
+  return Option.match(decodeDesktopWindowBackground(value), {
+    onNone: () => null,
+    onSome: (background) => ({ light: canvas(background.light), dark: canvas(background.dark) }),
+  });
+}
+
 export function normalizeMainWindowBounds(value: unknown): DesktopWindowBounds | null {
   return Option.getOrNull(decodeDesktopWindowBounds(value));
 }
@@ -233,6 +260,7 @@ function normalizeDesktopSettingsDocument(
     wslBackendEnabled,
     wslDistro: normalizeWslDistro(parsed.wslDistro),
     wslOnly: parsed.wslOnly === true,
+    windowBackground: normalizeWindowBackground(parsed.windowCanvases),
   };
 }
 
@@ -279,6 +307,9 @@ function toDesktopSettingsDocument(
   if (settings.wslOnly !== defaults.wslOnly) {
     document.wslOnly = settings.wslOnly;
   }
+  if (settings.windowBackground !== null) {
+    document.windowCanvases = settings.windowBackground;
+  }
 
   return document;
 }
@@ -369,6 +400,18 @@ function setWslOnly(settings: DesktopSettings, enabled: boolean): DesktopSetting
       };
 }
 
+function setWindowBackground(
+  settings: DesktopSettings,
+  background: DesktopWindowBackground,
+): DesktopSettings {
+  const normalized = normalizeWindowBackground(background);
+  return settings.windowBackground !== null &&
+    normalized !== null &&
+    desktopWindowBackgroundEquivalence(settings.windowBackground, normalized)
+    ? settings
+    : { ...settings, windowBackground: normalized };
+}
+
 function setLocalEnvironmentEnabled(settings: DesktopSettings, enabled: boolean): DesktopSettings {
   return settings.localEnvironmentEnabled === enabled
     ? settings
@@ -561,6 +604,14 @@ export const make = Effect.gen(function* () {
 
       return yield* persist((settings) => setWslOnly(settings, enabled));
     }),
+    setWindowBackground: Effect.fn("desktop.settings.setWindowBackground")(function* (background) {
+      yield* Effect.annotateCurrentSpan({
+        light: background.light.color,
+        dark: background.dark.color,
+      });
+
+      return yield* persist((settings) => setWindowBackground(settings, background));
+    }),
     setLocalEnvironmentEnabled: Effect.fn("desktop.settings.setLocalEnvironmentEnabled")(
       function* (enabled) {
         yield* Effect.annotateCurrentSpan({ enabled });
@@ -626,6 +677,11 @@ export const layerTest = (initialSettings: DesktopSettings = DEFAULT_DESKTOP_SET
         setWslOnly: Effect.fn("DesktopAppSettings.setWslOnly")(function (enabled) {
           return update((settings) => setWslOnly(settings, enabled));
         }),
+        setWindowBackground: Effect.fn("DesktopAppSettings.setWindowBackground")(
+          function (background) {
+            return update((settings) => setWindowBackground(settings, background));
+          },
+        ),
         setLocalEnvironmentEnabled: Effect.fn("DesktopAppSettings.setLocalEnvironmentEnabled")(
           function (enabled) {
             return update((settings) => setLocalEnvironmentEnabled(settings, enabled));

apps/desktop/src/updates/updatesTestHarness.ts

@@ -231,6 +231,7 @@ export function makeHarness(options: UpdatesHarnessOptions = {}) {
           setWslDistro: () => Effect.die("unexpected WSL distro change"),
           setLocalEnvironmentEnabled: () => Effect.die("unexpected local environment toggle"),
           setWslOnly: () => Effect.die("unexpected WSL-only toggle"),
+          setWindowBackground: () => Effect.die("unexpected window background update"),
           applyWslWindowsFallback: Effect.die("unexpected WSL Windows fallback"),
           applyWslWindowsFallbackInMemory: Effect.die("unexpected WSL Windows fallback"),
         } satisfies DesktopAppSettings.DesktopAppSettings["Service"])

apps/desktop/src/window/DesktopWindow.test.ts

@@ -276,6 +276,7 @@ function layerTest(input: {
     setWslBackendEnabled: () => Effect.die("unexpected WSL backend toggle"),
     setWslDistro: () => Effect.die("unexpected WSL distro change"),
     setWslOnly: () => Effect.die("unexpected WSL-only toggle"),
+    setWindowBackground: () => Effect.die("unexpected window background update"),
     setLocalEnvironmentEnabled: () => Effect.die("unexpected local environment toggle"),
     applyWslWindowsFallback: Effect.die("unexpected WSL Windows fallback"),
     applyWslWindowsFallbackInMemory: Effect.die("unexpected WSL Windows fallback"),
@@ -513,6 +514,33 @@ describe("DesktopWindow", () => {
     }
   });
 
+  it("starts windows in the canvas the page paints in the current appearance", () => {
+    const surface = {
+      light: { appearance: "light", color: "#f4f4f4" },
+      dark: { appearance: "dark", color: "#151515" },
+    } as const;
+    const pinnedDark = {
+      light: { appearance: "dark", color: "#151515" },
+      dark: { appearance: "dark", color: "#151515" },
+    } as const;
+    const plain = {
+      light: { appearance: "light", color: null },
+      dark: { appearance: "dark", color: null },
+    } as const;
+    for (const [shouldUseDarkColors, background, expected] of [
+      [false, surface, { color: "#f4f4f4", dark: false }],
+      [true, surface, { color: "#151515", dark: true }],
+      [false, pinnedDark, { color: "#151515", dark: true }],
+      [true, plain, { color: "#000000", dark: true }],
+      [false, null, { color: "#ffffff", dark: false }],
+    ] as const) {
+      assert.deepEqual(
+        DesktopWindow.resolveWindowCanvas(shouldUseDarkColors, background),
+        expected,
+      );
+    }
+  });
+
   it("rejects renderer navigations whose origin only serializes as null", () => {
     for (const applicationUrl of ["t3code://app/", "t3code-dev://app/"]) {
       assert.isTrue(