refactor(voice): provider-agnostic backend and in-app config

Switches the voice proxy to the OpenAI audio API (/v1/audio/transcriptions and
/v1/audio/speech) so it works with OpenAI, Groq, or a local server. Adds a
Settings -> Voice tab (base URL, API key, models, voice) plus a Quick Settings
toggle, and removes the bundled Python sidecar.

Review fixes: stop mic tracks on unmount, clear the global TTS stop handler and
revoke leaked blob URLs, add fetch timeouts in the proxy, surface mic errors in
the button, trim before appending transcripts, and drop the repo-wide wav ignore.
This commit is contained in:
newsbubbles
2026-06-09 10:05:06 +01:00
parent d05585e1f4
commit 711936d279
21 changed files with 367 additions and 365 deletions

View File

@@ -1,38 +1,37 @@
import { useEffect, useState } from 'react';
import { authenticatedFetch } from '../../../utils/api';
// Whether the optional voice feature is configured on the server (VOICE_SIDECAR_URL set).
// Probed once and cached app-wide so the mic/speak controls can hide themselves when off.
let cached: boolean | null = null;
let inflight: Promise<boolean> | null = null;
// Voice UI is gated on the `voiceEnabled` UI preference (toggled in Quick Settings /
// the Settings modal). This is a lightweight read-only view of that preference so the
// mic/speak controls can hide themselves, kept in sync via the same events
// useUiPreferences emits. No server probe.
const STORAGE_KEY = 'uiPreferences';
const SYNC_EVENT = 'ui-preferences:sync';
function probe(): Promise<boolean> {
if (cached !== null) return Promise.resolve(cached);
if (!inflight) {
inflight = authenticatedFetch('/api/voice/health')
.then((r) => (r.ok ? r.json() : { enabled: false }))
.then((d) => {
cached = Boolean(d?.enabled);
return cached;
})
.catch(() => {
cached = false;
return false;
});
function readVoiceEnabled(): boolean {
try {
const raw = localStorage.getItem(STORAGE_KEY);
if (!raw) return false;
const parsed = JSON.parse(raw);
return parsed?.voiceEnabled === true || parsed?.voiceEnabled === 'true';
} catch {
return false;
}
return inflight;
}
export function useVoiceAvailable(): boolean {
const [available, setAvailable] = useState<boolean>(cached ?? false);
const [enabled, setEnabled] = useState<boolean>(() =>
typeof window === 'undefined' ? false : readVoiceEnabled(),
);
useEffect(() => {
let mounted = true;
probe().then((v) => {
if (mounted) setAvailable(v);
});
const update = () => setEnabled(readVoiceEnabled());
window.addEventListener('storage', update);
window.addEventListener(SYNC_EVENT, update as EventListener);
return () => {
mounted = false;
window.removeEventListener('storage', update);
window.removeEventListener(SYNC_EVENT, update as EventListener);
};
}, []);
return available;
return enabled;
}