Add a push-to-talk voice input setting to allow users to toggle the spacebar recording feature

Author: robertpiosik

apps/editor/package.json

@@ -809,6 +809,10 @@
           "type": "string",
           "scope": "resource"
         },
+        "codeWebChat.voiceInputPushToTalk": {
+          "type": "boolean",
+          "scope": "resource"
+        },
         "codeWebChat.extendedCacheDurationForAnthropic": {
           "type": "boolean",
           "scope": "resource"

apps/editor/src/views/panel/backend/panel-provider.ts

@@ -328,6 +328,15 @@ export class PanelProvider implements vscode.WebviewViewProvider {
     })
   }
 
+  private _send_voice_input_push_to_talk() {
+    const config = vscode.workspace.getConfiguration('codeWebChat')
+    const enabled = config.get<boolean>('voiceInputPushToTalk', false)
+    this.send_message({
+      command: 'VOICE_INPUT_PUSH_TO_TALK',
+      enabled
+    })
+  }
+
   public async send_setup_progress() {
     const providers_manager = new ModelProvidersManager(this.context)
     const [providers, configs] = await Promise.all([
@@ -492,6 +501,10 @@ export class PanelProvider implements vscode.WebviewViewProvider {
         if (event.affectsConfiguration('codeWebChat.sendWithShiftEnter')) {
           this._send_send_with_shift_enter()
         }
+
+        if (event.affectsConfiguration('codeWebChat.voiceInputPushToTalk')) {
+          this._send_voice_input_push_to_talk()
+        }
       }
     )
 
@@ -1002,6 +1015,8 @@ export class PanelProvider implements vscode.WebviewViewProvider {
               this,
               message.shrink_source_code
             )
+          } else if (message.command == 'GET_VOICE_INPUT_PUSH_TO_TALK') {
+            this._send_voice_input_push_to_talk()
           }
         } catch (error: any) {
           Logger.error({

apps/editor/src/views/panel/frontend/Main/Main.tsx

@@ -80,6 +80,7 @@ type Props = {
   on_new_tab: () => void
   on_tab_delete: (index: number) => void
   missing_preset?: boolean
+  voice_input_push_to_talk: boolean
 }
 
 export const Main: React.FC<Props> = (props) => {
@@ -855,6 +856,7 @@ export const Main: React.FC<Props> = (props) => {
       on_tab_change={props.on_tab_change}
       on_new_tab={props.on_new_tab}
       on_tab_delete={props.on_tab_delete}
+      voice_input_push_to_talk={props.voice_input_push_to_talk}
     />
   )
 }

apps/editor/src/views/panel/frontend/Main/MainView/MainView.tsx

@@ -125,6 +125,7 @@ type Props = {
   on_tab_change: (index: number) => void
   on_new_tab: () => void
   on_tab_delete: (index: number) => void
+  voice_input_push_to_talk: boolean
 }
 
 export const MainView: React.FC<Props> = (props) => {
@@ -319,6 +320,7 @@ export const MainView: React.FC<Props> = (props) => {
               props.mode == MODE.API && props.configurations.length == 0
             }
             missing_preset={props.mode == MODE.WEB && props.presets.length == 0}
+            voice_input_push_to_talk={props.voice_input_push_to_talk}
           />
           <UiContextUtilisation
             current_context_size={props.token_count}

apps/editor/src/views/panel/frontend/Panel.tsx

@@ -82,7 +82,8 @@ export const Panel = () => {
     is_setup_complete,
     handle_tab_change,
     handle_new_tab,
-    handle_tab_delete
+    handle_tab_delete,
+    voice_input_push_to_talk
   } = use_panel(vscode)
 
   const {
@@ -432,6 +433,7 @@ export const Panel = () => {
                 on_tab_change={handle_tab_change}
                 on_new_tab={handle_new_tab}
                 on_tab_delete={handle_tab_delete}
+                voice_input_push_to_talk={voice_input_push_to_talk}
               />
             </div>
             <div

apps/editor/src/views/panel/frontend/hooks/panel/use-panel.ts

@@ -54,6 +54,8 @@ export const use_panel = (vscode: any) => {
     find_relevant_files_shrink_source_code,
     set_find_relevant_files_shrink_source_code
   ] = useState<boolean>(false)
+  const [voice_input_push_to_talk, set_voice_input_push_to_talk] =
+    useState(false)
 
   const handle_task_forward = (text: string) => {
     handle_instructions_change(text, 'edit-context')
@@ -152,6 +154,8 @@ export const use_panel = (vscode: any) => {
         set_find_relevant_files_shrink_source_code(message.shrink_source_code)
       } else if (message.command == 'RETURN_HOME') {
         set_active_view('home')
+      } else if (message.command == 'VOICE_INPUT_PUSH_TO_TALK') {
+        set_voice_input_push_to_talk(message.enabled)
       }
     }
     window.addEventListener('message', handle_message)
@@ -168,7 +172,8 @@ export const use_panel = (vscode: any) => {
       { command: 'GET_CHECKPOINTS' },
       { command: 'REQUEST_CAN_UNDO' },
       { command: 'GET_SETUP_PROGRESS' },
-      { command: 'GET_FIND_RELEVANT_FILES_SHRINK_SOURCE_CODE' }
+      { command: 'GET_FIND_RELEVANT_FILES_SHRINK_SOURCE_CODE' },
+      { command: 'GET_VOICE_INPUT_PUSH_TO_TALK' }
     ]
     initial_messages.forEach((message) => post_message(vscode, message))
 
@@ -296,6 +301,7 @@ export const use_panel = (vscode: any) => {
     handle_find_relevant_files_shrink_source_code_change,
     handle_tab_change,
     handle_new_tab,
-    handle_tab_delete
+    handle_tab_delete,
+    voice_input_push_to_talk
   }
 }

apps/editor/src/views/panel/types/messages.ts

@@ -561,6 +561,10 @@ export interface InsertSymbolAtCursorMessage extends BaseMessage {
   target: 'preset-prefix' | 'preset-suffix'
 }
 
+export interface GetVoiceInputPushToTalkMessage extends BaseMessage {
+  command: 'GET_VOICE_INPUT_PUSH_TO_TALK'
+}
+
 export type FrontendMessage =
   | GetInstructionsMessage
   | SaveInstructionsMessage
@@ -654,6 +658,7 @@ export type FrontendMessage =
   | SaveFindRelevantFilesShrinkSourceCodeMessage
   | GetSetupProgressMessage
   | RequestReturnHomeMessage
+  | GetVoiceInputPushToTalkMessage
 
 // === FROM BACKEND TO FRONTEND ===
 export interface InstructionsMessage extends BaseMessage {
@@ -917,6 +922,11 @@ export interface ReturnHomeMessage extends BaseMessage {
   command: 'RETURN_HOME'
 }
 
+export interface VoiceInputPushToTalkMessage extends BaseMessage {
+  command: 'VOICE_INPUT_PUSH_TO_TALK'
+  enabled: boolean
+}
+
 export type BackendMessage =
   | InstructionsMessage
   | FocusPromptFieldMessage
@@ -967,3 +977,4 @@ export type BackendMessage =
   | SetupProgressMessage
   | InsertSymbolAtCursorMessage
   | ReturnHomeMessage
+  | VoiceInputPushToTalkMessage

apps/editor/src/views/settings/backend/message-handlers/handle-get-voice-input-push-to-talk.ts

@@ -0,0 +1,13 @@
+import * as vscode from 'vscode'
+import { SettingsProvider } from '@/views/settings/backend/settings-provider'
+
+export const handle_get_voice_input_push_to_talk = async (
+  provider: SettingsProvider
+): Promise<void> => {
+  const config = vscode.workspace.getConfiguration('codeWebChat')
+  const enabled = config.get<boolean>('voiceInputPushToTalk', false)
+  provider.postMessage({
+    command: 'VOICE_INPUT_PUSH_TO_TALK',
+    enabled
+  })
+}

apps/editor/src/views/settings/backend/message-handlers/handle-update-voice-input-push-to-talk.ts

@@ -0,0 +1,14 @@
+import * as vscode from 'vscode'
+import { UpdateVoiceInputPushToTalkMessage } from '@/views/settings/types/messages'
+
+export const handle_update_voice_input_push_to_talk = async (
+  message: UpdateVoiceInputPushToTalkMessage
+): Promise<void> => {
+  await vscode.workspace
+    .getConfiguration('codeWebChat')
+    .update(
+      'voiceInputPushToTalk',
+      message.enabled || undefined,
+      vscode.ConfigurationTarget.Global
+    )
+}

apps/editor/src/views/settings/backend/message-handlers/index.ts

@@ -14,6 +14,8 @@ export * from './handle-update-commit-message-instructions'
 export * from './handle-get-include-prompts-in-commit-messages'
 export * from './handle-update-include-prompts-in-commit-messages'
 export * from './handle-get-voice-input-instructions'
+export * from './handle-get-voice-input-push-to-talk'
+export * from './handle-update-voice-input-push-to-talk'
 export * from './handle-update-voice-input-instructions'
 export * from './handle-get-clear-checks-in-workspace-behavior'
 export * from './handle-update-clear-checks-in-workspace-behavior'