Summary

Adds a microphone button to the agent chat input for browser-native voice-to-text transcription using the Web Speech API.

Changes

New: site/src/hooks/useSpeechRecognition.ts

• Custom React hook wrapping the Web Speech API (SpeechRecognition / webkitSpeechRecognition)
• Feature-detects browser support via isSupported
• Provides start(), stop(), and cancel() controls
• Accumulates real-time transcript from interim and final recognition results
• Inline TypeScript declarations for the Web Speech API types

Modified: site/src/pages/AgentsPage/AgentChatInput.tsx

• Mic button: Appears to the right of the image attach button when the browser supports the Speech Recognition API. Shows a microphone icon when idle, X icon when recording.
• Send button: Transforms into a checkmark during recording to accept the transcription. Always enabled during recording.
• Editor sync: Live-updates the Lexical editor with the transcription as the user speaks. Preserves any pre-existing text.
• Cancel: Restores the editor to its pre-recording content.

How it works

1. User clicks the mic button → recording starts, real-time transcript appears in the editor
2. User clicks the checkmark (send button) → recording stops, transcribed text stays
3. User clicks X (mic button) → recording stops, editor reverts to original content