@agentprojectcontext/apx 1.37.0 → 1.38.1

package/src/interfaces/web/src/components/settings/providers/ProviderModal.tsx

@@ -144,9 +144,9 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
       });
       if (r.error) { setModelError(r.error); return; }
       setAvailableModels(r.models);
-      if (r.models.length === 0) setModelError("Sin modelos. ¿Key/URL correctas?");
+      if (r.models.length === 0) setModelError(t("providers_modal.err_no_models"));
     } catch (e) {
-      setModelError((e as Error).message || "No se pudo listar modelos.");
+      setModelError((e as Error).message || t("providers_modal.err_list_models"));
     } finally { setLoadingModels(false); }
   };
 
@@ -158,8 +158,8 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
 
   const buildProvider = (): { provider: Provider; modelLimits?: Record<string, number> } | null => {
     const slug = (f.slug || slugify(f.name)).trim();
-    if (!slug) { setError("Slug requerido."); return null; }
-    if (!isEdit && existingSlugs.includes(slug)) { setError(`Ya existe un provider "${slug}".`); return null; }
+    if (!slug) { setError(t("providers_modal.err_slug_required")); return null; }
+    if (!isEdit && existingSlugs.includes(slug)) { setError(t("providers_modal.err_slug_exists", { slug })); return null; }
 
     let modelLimits: Record<string, number> | undefined;
     if (f.model_context_limits_json.trim()) {
@@ -167,7 +167,7 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
         const parsed = JSON.parse(f.model_context_limits_json);
         if (!parsed || typeof parsed !== "object" || Array.isArray(parsed)) throw new Error();
         modelLimits = parsed;
-      } catch { setError("Límites de contexto por modelo: JSON inválido."); return null; }
+      } catch { setError(t("providers_modal.err_model_limits_json")); return null; }
     }
 
     const pricingVals = [f.p_input, f.p_output, f.p_cache_read, f.p_cache_write].map((x) => x.trim());
