chore(services): update components based on recent changes

Changes:
 services/backend/src/ws/redis-bridge.ts                | 31 ++++++++++++++++++++-
 services/backend/src/ws/server.ts                      | 36 +++++++++++++++++++++++-
 services/frontend/src/App.tsx                          | 12 ++++----
 services/frontend/src/shared/hooks/useAudioPlayback.ts | 91 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-
 services/frontend/src/shared/hooks/useAudioTransmit.ts | 21 +++++---------
 5 files changed, 169 insertions(+), 22 deletions(-)

services/frontend/src/App.tsx

@@ -72,8 +72,7 @@ export default function App() {
   };
 
   const socket = useDashboardSocket({
-    onVoicePcmData: (d) =>
-      audio.handleIncomingPcm(d as { userId: string; pcm: string }),
+    onBinary: (d) => audio.handleIncomingBinary(d),
     onUserState: (users) =>
       setActiveSpeakers(
         (users as (ActiveSpeaker & { heardAt?: number })[]).map((u) => ({
@@ -81,17 +80,20 @@ export default function App() {
           heardAt: Date.now(),
         })),
       ),
-    onVoiceActiveUser: (data) =>
+    onVoiceActiveUser: (data) => {
+      const d = data as { userId?: string; id?: string; username: string; avatar: string; speaking: boolean };
+      if (d.userId) audio.registerUserId(d.userId);
       setActiveSpeakers((prev) =>
         updateSpeakerList(
           prev,
-          data as Partial<ActiveSpeaker> & {
+          d as Partial<ActiveSpeaker> & {
             userId?: string;
             id?: string;
             speaking: boolean;
           },
         ),
-      ),
+      );
+    },
     onVoiceRecordingStarted: () =>
       window.dispatchEvent(new CustomEvent("voice_recording_uploaded")),
     onVoiceRecordingStopped: () =>