From f0893e999f09bba0b9c7685a2c53cea8088489c4 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 5 Aug 2026 19:20:56 +0100
Subject: [PATCH] feat(web): test completion sounds from settings

---
 .../components/settings/SettingsPanels.tsx    | 50 +++++++++++--------
 1 file changed, 30 insertions(+), 20 deletions(-)

diff --git a/apps/web/src/components/settings/SettingsPanels.tsx b/apps/web/src/components/settings/SettingsPanels.tsx
index 2978547fe0e..c413fa85f2d 100644
--- a/apps/web/src/components/settings/SettingsPanels.tsx
+++ b/apps/web/src/components/settings/SettingsPanels.tsx
@@ -86,6 +86,7 @@ import {
 import { usePrimaryEnvironment } from "../../state/environments";
 import { useProjects } from "../../state/entities";
 import { useArchivedThreadSnapshots } from "../../lib/archivedThreadsState";
+import { playCompletionSound } from "../../lib/completionSound";
 import { formatRelativeTimeLabel, getRelativeTimeState } from "../../timestampFormat";
 import { Button } from "../ui/button";
 import {
@@ -1328,26 +1329,35 @@ export function GeneralSettingsPanel() {
             ) : null
           }
           control={
-            <Select
-              value={settings.completionSound}
-              onValueChange={(value) => {
-                if (value === "none" || value === "chime") {
-                  updateSettings({ completionSound: value });
-                }
-              }}
-            >
-              <SelectTrigger className="w-full sm:w-40" aria-label="Completion sound">
-                <SelectValue>{COMPLETION_SOUND_LABELS[settings.completionSound]}</SelectValue>
-              </SelectTrigger>
-              <SelectPopup align="end" alignItemWithTrigger={false}>
-                <SelectItem hideIndicator value="none">
-                  {COMPLETION_SOUND_LABELS.none}
-                </SelectItem>
-                <SelectItem hideIndicator value="chime">
-                  {COMPLETION_SOUND_LABELS.chime}
-                </SelectItem>
-              </SelectPopup>
-            </Select>
+            <>
+              <Select
+                value={settings.completionSound}
+                onValueChange={(value) => {
+                  if (value === "none" || value === "chime") {
+                    updateSettings({ completionSound: value });
+                  }
+                }}
+              >
+                <SelectTrigger className="w-full sm:w-40" aria-label="Completion sound">
+                  <SelectValue>{COMPLETION_SOUND_LABELS[settings.completionSound]}</SelectValue>
+                </SelectTrigger>
+                <SelectPopup align="end" alignItemWithTrigger={false}>
+                  <SelectItem hideIndicator value="none">
+                    {COMPLETION_SOUND_LABELS.none}
+                  </SelectItem>
+                  <SelectItem hideIndicator value="chime">
+                    {COMPLETION_SOUND_LABELS.chime}
+                  </SelectItem>
+                </SelectPopup>
+              </Select>
+              <Button
+                variant="outline"
+                disabled={settings.completionSound === "none"}
+                onClick={() => playCompletionSound(settings.completionSound)}
+              >
+                Test
+              </Button>
+            </>
           }
         />