@@ -227,16 +227,16 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
     try {
       if (jsonMode) {
         const slug = (f.slug || slugify(f.name)).trim();
-        if (!slug) { setError("Slug requerido (en el formulario)."); return; }
+        if (!slug) { setError(t("providers_modal.err_slug_required_form")); return; }
         let parsed: unknown;
         try { parsed = JSON.parse(jsonText); }
-        catch { setError("JSON inválido: revisá la sintaxis."); return; }
+        catch { setError(t("providers_modal.err_json_invalid")); return; }
         if (!parsed || typeof parsed !== "object" || Array.isArray(parsed)) {
-          setError("El JSON debe ser un objeto con la config del provider."); return;
+          setError(t("providers_modal.err_json_object")); return;
         }
         const raw = parsed as Record<string, unknown>;
         if (!raw.engine || typeof raw.engine !== "string") {
-          setError('Falta "engine" (ej. "anthropic", "ollama").'); return;
+          setError(t("providers_modal.err_engine_missing")); return;
         }
         const provider: Provider = {
           slug,
@@ -256,13 +256,13 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
       await onSave({ provider: built.provider, apiKeyValue: f.api_key_value.trim() || undefined, originalSlug: initial?.slug });
       onClose();
     } catch (e) {
-      setError((e as Error).message || "Error al guardar.");
+      setError((e as Error).message || t("providers_modal.err_save"));
     } finally { setBusy(false); }
   };
 
   const existingKey = isEdit && isSecretMarker(initial?.api_key);
   const keySuffix = secretSuffix(initial?.api_key);
-  const keyPlaceholder = existingKey ? `…${keySuffix ?? ""} (ya seteada)` : "sk-…";
+  const keyPlaceholder = existingKey ? t("providers_modal.api_key_set", { suffix: keySuffix ?? "" }) : "sk-…";
   const isOllama = f.engine === "ollama";
   const apiKeyEnv = ENGINE_PRESETS[f.engine]?.api_key_env;
 
@@ -271,12 +271,12 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
       open={open}
       onClose={onClose}
       title={isEdit ? t("providers_modal.edit_title", { name: initial?.name || initial?.slug || "" }) : t("providers_modal.new_title")}
-      description="Proveedor LLM. El motor (engine) define qué adapter usa (openai, ollama, …)."
+      description={t("providers_modal.description")}
       size="lg"
       footer={
         <>
-          <Button variant="ghost" onClick={onClose} disabled={busy}>Cancelar</Button>
-          <Button variant="primary" onClick={submit} loading={busy}>{isEdit ? "Guardar" : "Crear"}</Button>
+          <Button variant="ghost" onClick={onClose} disabled={busy}>{t("common.cancel")}</Button>
+          <Button variant="primary" onClick={submit} loading={busy}>{isEdit ? t("common.save") : t("common.create")}</Button>
         </>
       }
     >
@@ -286,7 +286,7 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
             <div className="flex flex-wrap gap-1.5">
               {PRESET_PILLS.map((eng) => {
                 const Icon = ENGINE_ICONS[eng];
-                const label = eng === "custom" ? "Custom" : (ENGINE_OPTIONS.find((o) => o.value === eng)?.label || eng);
+                const label = eng === "custom" ? t("providers_modal.custom") : (ENGINE_OPTIONS.find((o) => o.value === eng)?.label || eng);
                 const selected = f.engine === eng;
                 return (
                   <button
@@ -312,13 +312,13 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
               jsonMode ? "border-sky-500/50 bg-sky-500/10 text-sky-400" : "border-border text-muted-fg hover:text-foreground"
             }`}
           >
-            <Braces className="size-3.5" /> {jsonMode ? "Volver al formulario" : "JSON"}
+            <Braces className="size-3.5" /> {jsonMode ? t("providers_modal.form_mode") : t("providers_modal.json_mode")}
           </button>
         </div>
 
         {jsonMode ? (
           <div className="space-y-2">
-            <Field label="Config del provider (JSON)" hint={`Se guarda como engines.${(f.slug || slugify(f.name)) || "<slug>"} en config.json`}>
+            <Field label={t("providers_modal.json_label")} hint={t("providers_modal.json_hint", { slug: (f.slug || slugify(f.name)) || "<slug>" })}>
               <Textarea
                 rows={14}
                 className="font-mono text-xs"
@@ -327,15 +327,15 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
                 spellCheck={false}
               />
             </Field>
-            <p className="text-[11px] text-muted-fg">Debe ser un objeto JSON válido con al menos <code>engine</code>. El slug se toma del formulario.</p>
+            <p className="text-[11px] text-muted-fg">{t("providers_modal.json_help")}</p>
           </div>
         ) : (
           <>
             <div className="grid grid-cols-2 gap-3">
-              <Field label="Nombre">
-                <Input value={f.name} onChange={(e) => up({ name: e.target.value, slug: isEdit ? f.slug : slugify(e.target.value) })} placeholder="Mi provider" />
+              <Field label={t("providers_modal.name_label")}>
+                <Input value={f.name} onChange={(e) => up({ name: e.target.value, slug: isEdit ? f.slug : slugify(e.target.value) })} placeholder={t("providers_modal.name_ph")} />
               </Field>
-              <Field label="Motor (engine)">
+              <Field label={t("providers_modal.engine_label")}>
                 <UiSelect
                   value={f.engine}
                   onChange={(v) => changeEngine(v as EngineType)}
@@ -344,17 +344,17 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
               </Field>
             </div>
 
-            <Field label="URL base (base_url)" hint="Se completa sola al elegir un proveedor.">
-              <Input value={f.base_url} onChange={(e) => up({ base_url: e.target.value })} placeholder="https://api.openai.com/v1" />
+            <Field label={t("providers_modal.base_url_label")} hint={t("providers_modal.base_url_hint")}>
+              <Input value={f.base_url} onChange={(e) => up({ base_url: e.target.value })} placeholder={t("providers_modal.base_url_ph")} />
             </Field>
 
             {!isOllama && (
-              <Field label="API key" hint={existingKey ? "Dejá en blanco para mantener la actual." : apiKeyEnv ? `Se guarda como secreto. Env sugerida: ${apiKeyEnv}` : "Se guarda como secreto."}>
+              <Field label={t("providers_modal.api_key_label")} hint={existingKey ? t("providers_modal.api_key_hint_existing") : apiKeyEnv ? t("providers_modal.api_key_hint_env", { env: apiKeyEnv }) : t("providers_modal.api_key_hint")}>
                 <Input type="password" autoComplete="new-password" value={f.api_key_value} onChange={(e) => up({ api_key_value: e.target.value })} placeholder={keyPlaceholder} />
               </Field>
             )}
 
-            <Field label="Modelo por defecto">
+            <Field label={t("providers_modal.model_label")}>
               <div className="space-y-2">
                 <div className="flex items-start gap-2">
                   <ModelCombobox
@@ -365,7 +365,7 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
                   />
                   <Button size="sm" variant="secondary" onClick={loadModels} disabled={loadingModels} title={t("providers_modal.list_models_hint")} aria-label={t("providers_modal.list_models_hint")}>
                     {loadingModels ? <Loader2 className="size-3.5 animate-spin" /> : <RefreshCw className="size-3.5" />}
-                    Cargar modelos
+                    {t("providers_modal.load_models")}
                   </Button>
                 </div>
                 {modelError && <p className="text-[11px] text-amber-400">{modelError}</p>}
@@ -373,29 +373,29 @@ export function ProviderModal({ open, initial, existingSlugs, onClose, onSave }:
             </Field>
 
             <div className="grid grid-cols-2 gap-3">
-              <Field label="Máx. tokens (max_tokens)"><Input type="number" min={256} step={256} value={f.default_max_tokens} onChange={(e) => up({ default_max_tokens: parseInt(e.target.value) || 4096 })} /></Field>
-              <Field label={`Temperatura: ${f.default_temperature.toFixed(1)}`}>
+              <Field label={t("providers_modal.max_tokens_label")}><Input type="number" min={256} step={256} value={f.default_max_tokens} onChange={(e) => up({ default_max_tokens: parseInt(e.target.value) || 4096 })} /></Field>
+              <Field label={t("providers_modal.temperature_label", { value: f.default_temperature.toFixed(1) })}>
                 <input type="range" min={0} max={2} step={0.1} value={f.default_temperature} onChange={(e) => up({ default_temperature: parseFloat(e.target.value) })} className="mt-2 w-full accent-foreground" />
               </Field>
             </div>
 
             <details className="rounded-md border border-border bg-muted/20 p-3">
-              <summary className="cursor-pointer text-xs font-medium text-muted-fg">Análisis de tokens / pricing (opcional)</summary>
+              <summary className="cursor-pointer text-xs font-medium text-muted-fg">{t("providers_modal.pricing_summary")}</summary>
               <div className="mt-3 space-y-3">
-                <Field label="Límite de contexto (tokens)"><Input type="number" min={0} step={1024} value={f.context_limit_tokens} onChange={(e) => up({ context_limit_tokens: parseInt(e.target.value) || 0 })} /></Field>
+                <Field label={t("providers_modal.context_limit_label")}><Input type="number" min={0} step={1024} value={f.context_limit_tokens} onChange={(e) => up({ context_limit_tokens: parseInt(e.target.value) || 0 })} /></Field>
                 <div className="grid grid-cols-2 gap-3">
-                  <Field label="$ entrada / 1M"><Input type="number" min={0} step={0.0001} value={f.p_input} onChange={(e) => up({ p_input: e.target.value })} placeholder="0.15" /></Field>
-                  <Field label="$ salida / 1M"><Input type="number" min={0} step={0.0001} value={f.p_output} onChange={(e) => up({ p_output: e.target.value })} placeholder="0.60" /></Field>
-                  <Field label="$ cache read / 1M"><Input type="number" min={0} step={0.0001} value={f.p_cache_read} onChange={(e) => up({ p_cache_read: e.target.value })} placeholder="0.03" /></Field>
-                  <Field label="$ cache write / 1M"><Input type="number" min={0} step={0.0001} value={f.p_cache_write} onChange={(e) => up({ p_cache_write: e.target.value })} placeholder="0.00" /></Field>
+                  <Field label={t("providers_modal.price_input")}><Input type="number" min={0} step={0.0001} value={f.p_input} onChange={(e) => up({ p_input: e.target.value })} placeholder="0.15" /></Field>
+                  <Field label={t("providers_modal.price_output")}><Input type="number" min={0} step={0.0001} value={f.p_output} onChange={(e) => up({ p_output: e.target.value })} placeholder="0.60" /></Field>
+                  <Field label={t("providers_modal.price_cache_read")}><Input type="number" min={0} step={0.0001} value={f.p_cache_read} onChange={(e) => up({ p_cache_read: e.target.value })} placeholder="0.03" /></Field>
+                  <Field label={t("providers_modal.price_cache_write")}><Input type="number" min={0} step={0.0001} value={f.p_cache_write} onChange={(e) => up({ p_cache_write: e.target.value })} placeholder="0.00" /></Field>
                 </div>
-                <Field label="Límites de contexto por modelo (JSON)" hint='{"gpt-4o-mini":128000}'>
+                <Field label={t("providers_modal.model_limits_label")} hint='{"gpt-4o-mini":128000}'>
                   <Textarea rows={3} className="font-mono text-xs" value={f.model_context_limits_json} onChange={(e) => up({ model_context_limits_json: e.target.value })} />
                 </Field>
               </div>
             </details>
 
-            <Switch checked={f.is_active} onChange={(v) => up({ is_active: v })} label="Activo (los agentes pueden usarlo)" />
+            <Switch checked={f.is_active} onChange={(v) => up({ is_active: v })} label={t("providers_modal.active_label")} />
           </>
         )}
 

package/src/interfaces/web/src/components/voice/VoiceProviderList.tsx

@@ -7,6 +7,7 @@ import {
   type TtsEngineInfo,
   type TtsMode,
 } from "../../lib/api/voice";
+import { t } from "../../i18n";
 
 // TTS engine selector. Two modes:
 //   chain  — ordered fallback router; toggles enable/disable engines and the
@@ -63,11 +64,11 @@ export function VoiceProviderList({
       <div className="rounded-lg border border-border p-3">
         <div className="flex flex-wrap items-center justify-between gap-2">
           <div className="min-w-0">
-            <div className="text-sm font-medium">Modo de selección</div>
+            <div className="text-sm font-medium">{t("voice_ui.selection_mode")}</div>
             <div className="text-xs text-muted-fg">
               {isChain
-                ? "Cadena con fallback: usa el primer motor disponible según el orden de abajo."
-                : "Solo el motor por defecto: usa siempre el elegido; los demás quedan configurados para otras cosas."}
+                ? t("voice_ui.mode_chain_desc")
+                : t("voice_ui.mode_single_desc")}
             </div>
           </div>
           <div className="flex shrink-0 overflow-hidden rounded-md border border-border" role="group">
@@ -81,7 +82,7 @@ export function VoiceProviderList({
                 isChain ? "bg-emerald-500/15 text-emerald-300" : "text-muted-fg hover:text-fg",
               )}
             >
-              Cadena (router)
+              {t("voice_ui.mode_chain_btn")}
             </button>
             <button
               type="button"
@@ -93,7 +94,7 @@ export function VoiceProviderList({
                 !isChain ? "bg-emerald-500/15 text-emerald-300" : "text-muted-fg hover:text-fg",
               )}
             >
-              Solo el motor por defecto
+              {t("voice_ui.mode_single_btn")}
             </button>
           </div>
         </div>
@@ -122,7 +123,7 @@ export function VoiceProviderList({
                     type="button"
                     onClick={() => move(id, -1)}
                     disabled={busy || idx === 0}
-                    aria-label="Subir"
+                    aria-label={t("voice_ui.move_up")}
                     data-testid={`voice-provider-${id}-up`}
                     className="text-muted-fg hover:text-fg disabled:opacity-30"
                   >
@@ -132,7 +133,7 @@ export function VoiceProviderList({
                     type="button"
                     onClick={() => move(id, 1)}
                     disabled={busy || idx === ids.length - 1}
-                    aria-label="Bajar"
+                    aria-label={t("voice_ui.move_down")}
                     data-testid={`voice-provider-${id}-down`}
                     className="text-muted-fg hover:text-fg disabled:opacity-30"
                   >
@@ -145,15 +146,15 @@ export function VoiceProviderList({
               <div className="min-w-0 flex-1">
                 <div className="flex items-center gap-2">
                   <span className="text-sm font-medium">{meta.name}</span>
-                  {meta.local && <Badge tone="info">local</Badge>}
+                  {meta.local && <Badge tone="info">{t("voice_ui.badge_local")}</Badge>}
                   {e.available ? (
-                    <Badge tone="success">disponible</Badge>
+                    <Badge tone="success">{t("voice_ui.badge_available")}</Badge>
                   ) : e.configured ? (
-                    <Badge tone="warning">configurado, no disponible</Badge>
+                    <Badge tone="warning">{t("voice_ui.badge_unavailable")}</Badge>
                   ) : (
-                    <Badge tone="muted">sin configurar</Badge>
+                    <Badge tone="muted">{t("voice_ui.badge_not_configured")}</Badge>
                   )}
-                  {isDefault && <Badge tone="success">por defecto</Badge>}
+                  {isDefault && <Badge tone="success">{t("voice_ui.badge_default")}</Badge>}
                 </div>
                 <div className="truncate text-xs text-muted-fg">{meta.note}</div>
               </div>
@@ -174,7 +175,7 @@ export function VoiceProviderList({
                       disabled={busy}
                       data-testid={`voice-provider-${id}-default`}
                     >
-                      <Circle className="size-3.5" /> Usar por defecto
+                      <Circle className="size-3.5" /> {t("voice_ui.set_as_default")}
                     </Button>
                   )
                 )}
@@ -185,7 +186,7 @@ export function VoiceProviderList({
                   onClick={() => onConfigure(id)}
                   data-testid={`voice-provider-${id}-config`}
                 >
-                  <Settings2 className="size-3.5" /> Configurar
+                  <Settings2 className="size-3.5" /> {t("voice_ui.configure")}
                 </Button>
               </div>
             </div>

package/src/interfaces/web/src/components/voice/VoiceProviderModal.tsx

@@ -77,7 +77,7 @@ export function VoiceProviderModal({ open, providerId, config, onClose, onSave }
 
   const hasSecret = providerId !== "piper" && providerId !== "mock";
   const existingKey = hasSecret && isSecretMarker((config as { api_key?: unknown })?.api_key);
-  const keyPlaceholder = existingKey ? `…${secretSuffix((config as { api_key?: unknown })?.api_key) ?? ""} (ya seteada)` : "API key";
+  const keyPlaceholder = existingKey ? t("voice_ui.api_key_set", { suffix: secretSuffix((config as { api_key?: unknown })?.api_key) ?? "" }) : t("voice_ui.api_key_label");
 
   const submit = async () => {
     setBusy(true);
@@ -115,7 +115,7 @@ export function VoiceProviderModal({ open, providerId, config, onClose, onSave }
       await onSave({ set, unset });
       onClose();
     } catch (e) {
-      setError((e as Error).message || "Error al guardar.");
+      setError((e as Error).message || t("voice_ui.err_save"));
     } finally {
       setBusy(false);
     }
@@ -130,21 +130,21 @@ export function VoiceProviderModal({ open, providerId, config, onClose, onSave }
       size="md"
       footer={
         <>
-          <Button variant="ghost" onClick={onClose} disabled={busy}>Cancelar</Button>
-          <Button variant="primary" onClick={submit} loading={busy} data-testid="voice-provider-save">Guardar</Button>
+          <Button variant="ghost" onClick={onClose} disabled={busy}>{t("common.cancel")}</Button>
+          <Button variant="primary" onClick={submit} loading={busy} data-testid="voice-provider-save">{t("common.save")}</Button>
         </>
       }
     >
       <div className="space-y-3">
         {providerId === "piper" && (
           <>
-            <Field label="Binario (bin)" hint="Ruta o nombre del CLI piper (PATH).">
+            <Field label={t("voice_ui.piper_bin_label")} hint={t("voice_ui.piper_bin_hint")}>
               <Input value={f.bin} onChange={(e) => up({ bin: e.target.value })} placeholder="piper" />
             </Field>
-            <Field label="Modelo (.onnx)" hint="Ruta absoluta al modelo de voz piper.">
-              <Input value={f.model} onChange={(e) => up({ model: e.target.value })} placeholder="/abs/path/voz.onnx" />
+            <Field label={t("voice_ui.piper_model_label")} hint={t("voice_ui.piper_model_hint")}>
+              <Input value={f.model} onChange={(e) => up({ model: e.target.value })} placeholder="/abs/path/voice.onnx" />
             </Field>
-            <Field label="Speaker (opcional)" hint="Id de hablante para modelos multi-voz.">
+            <Field label={t("voice_ui.piper_speaker_label")} hint={t("voice_ui.piper_speaker_hint")}>
               <Input value={f.speaker} onChange={(e) => up({ speaker: e.target.value })} placeholder="0" />
             </Field>
           </>
@@ -152,16 +152,16 @@ export function VoiceProviderModal({ open, providerId, config, onClose, onSave }
 
         {providerId === "elevenlabs" && (
           <>
-            <Field label="API key" hint={existingKey ? "Dejá en blanco para mantener la actual." : "Se guarda como secreto. Env: ELEVENLABS_API_KEY"}>
+            <Field label={t("voice_ui.api_key_label")} hint={existingKey ? t("voice_ui.api_key_keep_hint") : t("voice_ui.api_key_secret_hint", { env: "ELEVENLABS_API_KEY" })}>
               <Input type="password" autoComplete="new-password" value={apiKey} onChange={(e) => setApiKey(e.target.value)} placeholder={keyPlaceholder} />
             </Field>
-            <Field label="Modelo">
+            <Field label={t("voice_ui.model_label")}>
               <UiSelect value={f.model || ""} onChange={(v) => up({ model: v })} options={ELEVENLABS_MODELS.map((m) => ({ value: m, label: m }))} placeholder="eleven_multilingual_v2" />
             </Field>
-            <Field label="Voice ID" hint="Id de la voz de ElevenLabs (vacío = default).">
+            <Field label={t("voice_ui.voice_id_label")} hint={t("voice_ui.voice_id_hint")}>
               <Input value={f.voice_id} onChange={(e) => up({ voice_id: e.target.value })} placeholder="EXAVITQu4vr4xnSDxMaL" />
             </Field>
-            <Field label="Formato de salida">
+            <Field label={t("voice_ui.output_format_label")}>
               <Input value={f.output_format} onChange={(e) => up({ output_format: e.target.value })} placeholder="mp3_44100_128" />
             </Field>
           </>
@@ -169,16 +169,16 @@ export function VoiceProviderModal({ open, providerId, config, onClose, onSave }
 
         {providerId === "openai" && (
           <>
-            <Field label="API key" hint={existingKey ? "Dejá en blanco para mantener la actual." : "Se reusa engines.openai.api_key si la dejás en blanco. Env: OPENAI_API_KEY"}>
+            <Field label={t("voice_ui.api_key_label")} hint={existingKey ? t("voice_ui.api_key_keep_hint") : t("voice_ui.api_key_reuse_hint", { engine: "engines.openai.api_key", env: "OPENAI_API_KEY" })}>
               <Input type="password" autoComplete="new-password" value={apiKey} onChange={(e) => setApiKey(e.target.value)} placeholder={keyPlaceholder} />
             </Field>
-            <Field label="Modelo">
+            <Field label={t("voice_ui.model_label")}>
               <UiSelect value={f.model || "tts-1"} onChange={(v) => up({ model: v })} options={OPENAI_TTS_MODELS.map((m) => ({ value: m, label: m }))} />
             </Field>
-            <Field label="Voz">
+            <Field label={t("voice_ui.voice_label")}>
               <UiSelect value={f.voice || "alloy"} onChange={(v) => up({ voice: v })} options={OPENAI_TTS_VOICES.map((m) => ({ value: m, label: m }))} />
             </Field>
-            <Field label="Formato">
+            <Field label={t("voice_ui.format_label")}>
               <UiSelect value={f.format || "mp3"} onChange={(v) => up({ format: v })} options={["mp3", "opus", "aac", "flac", "wav"].map((m) => ({ value: m, label: m }))} />
             </Field>
           </>
@@ -186,24 +186,24 @@ export function VoiceProviderModal({ open, providerId, config, onClose, onSave }
 
         {providerId === "gemini" && (
           <>
-            <Field label="API key" hint={existingKey ? "Dejá en blanco para mantener la actual." : "Se reusa engines.gemini.api_key si la dejás en blanco. Env: GEMINI_API_KEY"}>
+            <Field label={t("voice_ui.api_key_label")} hint={existingKey ? t("voice_ui.api_key_keep_hint") : t("voice_ui.api_key_reuse_hint", { engine: "engines.gemini.api_key", env: "GEMINI_API_KEY" })}>
               <Input type="password" autoComplete="new-password" value={apiKey} onChange={(e) => setApiKey(e.target.value)} placeholder={keyPlaceholder} />
             </Field>
-            <Field label="Modelo" hint="TTS de Gemini sigue en preview.">
+            <Field label={t("voice_ui.model_label")} hint={t("voice_ui.gemini_model_hint")}>
               <Input value={f.model} onChange={(e) => up({ model: e.target.value })} placeholder="gemini-2.5-flash-preview-tts" />
             </Field>
-            <Field label="Voz">
+            <Field label={t("voice_ui.voice_label")}>
               <UiSelect value={f.voice || "Kore"} onChange={(v) => up({ voice: v })} options={GEMINI_TTS_VOICES.map((m) => ({ value: m, label: m }))} />
             </Field>
-            <Field label="Estilo (cómo querés que hable)" hint="Instrucción en lenguaje natural. Vacío = sin estilo. Ej: 'hablá en tono alegre y pausado'.">
-              <Textarea rows={2} value={f.style || ""} onChange={(e) => up({ style: e.target.value })} placeholder="hablá en tono alegre y enérgico" />
+            <Field label={t("voice_ui.style_label")} hint={t("voice_ui.style_hint")}>
+              <Textarea rows={2} value={f.style || ""} onChange={(e) => up({ style: e.target.value })} placeholder={t("voice_ui.style_ph")} />
             </Field>
           </>
         )}
 
         {providerId === "mock" && (
           <p className="text-sm text-muted-fg">
-            El motor <strong>mock</strong> genera un WAV silencioso de prueba. No tiene parámetros: sirve como fallback garantizado cuando no hay otro motor configurado.
+            {t("voice_ui.mock_desc")}
           </p>
         )}
 

package/src/interfaces/web/src/components/voice/VoiceSttCard.tsx

@@ -1,6 +1,7 @@
 import { Field } from "../ui";
 import { UiSelect } from "../UiSelect";
 import { WHISPER_MODELS, type TranscriptionConfig } from "../../lib/api/voice";
+import { t } from "../../i18n";
 
 // STT (speech-to-text) configuration. Persisted under config.transcription.
 // The actual capture happens in the deck overlay / Telegram / CLI; here the
@@ -12,20 +13,20 @@ interface Props {
   busy?: boolean;
 }
 
-const PROVIDER_OPTIONS = [
-  { value: "auto", label: "Automático (local, luego OpenAI)" },
-  { value: "local", label: "Local — faster-whisper (offline)" },
-  { value: "openai", label: "OpenAI — Whisper-1 (cloud)" },
+const providerOptions = () => [
+  { value: "auto", label: t("voice_ui.stt_provider_auto") },
+  { value: "local", label: t("voice_ui.stt_provider_local") },
+  { value: "openai", label: t("voice_ui.stt_provider_openai") },
 ];
 
-const LANG_OPTIONS = [
-  { value: "auto", label: "Auto-detectar" },
-  { value: "es", label: "Español" },
-  { value: "en", label: "Inglés" },
-  { value: "pt", label: "Portugués" },
-  { value: "fr", label: "Francés" },
-  { value: "it", label: "Italiano" },
-  { value: "de", label: "Alemán" },
+const langOptions = () => [
+  { value: "auto", label: t("voice_ui.lang_auto") },
+  { value: "es", label: t("voice_ui.lang_es") },
+  { value: "en", label: t("voice_ui.lang_en") },
+  { value: "pt", label: t("voice_ui.lang_pt") },
+  { value: "fr", label: t("voice_ui.lang_fr") },
+  { value: "it", label: t("voice_ui.lang_it") },
+  { value: "de", label: t("voice_ui.lang_de") },
 ];
 
 export function VoiceSttCard({ config, onPatch, busy }: Props) {
@@ -37,11 +38,11 @@ export function VoiceSttCard({ config, onPatch, busy }: Props) {
 
   return (
     <div className="space-y-3">
-      <Field label="Motor de transcripción" hint="Local usa faster-whisper (requiere python3 + faster-whisper). OpenAI usa la key de engines.openai.">
+      <Field label={t("voice_ui.stt_engine_label")} hint={t("voice_ui.stt_engine_hint")}>
         <UiSelect
           value={provider}
           onChange={(v) => onPatch({ "transcription.provider": v })}
-          options={PROVIDER_OPTIONS}
+          options={providerOptions()}
           disabled={busy}
           className="max-w-md"
         />
@@ -49,7 +50,7 @@ export function VoiceSttCard({ config, onPatch, busy }: Props) {
 
       {usesLocal && (
         <div className="grid grid-cols-1 gap-3 sm:grid-cols-2">
-          <Field label="Modelo local (whisper)" hint="Más grande = más preciso y más lento.">
+          <Field label={t("voice_ui.stt_model_label")} hint={t("voice_ui.stt_model_hint")}>
             <UiSelect
               value={model}
               onChange={(v) => onPatch({ "transcription.local.model": v })}
@@ -57,11 +58,11 @@ export function VoiceSttCard({ config, onPatch, busy }: Props) {
               disabled={busy}
             />
           </Field>
-          <Field label="Idioma" hint='Para español, fijá "Español" mejora la precisión.'>
+          <Field label={t("voice_ui.stt_language_label")} hint={t("voice_ui.stt_language_hint")}>
             <UiSelect
               value={language}
               onChange={(v) => onPatch({ "transcription.local.language": v })}
-              options={LANG_OPTIONS}
+              options={langOptions()}
               disabled={busy}
             />
           </Field>

package/src/interfaces/web/src/components/voice/VoiceTestCard.tsx

@@ -5,6 +5,7 @@ import { UiSelect } from "../UiSelect";
 import { useToast } from "../Toast";
 import { useTtsPlayer } from "./useTtsPlayer";
 import { Voice, TTS_PROVIDER_META, type TtsEngineInfo, type TtsMode, type TtsSayResult } from "../../lib/api/voice";
+import { t } from "../../i18n";
 
 // "Decir esto" tester. Lets you pick which engine to synthesize with (overriding
 // the saved default) and add a free-text speaking-style instruction, then plays
@@ -21,7 +22,7 @@ interface Props {
 export function VoiceTestCard({ engines, defaultProvider, mode }: Props) {
   const toast = useToast();
   const { play, stop, playing, loading: playLoading } = useTtsPlayer();
-  const [text, setText] = useState("Hola, soy APX. Esto es una prueba de voz.");
+  const [text, setText] = useState(t("voice_ui.test_default_text"));
   // "" = use the saved default; otherwise force a specific engine.
   const [engine, setEngine] = useState("");
   const [style, setStyle] = useState("");
@@ -30,34 +31,34 @@ export function VoiceTestCard({ engines, defaultProvider, mode }: Props) {
 
   const defaultLabel =
     mode === "single" && defaultProvider && defaultProvider !== "auto"
-      ? `Por defecto (${TTS_PROVIDER_META[defaultProvider]?.name || defaultProvider})`
-      : "Por defecto (cadena)";
+      ? t("voice_ui.test_default_engine", { name: TTS_PROVIDER_META[defaultProvider]?.name || defaultProvider })
+      : t("voice_ui.test_default_chain");
 
   const options = [
     { value: "", label: defaultLabel },
     ...engines.map((e) => ({
       value: e.id,
-      label: `${TTS_PROVIDER_META[e.id]?.name || e.id}${e.available ? "" : " · no disponible"}`,
+      label: `${TTS_PROVIDER_META[e.id]?.name || e.id}${e.available ? "" : t("voice_ui.test_unavailable_suffix")}`,
     })),
   ];
 
   const say = async () => {
-    const t = text.trim();
-    if (!t) {
-      toast.error("Escribí algo para decir.");
+    const txt = text.trim();
+    if (!txt) {
+      toast.error(t("voice_ui.test_empty_error"));
       return;
     }
     setBusy(true);
     try {
       const res = await Voice.say({
-        text: t,
+        text: txt,
         provider: engine || undefined,
         style: style.trim() || undefined,
       });
       setLast(res);
       await play(res.audio_path);
     } catch (e) {
-      toast.error((e as Error).message || "No se pudo sintetizar.");
+      toast.error((e as Error).message || t("voice_ui.test_synth_error"));
     } finally {
       setBusy(false);
     }
@@ -66,43 +67,43 @@ export function VoiceTestCard({ engines, defaultProvider, mode }: Props) {
   return (
     <div className="space-y-3">
       <div className="grid gap-3 sm:grid-cols-2">
-        <Field label="Motor" hint="Override del por defecto para probar.">
+        <Field label={t("voice_ui.test_engine_label")} hint={t("voice_ui.test_engine_hint")}>
           <UiSelect value={engine} onChange={setEngine} options={options} />
         </Field>
-        <Field label="Estilo (solo Gemini)" hint="Cómo querés que hable. Vacío = sin estilo.">
+        <Field label={t("voice_ui.test_style_label")} hint={t("voice_ui.test_style_hint")}>
           <Input
             value={style}
             onChange={(e) => setStyle(e.target.value)}
-            placeholder="hablá en tono alegre y enérgico"
+            placeholder={t("voice_ui.style_ph")}
             data-testid="voice-test-style"
           />
         </Field>
       </div>
-      <Field label="Texto a decir">
+      <Field label={t("voice_ui.test_text_label")}>
         <Textarea
           rows={2}
           value={text}
           onChange={(e) => setText(e.target.value)}
-          placeholder="Escribí lo que querés que diga…"
+          placeholder={t("voice_ui.test_text_ph")}
           data-testid="voice-test-input"
         />
       </Field>
       <div className="flex items-center gap-2">
         <Button variant="primary" onClick={say} loading={busy} disabled={playLoading} data-testid="voice-test-say">
-          <Volume2 className="size-4" /> Decir esto
+          <Volume2 className="size-4" /> {t("voice_ui.say_this")}
         </Button>
         {playing ? (
           <Button variant="secondary" onClick={stop} data-testid="voice-test-stop">
-            <Square className="size-4" /> Parar
+            <Square className="size-4" /> {t("voice_ui.stop")}
           </Button>
         ) : last ? (
           <Button variant="secondary" onClick={() => play(last.audio_path)} loading={playLoading} data-testid="voice-test-replay">
-            <Play className="size-4" /> Repetir
+            <Play className="size-4" /> {t("voice_ui.replay")}
           </Button>
         ) : null}
         {last && (
           <span className="text-xs text-muted-fg">
-            Motor: <strong>{last.provider}</strong>
+            {t("voice_ui.engine_result")}: <strong>{last.provider}</strong>
             {last.duration_s ? ` · ${last.duration_s.toFixed(1)}s` : ""}
           </span>
         )}