fix: handle desktop event-sound playback URL and browse import errors

Author: jaaydenh

src/browser/App.tsx

@@ -1042,7 +1042,7 @@ function AppInner() {
       if (compaction?.hasContinueMessage) return;
 
       // Play event sound (independent of notification settings).
-      playEventSound(eventSoundSettingsRef.current, "agent_review_ready");
+      playEventSound(eventSoundSettingsRef.current, "agent_review_ready", api);
 
       // Skip notification if the selected workspace is focused (Slack-like behavior).
       // Notification suppression intentionally follows selection state, not chat-route visibility.

src/browser/features/Settings/Sections/SoundsSection.tsx

@@ -160,24 +160,30 @@ export function SoundsSection() {
       return;
     }
 
-    const result = await api.projects.pickAudioFile({});
-    if (result.filePath == null) {
-      return;
-    }
+    try {
+      const result = await api.projects.pickAudioFile({});
+      if (result.filePath == null) {
+        return;
+      }
 
-    const importedAsset = await api.eventSounds.importFromLocalPath({ localPath: result.filePath });
+      const importedAsset = await api.eventSounds.importFromLocalPath({
+        localPath: result.filePath,
+      });
 
-    applySettingsUpdate((prev) => {
-      const current = getEventSoundConfig(prev, key);
-      return updateEventSoundConfig(prev, key, {
-        ...current,
-        source: {
-          kind: "managed",
-          assetId: importedAsset.assetId,
-          label: importedAsset.originalName,
-        },
+      applySettingsUpdate((prev) => {
+        const current = getEventSoundConfig(prev, key);
+        return updateEventSoundConfig(prev, key, {
+          ...current,
+          source: {
+            kind: "managed",
+            assetId: importedAsset.assetId,
+            label: importedAsset.originalName,
+          },
+        });
       });
-    });
+    } catch {
+      // Best-effort only.
+    }
   };
 
   const handleUpload = async (key: EventSoundKey, file: File) => {

src/browser/utils/audio/eventSounds.test.ts

@@ -31,6 +31,11 @@ describe("eventSounds", () => {
     originalLocalStorage = globalThis.localStorage;
 
     globalThis.window = new GlobalWindow() as unknown as Window & typeof globalThis;
+    Object.defineProperty(globalThis.window, "api", {
+      value: undefined,
+      writable: true,
+      configurable: true,
+    });
     globalThis.document = globalThis.window.document;
     globalThis.Audio = MockAudio as unknown as typeof Audio;
     globalThis.localStorage = globalThis.window.localStorage;
@@ -85,4 +90,47 @@ describe("eventSounds", () => {
       "https://coder.example.com/@u/ws/apps/mux/assets/event-sounds/22222222-2222-2222-2222-222222222222.wav?token=stored-token"
     );
   });
+
+  test("uses API server status in desktop mode to build playback URL", async () => {
+    window.location.href = "file:///app/index.html";
+    Object.defineProperty(window, "api", {
+      value: {},
+      writable: true,
+      configurable: true,
+    });
+
+    const settings: EventSoundSettings = {
+      agent_review_ready: {
+        enabled: true,
+        source: {
+          kind: "managed",
+          assetId: "33333333-3333-3333-3333-333333333333.wav",
+        },
+      },
+    };
+
+    playEventSound(settings, "agent_review_ready", {
+      server: {
+        getApiServerStatus: () =>
+          Promise.resolve({
+            running: true,
+            baseUrl: "http://127.0.0.1:55525",
+            bindHost: "127.0.0.1",
+            port: 55525,
+            networkBaseUrls: [],
+            token: "desktop-token",
+            configuredBindHost: null,
+            configuredPort: null,
+            configuredServeWebUi: false,
+          }),
+      },
+    } as unknown as Parameters<typeof playEventSound>[2]);
+
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(lastAudioSource).toBe(
+      "http://127.0.0.1:55525/assets/event-sounds/33333333-3333-3333-3333-333333333333.wav?token=desktop-token"
+    );
+  });
 });

src/browser/utils/audio/eventSounds.ts

@@ -1,3 +1,4 @@
+import type { APIClient } from "@/browser/contexts/API";
 import { getStoredAuthToken } from "@/browser/components/AuthTokenModal/AuthTokenModal";
 import { getBrowserBackendBaseUrl } from "@/browser/utils/backendBaseUrl";
 import type { EventSoundSettings } from "@/common/config/schemas/appConfigOnDisk";
@@ -8,32 +9,62 @@ function getServerAuthToken(): string | null {
   return urlToken?.length ? urlToken : getStoredAuthToken();
 }
 
-function toManagedPlaybackPath(assetId: string): string {
-  // Browser mode can run behind a path-based app proxy (for example Coder),
-  // so resolve against the backend base URL instead of assuming "/".
-  const backendBaseUrl = getBrowserBackendBaseUrl();
-  const playbackUrl = new URL(
-    `assets/event-sounds/${encodeURIComponent(assetId)}`,
-    `${backendBaseUrl}/`
-  );
+function toManagedPlaybackPath(baseUrl: string, assetId: string, authToken: string | null): string {
+  const playbackUrl = new URL(`assets/event-sounds/${encodeURIComponent(assetId)}`, `${baseUrl}/`);
 
   // <audio> cannot attach Authorization headers, so pass the server token as
   // a query param when token-auth is in use.
-  const authToken = getServerAuthToken();
   if (authToken) {
     playbackUrl.searchParams.set("token", authToken);
   }
 
   return playbackUrl.toString();
 }
 
+function toBrowserManagedPlaybackPath(assetId: string): string {
+  // Browser mode can run behind a path-based app proxy (for example Coder),
+  // so resolve against the backend base URL instead of assuming "/".
+  return toManagedPlaybackPath(getBrowserBackendBaseUrl(), assetId, getServerAuthToken());
+}
+
+async function toDesktopManagedPlaybackPath(
+  assetId: string,
+  apiClient: APIClient | null | undefined
+): Promise<string | null> {
+  if (!apiClient?.server?.getApiServerStatus) {
+    return null;
+  }
+
+  try {
+    const apiServerStatus = await apiClient.server.getApiServerStatus();
+    if (!apiServerStatus.running || !apiServerStatus.baseUrl) {
+      return null;
+    }
+
+    return toManagedPlaybackPath(apiServerStatus.baseUrl, assetId, apiServerStatus.token);
+  } catch {
+    return null;
+  }
+}
+
+function playAudioFromPath(path: string, eventKey: EventSoundKey): void {
+  const audio = new Audio(path);
+  void audio.play().catch((error) => {
+    console.debug("Event sound playback failed", {
+      eventKey,
+      error: String(error),
+    });
+  });
+}
+
 /**
  * Attempt to play the configured sound for the given event key.
  * Fails silently with debug logging if no sound is configured or playback fails.
  */
 export function playEventSound(
   eventSoundSettings: EventSoundSettings | undefined,
-  eventKey: EventSoundKey
+  eventKey: EventSoundKey,
+  apiClient?: APIClient | null
 ): void {
   if (!eventSoundSettings) {
     return;
@@ -44,11 +75,16 @@ export function playEventSound(
     return;
   }
 
-  const audio = new Audio(toManagedPlaybackPath(config.source.assetId));
-  void audio.play().catch((error) => {
-    console.debug("Event sound playback failed", {
-      eventKey,
-      error: String(error),
-    });
+  if (!window.api) {
+    playAudioFromPath(toBrowserManagedPlaybackPath(config.source.assetId), eventKey);
+    return;
+  }
+
+  void toDesktopManagedPlaybackPath(config.source.assetId, apiClient).then((playbackPath) => {
+    if (!playbackPath) {
+      return;
+    }
+
+    playAudioFromPath(playbackPath, eventKey);
   });
 }