From 5c8fa3d254d65f1aab849a5447951d10004f96b4 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sat, 13 Jun 2026 16:54:52 +0700
Subject: [PATCH] chore(services): update components based on recent changes

Changes:
 services/frontend/src/App.tsx                                          | 22 ++++++++++++++++++++++
 services/frontend/src/features/live/components/VoiceConnectionCard.tsx |  5 ++++-
 2 files changed, 26 insertions(+), 1 deletion(-)
---
 services/frontend/src/App.tsx                 | 22 +++++++++++++++++++
 .../live/components/VoiceConnectionCard.tsx   |  5 ++++-
 2 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/services/frontend/src/App.tsx b/services/frontend/src/App.tsx
index 8a9e510..b0426e7 100644
--- a/services/frontend/src/App.tsx
+++ b/services/frontend/src/App.tsx
@@ -192,6 +192,28 @@ export default function App() {
     return () => clearInterval(interval);
   }, []);
 
+  // Push-to-Talk — hold Space to transmit
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement || e.target instanceof HTMLSelectElement) return;
+      if (e.code === "Space" && !transmit.isStreaming && e.repeat === false) {
+        e.preventDefault();
+        transmit.startTransmit().catch(() => undefined);
+      }
+    };
+    const handleKeyUp = (e: KeyboardEvent) => {
+      if (e.code === "Space" && transmit.isStreaming) {
+        transmit.stopTransmit();
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    window.addEventListener("keyup", handleKeyUp);
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+      window.removeEventListener("keyup", handleKeyUp);
+    };
+  }, [transmit]);
+
   return (
     <DashboardLayout
       activeTab={activeTab}
diff --git a/services/frontend/src/features/live/components/VoiceConnectionCard.tsx b/services/frontend/src/features/live/components/VoiceConnectionCard.tsx
index 8edb7f9..59fbab2 100644
--- a/services/frontend/src/features/live/components/VoiceConnectionCard.tsx
+++ b/services/frontend/src/features/live/components/VoiceConnectionCard.tsx
@@ -104,7 +104,10 @@ export function VoiceConnectionCard({
             {isStreaming ? "Stop Transmit" : "Transmit"}
           </Button>
           {isStreaming && (
-            <div className="flex items-center pl-1">
+            <div className="flex items-center gap-2 pl-1">
+              <span className="animate-pulse rounded-full bg-emerald-500 px-2 py-0.5 text-xs font-medium text-white">
+                Hold Space
+              </span>
               <MicLevelMeter level={micLevel} />
             </div>
           )}