fix: add groq stt controls to workspace settings (#347)

Co-authored-by: Aurora release bot <release@outsourc-e.com>
This commit is contained in:
Eric
2026-05-05 16:46:18 -04:00
committed by GitHub
parent 838b060702
commit 491a152b33
4 changed files with 117 additions and 5 deletions

View File

@@ -24,6 +24,7 @@ import type { LoaderStyle } from '@/hooks/use-chat-settings'
import type { BrailleSpinnerPreset } from '@/components/ui/braille-spinner'
import type { ThemeId } from '@/lib/theme'
import type {LocaleId} from '@/lib/i18n';
import { GROQ_STT_MODELS, STT_PROVIDER_OPTIONS } from '@/lib/stt-config'
import { Button } from '@/components/ui/button'
import { Switch } from '@/components/ui/switch'
import { applyTheme, useSettings } from '@/hooks/use-settings'
@@ -1845,6 +1846,9 @@ function VoiceContent() {
}
const ttsProvider = String(tts.provider || 'edge')
const sttProvider = String(stt.provider || 'local')
const sttGroq =
(stt.groq as Record<string, unknown> | undefined) || {}
return (
<div className="space-y-4">
@@ -1917,14 +1921,47 @@ function VoiceContent() {
</Row>
<Row label="STT Provider">
<select
value={String(stt.provider || 'local')}
value={sttProvider}
onChange={(e) => saveStt('provider', e.target.value)}
className="h-8 rounded-lg border border-primary-200 bg-primary-50 px-2 text-sm text-primary-900 outline-none dark:border-neutral-700 dark:bg-neutral-900 dark:text-neutral-100"
>
<option value="local">Local (Whisper)</option>
<option value="openai">OpenAI Whisper</option>
{STT_PROVIDER_OPTIONS.map((provider) => (
<option key={provider.value} value={provider.value}>
{provider.label}
</option>
))}
</select>
</Row>
{sttProvider === 'groq' && (
<>
<Row label="Groq model">
<select
value={String(sttGroq.model || GROQ_STT_MODELS[0])}
onChange={(e) =>
saveStt('groq', {
...sttGroq,
model: e.target.value,
})
}
className="h-8 rounded-lg border border-primary-200 bg-primary-50 px-2 text-sm text-primary-900 outline-none dark:border-neutral-700 dark:bg-neutral-900 dark:text-neutral-100"
>
{GROQ_STT_MODELS.map((model) => (
<option key={model} value={model}>
{model}
</option>
))}
</select>
</Row>
<Row label="Language" description="Optional BCP-47 code, e.g. en or en-US.">
<Input
value={String(stt.language || '')}
onChange={(e) => saveStt('language', e.target.value)}
placeholder="auto"
className="h-8 w-40"
/>
</Row>
</>
)}
</div>
</div>
)

View File

@@ -0,0 +1,20 @@
import { describe, expect, it } from 'vitest'
import { GROQ_STT_MODELS, STT_PROVIDER_OPTIONS } from './stt-config'
describe('stt config', () => {
it('includes groq as a selectable STT provider', () => {
expect(STT_PROVIDER_OPTIONS).toContainEqual({
value: 'groq',
label: 'Groq Whisper API',
})
})
it('lists the supported Groq Whisper models in priority order', () => {
expect(GROQ_STT_MODELS).toEqual([
'whisper-large-v3-turbo',
'whisper-large-v3',
'distil-whisper-large-v3-en',
])
})
})

11
src/lib/stt-config.ts Normal file
View File

@@ -0,0 +1,11 @@
export const STT_PROVIDER_OPTIONS = [
{ value: 'local', label: 'Local (Whisper)' },
{ value: 'openai', label: 'OpenAI Whisper API' },
{ value: 'groq', label: 'Groq Whisper API' },
] as const
export const GROQ_STT_MODELS = [
'whisper-large-v3-turbo',
'whisper-large-v3',
'distil-whisper-large-v3-en',
] as const

View File

@@ -21,6 +21,7 @@ import type { BrailleSpinnerPreset } from '@/components/ui/braille-spinner'
import type { ThemeId } from '@/lib/theme'
import type { SettingsNavId } from '@/components/settings/settings-sidebar'
import type {LocaleId} from '@/lib/i18n';
import { GROQ_STT_MODELS, STT_PROVIDER_OPTIONS } from '@/lib/stt-config'
import {
SETTINGS_NAV_ITEMS,
SettingsMobilePills,
@@ -1167,6 +1168,7 @@ function ClaudeConfigSection({
const ttsOpenAi = (ttsConfig.openai as Record<string, unknown>) || {}
const sttProvider = (sttConfig.provider as string) || 'local'
const sttLocal = (sttConfig.local as Record<string, unknown>) || {}
const sttGroq = (sttConfig.groq as Record<string, unknown>) || {}
const renderClaudeOverview = () => (
<>
@@ -1860,8 +1862,11 @@ function ClaudeConfigSection({
}
className={selectClassName}
>
<option value="local">Local (Whisper)</option>
<option value="openai">OpenAI Whisper API</option>
{STT_PROVIDER_OPTIONS.map((provider) => (
<option key={provider.value} value={provider.value}>
{provider.label}
</option>
))}
</select>
</SettingsRow>
{sttProvider === 'local' && (
@@ -1886,6 +1891,45 @@ function ClaudeConfigSection({
</select>
</SettingsRow>
)}
{sttProvider === 'groq' && (
<>
<SettingsRow
label="Groq model"
description="Choose the Whisper model Groq should run."
>
<select
value={(sttGroq.model as string) || GROQ_STT_MODELS[0]}
onChange={(e) =>
void saveConfig({
config: { stt: { groq: { ...sttGroq, model: e.target.value } } },
})
}
className={selectClassName}
>
{GROQ_STT_MODELS.map((model) => (
<option key={model} value={model}>
{model}
</option>
))}
</select>
</SettingsRow>
<SettingsRow
label="Language"
description="Optional BCP-47 code, e.g. en or en-US. Leave blank for auto-detect."
>
<Input
value={(sttConfig.language as string) || ''}
onChange={(e) =>
void saveConfig({
config: { stt: { language: e.target.value } },
})
}
placeholder="auto"
className="md:w-64"
/>
</SettingsRow>
</>
)}
</SettingsSection>
</div>
)