From f68f360386f431ea2cc2014eba7080e58349d68d Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Sat, 31 Oct 2026 22:45:47 -0500
Subject: [PATCH] fix live audio settings and trigger highlights

- start each camera group's audio from that group's saved settings instead of merging every group
- don't clear the previous trigger's highlight timeout when another trigger fires
---
 web/src/views/live/DraggableGridLayout.tsx | 20 +++++++-------------
 web/src/views/live/LiveDashboardView.tsx   | 20 +++++++-------------
 web/src/views/settings/TriggerView.tsx     |  6 +++---
 3 files changed, 17 insertions(+), 29 deletions(-)

diff --git a/web/src/views/live/DraggableGridLayout.tsx b/web/src/views/live/DraggableGridLayout.tsx
index 4439a95ac1..4599e6a41f 100644
--- a/web/src/views/live/DraggableGridLayout.tsx
+++ b/web/src/views/live/DraggableGridLayout.tsx
@@ -575,25 +575,19 @@ export default function DraggableGridLayout({
   };
 
   useEffect(() => {
-    if (!allGroupsStreamingSettings) {
-      return;
-    }
-
     const initialAudioStates: AudioState = {};
     const initialVolumeStates: VolumeState = {};
 
-    Object.entries(allGroupsStreamingSettings).forEach(([_, groupSettings]) => {
-      if (groupSettings) {
-        Object.entries(groupSettings).forEach(([camera, cameraSettings]) => {
-          initialAudioStates[camera] = cameraSettings.playAudio ?? false;
-          initialVolumeStates[camera] = cameraSettings.volume ?? 1;
-        });
-      }
-    });
+    Object.entries(currentGroupStreamingSettings ?? {}).forEach(
+      ([camera, cameraSettings]) => {
+        initialAudioStates[camera] = cameraSettings.playAudio ?? false;
+        initialVolumeStates[camera] = cameraSettings.volume ?? 1;
+      },
+    );
 
     setAudioStates(initialAudioStates);
     setVolumeStates(initialVolumeStates);
-  }, [allGroupsStreamingSettings]);
+  }, [currentGroupStreamingSettings, cameraGroup]);
 
   const toggleAudio = (cameraName: string) => {
     setAudioStates((prev) => ({
diff --git a/web/src/views/live/LiveDashboardView.tsx b/web/src/views/live/LiveDashboardView.tsx
index 6f91ed7b70..fd804becdf 100644
--- a/web/src/views/live/LiveDashboardView.tsx
+++ b/web/src/views/live/LiveDashboardView.tsx
@@ -326,25 +326,19 @@ export default function LiveDashboardView({
   };
 
   useEffect(() => {
-    if (!allGroupsStreamingSettings) {
-      return;
-    }
-
     const initialAudioStates: AudioState = {};
     const initialVolumeStates: VolumeState = {};
 
-    Object.entries(allGroupsStreamingSettings).forEach(([_, groupSettings]) => {
-      if (groupSettings) {
-        Object.entries(groupSettings).forEach(([camera, cameraSettings]) => {
-          initialAudioStates[camera] = cameraSettings.playAudio ?? false;
-          initialVolumeStates[camera] = cameraSettings.volume ?? 1;
-        });
-      }
-    });
+    Object.entries(currentGroupStreamingSettings ?? {}).forEach(
+      ([camera, cameraSettings]) => {
+        initialAudioStates[camera] = cameraSettings.playAudio ?? false;
+        initialVolumeStates[camera] = cameraSettings.volume ?? 1;
+      },
+    );
 
     setAudioStates(initialAudioStates);
     setVolumeStates(initialVolumeStates);
-  }, [allGroupsStreamingSettings]);
+  }, [currentGroupStreamingSettings, cameraGroup]);
 
   const toggleAudio = (cameraName: string): void => {
     setAudioStates((prev) => ({
diff --git a/web/src/views/settings/TriggerView.tsx b/web/src/views/settings/TriggerView.tsx
index 4cf7557aa7..9910e43020 100644
--- a/web/src/views/settings/TriggerView.tsx
+++ b/web/src/views/settings/TriggerView.tsx
@@ -148,13 +148,13 @@ export default function TriggerView({
       return current;
     });
 
-    const timeout = setTimeout(() => {
+    // not cleared on the next payload, or a second trigger firing within
+    // 3s would leave this one highlighted
+    setTimeout(() => {
       setTriggeredTrigger((prev) =>
         (prev || []).filter((name) => name !== triggers_status_ws.name),
       );
     }, 3000);
-
-    return () => clearTimeout(timeout);
   }, [triggers_status_ws, selectedCamera, mutate]);
 
   useEffect(() => {