From 1b50ded3d11fc298f03ee7a5bf1f7c21dbb8b973 Mon Sep 17 00:00:00 2001
From: xiaoxia <dev@xiaoxiajianji.com>
Date: Tue, 15 Sep 2026 01:09:30 +0800
Subject: [PATCH] =?UTF-8?q?feat(voices):=20LanguageControl=20=E6=94=AF?=
 =?UTF-8?q?=E6=8C=81=E6=A0=B9=E6=8D=AE=E9=9F=B3=E8=89=B2=E6=9D=A5=E6=BA=90?=
 =?UTF-8?q?=E8=BF=87=E6=BB=A4=E5=8F=AF=E9=80=89=E8=AF=AD=E8=A8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/tts-modal/LanguageControl.tsx  | 23 +++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/apps/web/src/pages/voices/components/tts-modal/LanguageControl.tsx b/apps/web/src/pages/voices/components/tts-modal/LanguageControl.tsx
index a84668b83..72539762f 100644
--- a/apps/web/src/pages/voices/components/tts-modal/LanguageControl.tsx
+++ b/apps/web/src/pages/voices/components/tts-modal/LanguageControl.tsx
@@ -1,13 +1,28 @@
 import React from "react"
-import { TTS_LANGUAGE_OPTIONS, type TtsLanguage } from "./constants"
+import type { TtsLanguage } from "./constants"
+import { TTS_LANGUAGE_OPTIONS } from "./constants"
+
+interface LanguageOption {
+  value: string
+  label: string
+}
 
 interface LanguageControlProps {
   language: TtsLanguage
   onChange: (language: TtsLanguage) => void
+  /** 根据音色来源传入可选语言列表；不传则使用完整列表 */
+  options?: readonly LanguageOption[]
 }
 
 /** 语言选择下拉 */
-const LanguageControl: React.FC<LanguageControlProps> = ({ language, onChange }) => {
+const LanguageControl: React.FC<LanguageControlProps> = ({
+  language,
+  onChange,
+  options = TTS_LANGUAGE_OPTIONS,
+}) => {
+  // 若当前语言不在可选列表（如从克隆切到预置时 ja/ko 失效），自动回退到中文
+  const effectiveValue = options.some((o) => o.value === language) ? language : "zh-CN"
+
   return (
     <div>
       <div
@@ -20,7 +35,7 @@ const LanguageControl: React.FC<LanguageControlProps> = ({ language, onChange })
         语言
       </div>
       <select
-        value={language}
+        value={effectiveValue}
         onChange={(e) => onChange(e.target.value as TtsLanguage)}
         style={{
           width: "100%",
@@ -34,7 +49,7 @@ const LanguageControl: React.FC<LanguageControlProps> = ({ language, onChange })
           cursor: "pointer",
         }}
       >
-        {TTS_LANGUAGE_OPTIONS.map((opt) => (
+        {options.map((opt) => (
           <option key={opt.value} value={opt.value}>
             {opt.label}
           </option>