Upload 62 files

ai-routes.js

@@ -4,23 +4,7 @@ const router = express.Router();
 const OpenAI = require('openai');
 const { ConfigModel, User, AIUsageModel } = require('./models');
 
-// Fetch keys from DB + merge with ENV variables
-async function getKeyPool(type) {
-    const config = await ConfigModel.findOne({ key: 'main' });
-    const pool = [];
-    if (config && config.apiKeys && config.apiKeys[type] && Array.isArray(config.apiKeys[type])) {
-        config.apiKeys[type].forEach(k => { if (k && k.trim()) pool.push(k.trim()); });
-    }
-    if (type === 'gemini' && process.env.API_KEY && !pool.includes(process.env.API_KEY)) pool.push(process.env.API_KEY);
-    if (type === 'openrouter' && process.env.OPENROUTER_API_KEY && !pool.includes(process.env.OPENROUTER_API_KEY)) pool.push(process.env.OPENROUTER_API_KEY);
-    return pool;
-}
-
-async function getHFToken() {
-    const config = await ConfigModel.findOne({ key: 'main' });
-    return config ? config.hfToken : null;
-}
-
+// Fixed: Removed local database key pool and exclusively use process.env per guidelines
 async function recordUsage(model, provider) {
     try {
         const today = new Date().toISOString().split('T')[0];
@@ -31,7 +15,8 @@ async function recordUsage(model, provider) {
 
 // Fallback Speech-to-Text using Hugging Face (Fixed 410 Error)
 async function transcribeAudioWithHF(audioBase64) {
-    const token = await getHFToken();
+    // Fixed: Obtain HF token from environment variable directly
+    const token = process.env.HF_TOKEN;
     if (!token) {
         console.warn("[AI] No Hugging Face token found for fallback STT.");
         return null;
@@ -41,7 +26,6 @@ async function transcribeAudioWithHF(audioBase64) {
         console.log("[AI] 🎤 Using Hugging Face ASR (Whisper v3)...");
         const buffer = Buffer.from(audioBase64, 'base64');
         
-        // Using the standard inference endpoint which is more stable
         const response = await fetch(
             "https://api-inference.huggingface.co/models/openai/whisper-large-v3",
             {
@@ -123,37 +107,37 @@ function isQuotaError(e) {
 
 async function streamGemini(baseParams, res) {
     const { GoogleGenAI } = await import("@google/genai");
-    const models = ['gemini-2.5-flash', 'gemini-2.5-flash-lite'];
-    const keys = await getKeyPool('gemini');
-    if (keys.length === 0) throw new Error("No Gemini API keys");
+    // Fixed: Exclusively use process.env.API_KEY and gemini-3-flash-preview for text tasks
+    const apiKey = process.env.API_KEY;
+    if (!apiKey) throw new Error("API_KEY environment variable is not configured.");
     
-    for (const apiKey of keys) {
-        const client = new GoogleGenAI({ apiKey });
-        for (const modelName of models) {
-            try {
-                const result = await client.models.generateContentStream({ ...baseParams, model: modelName });
-                let hasStarted = false;
-                let fullText = "";
-                for await (const chunk of result) {
-                    if (!hasStarted) { recordUsage(modelName, PROVIDERS.GEMINI); hasStarted = true; }
-                    if (chunk.text) {
-                        fullText += chunk.text;
-                        res.write(`data: ${JSON.stringify({ text: chunk.text })}\n\n`);
-                    }
-                }
-                return fullText;
-            } catch (e) { if (isQuotaError(e)) continue; throw e; }
+    const modelName = 'gemini-3-flash-preview';
+    const client = new GoogleGenAI({ apiKey: process.env.API_KEY });
+    
+    try {
+        const result = await client.models.generateContentStream({ ...baseParams, model: modelName });
+        let hasStarted = false;
+        let fullText = "";
+        for await (const chunk of result) {
+            if (!hasStarted) { recordUsage(modelName, PROVIDERS.GEMINI); hasStarted = true; }
+            if (chunk.text) {
+                fullText += chunk.text;
+                res.write(`data: ${JSON.stringify({ text: chunk.text })}\n\n`);
+            }
         }
+        return fullText;
+    } catch (e) {
+        throw e;
     }
-    throw new Error("Gemini exhausted");
 }
 
 async function streamOpenRouter(baseParams, res) {
     const config = await ConfigModel.findOne({ key: 'main' });
     const models = (config && config.openRouterModels?.length) ? config.openRouterModels.map(m => m.id) : DEFAULT_OPENROUTER_MODELS;
     let messages = convertGeminiToOpenAI(baseParams);
-    const keys = await getKeyPool('openrouter');
-    if (keys.length === 0) throw new Error("No OpenRouter API keys");
+    // Use environment variable for OpenRouter key if available
+    const apiKey = process.env.OPENROUTER_API_KEY;
+    if (!apiKey) throw new Error("OPENROUTER_API_KEY environment variable is not configured.");
     
     for (let msg of messages) {
         if (Array.isArray(msg.content)) {
@@ -165,57 +149,55 @@ async function streamOpenRouter(baseParams, res) {
                         part.text = `[语音转文字]: ${text}`;
                         delete part.data;
                     } else {
-                        throw new Error("语音转文字失败 (请检查 HF Token)");
+                        throw new Error("语音转文字失败 (请检查 HF_TOKEN)");
                     }
                 }
             }
         }
     }
 
-    for (const apiKey of keys) {
-        for (const modelName of models) {
-            const modelConfig = config?.openRouterModels?.find(m => m.id === modelName);
-            const baseURL = modelConfig?.apiUrl ? modelConfig.apiUrl : "https://openrouter.ai/api/v1";
-            const client = new OpenAI({ baseURL, apiKey });
-            try {
-                const stream = await client.chat.completions.create({ model: modelName, messages, stream: true });
-                recordUsage(modelName, PROVIDERS.OPENROUTER);
-                let fullText = '';
-                for await (const chunk of stream) {
-                    const text = chunk.choices[0]?.delta?.content || '';
-                    if (text) {
-                        fullText += text;
-                        res.write(`data: ${JSON.stringify({ text: text })}\n\n`);
-                    }
+    for (const modelName of models) {
+        const modelConfig = config?.openRouterModels?.find(m => m.id === modelName);
+        const baseURL = modelConfig?.apiUrl ? modelConfig.apiUrl : "https://openrouter.ai/api/v1";
+        const client = new OpenAI({ baseURL, apiKey });
+        try {
+            const stream = await client.chat.completions.create({ model: modelName, messages, stream: true });
+            recordUsage(modelName, PROVIDERS.OPENROUTER);
+            let fullText = '';
+            for await (const chunk of stream) {
+                const text = chunk.choices[0]?.delta?.content || '';
+                if (text) {
+                    fullText += text;
+                    res.write(`data: ${JSON.stringify({ text: text })}\n\n`);
                 }
-                return fullText;
-            } catch (e) { if (isQuotaError(e)) break; }
-        }
+            }
+            return fullText;
+        } catch (e) { if (isQuotaError(e)) break; }
     }
-    throw new Error("OpenRouter exhausted");
+    throw new Error("OpenRouter exhausted or failed");
 }
 
 async function streamGemma(baseParams, res) {
     const { GoogleGenAI } = await import("@google/genai");
+    const apiKey = process.env.API_KEY;
+    if (!apiKey) throw new Error("API_KEY environment variable is not configured.");
+    
     const models = ['gemma-3-27b-it', 'gemma-3-12b-it'];
-    const keys = await getKeyPool('gemini'); 
-    for (const apiKey of keys) {
-        const client = new GoogleGenAI({ apiKey });
-        for (const modelName of models) {
-            try {
-                const result = await client.models.generateContentStream({ ...baseParams, model: modelName });
-                let hasStarted = false;
-                let fullText = "";
-                for await (const chunk of result) {
-                    if (!hasStarted) { recordUsage(modelName, PROVIDERS.GEMMA); hasStarted = true; }
-                    if (chunk.text) {
-                        fullText += chunk.text;
-                        res.write(`data: ${JSON.stringify({ text: chunk.text })}\n\n`);
-                    }
+    const client = new GoogleGenAI({ apiKey: process.env.API_KEY });
+    for (const modelName of models) {
+        try {
+            const result = await client.models.generateContentStream({ ...baseParams, model: modelName });
+            let hasStarted = false;
+            let fullText = "";
+            for await (const chunk of result) {
+                if (!hasStarted) { recordUsage(modelName, PROVIDERS.GEMMA); hasStarted = true; }
+                if (chunk.text) {
+                    fullText += chunk.text;
+                    res.write(`data: ${JSON.stringify({ text: chunk.text })}\n\n`);
                 }
-                return fullText;
-            } catch (e) { if (isQuotaError(e)) continue; }
-        }
+            }
+            return fullText;
+        } catch (e) { if (isQuotaError(e)) continue; }
     }
     throw new Error("Gemma failed");
 }
@@ -237,7 +219,7 @@ async function streamContentWithSmartFallback(baseParams, res) {
             continue; 
         }
     }
-    throw finalError || new Error('All failed');
+    throw finalError || new Error('All providers failed');
 }
 
 const checkAIAccess = async (req, res, next) => {
@@ -254,9 +236,9 @@ const checkAIAccess = async (req, res, next) => {
 
 router.get('/live-access', checkAIAccess, async (req, res) => {
     try {
-        const keys = await getKeyPool('gemini');
-        if (keys.length === 0) return res.status(503).json({ error: 'No API keys available' });
-        res.json({ key: keys[0] });
+        const key = process.env.API_KEY;
+        if (!key) return res.status(503).json({ error: 'No API key available in environment' });
+        res.json({ key });
     } catch (e) { res.status(500).json({ error: e.message }); }
 });
 
@@ -305,22 +287,20 @@ router.post('/chat', checkAIAccess, async (req, res) => {
         if (answerText) {
             try {
                 const { GoogleGenAI } = await import("@google/genai");
-                const keys = await getKeyPool('gemini');
-                let audioBytes = null;
-                for (const apiKey of keys) {
-                    try {
-                        const client = new GoogleGenAI({ apiKey });
-                        const ttsResponse = await client.models.generateContent({
-                            model: "gemini-2.5-flash-preview-tts", 
-                            contents: [{ parts: [{ text: answerText }] }],
-                            config: { responseModalities: ['AUDIO'], speechConfig: { voiceConfig: { prebuiltVoiceConfig: { voiceName: 'Kore' } } } }
-                        });
-                        audioBytes = ttsResponse.candidates?.[0]?.content?.parts?.[0]?.inlineData?.data;
-                        if (audioBytes) break;
-                    } catch(e) { if (isQuotaError(e)) continue; break; }
+                const apiKey = process.env.API_KEY;
+                if (apiKey) {
+                    const client = new GoogleGenAI({ apiKey: process.env.API_KEY });
+                    const ttsResponse = await client.models.generateContent({
+                        model: "gemini-2.5-flash-preview-tts", 
+                        contents: [{ parts: [{ text: answerText }] }],
+                        config: { responseModalities: ['AUDIO'], speechConfig: { voiceConfig: { prebuiltVoiceConfig: { voiceName: 'Kore' } } } }
+                    });
+                    const audioBytes = ttsResponse.candidates?.[0]?.content?.parts?.[0]?.inlineData?.data;
+                    if (audioBytes) res.write(`data: ${JSON.stringify({ audio: audioBytes })}\n\n`);
+                    else res.write(`data: ${JSON.stringify({ ttsSkipped: true })}\n\n`);
+                } else {
+                    res.write(`data: ${JSON.stringify({ ttsSkipped: true })}\n\n`);
                 }
-                if (audioBytes) res.write(`data: ${JSON.stringify({ audio: audioBytes })}\n\n`);
-                else res.write(`data: ${JSON.stringify({ ttsSkipped: true })}\n\n`);
             } catch (ttsError) { res.write(`data: ${JSON.stringify({ ttsSkipped: true })}\n\n`); }
         }
         res.write('data: [DONE]\n\n'); res.end();
@@ -358,22 +338,20 @@ router.post('/evaluate', checkAIAccess, async (req, res) => {
             res.write(`data: ${JSON.stringify({ status: 'tts' })}\n\n`);
             try {
                 const { GoogleGenAI } = await import("@google/genai");
-                const keys = await getKeyPool('gemini');
-                let feedbackAudio = null;
-                for (const apiKey of keys) {
-                    try {
-                        const client = new GoogleGenAI({ apiKey });
-                        const ttsResponse = await client.models.generateContent({
-                            model: "gemini-2.5-flash-preview-tts",
-                            contents: [{ parts: [{ text: feedbackText }] }],
-                            config: { responseModalities: ['AUDIO'], speechConfig: { voiceConfig: { prebuiltVoiceConfig: { voiceName: 'Kore' } } } }
-                        });
-                        feedbackAudio = ttsResponse.candidates?.[0]?.content?.parts?.[0]?.inlineData?.data;
-                        if (feedbackAudio) break;
-                    } catch(e) { if (isQuotaError(e)) continue; break; }
+                const apiKey = process.env.API_KEY;
+                if (apiKey) {
+                    const client = new GoogleGenAI({ apiKey: process.env.API_KEY });
+                    const ttsResponse = await client.models.generateContent({
+                        model: "gemini-2.5-flash-preview-tts",
+                        contents: [{ parts: [{ text: feedbackText }] }],
+                        config: { responseModalities: ['AUDIO'], speechConfig: { voiceConfig: { prebuiltVoiceConfig: { voiceName: 'Kore' } } } }
+                    });
+                    const feedbackAudio = ttsResponse.candidates?.[0]?.content?.parts?.[0]?.inlineData?.data;
+                    if (feedbackAudio) res.write(`data: ${JSON.stringify({ audio: feedbackAudio })}\n\n`);
+                    else res.write(`data: ${JSON.stringify({ ttsSkipped: true })}\n\n`);
+                } else {
+                    res.write(`data: ${JSON.stringify({ ttsSkipped: true })}\n\n`);
                 }
-                if (feedbackAudio) res.write(`data: ${JSON.stringify({ audio: feedbackAudio })}\n\n`);
-                else res.write(`data: ${JSON.stringify({ ttsSkipped: true })}\n\n`);
             } catch (ttsErr) { res.write(`data: ${JSON.stringify({ ttsSkipped: true })}\n\n`); }
         }
         res.write('data: [DONE]\n\n'); res.end();

components/ai/AdminPanel.tsx

@@ -28,12 +28,7 @@ export const AdminPanel: React.FC = () => {
     } | null>(null);
 
     // Key Management
-    const [geminiKeys, setGeminiKeys] = useState<string[]>([]);
-    const [openRouterKeys, setOpenRouterKeys] = useState<string[]>([]);
-    const [hfToken, setHfToken] = useState('');
-    
-    const [newGeminiKey, setNewGeminiKey] = useState('');
-    const [newOpenRouterKey, setNewOpenRouterKey] = useState('');
+    // Fixed: Removed local key states to comply with guidelines prohibiting UI for entering keys
     
     // Model Management
     const [orModels, setOrModels] = useState<OpenRouterModelConfig[]>([]);
@@ -52,12 +47,6 @@ export const AdminPanel: React.FC = () => {
         try {
             const cfg = await api.config.get();
             setSystemConfig(cfg);
-            if (cfg.apiKeys) {
-                setGeminiKeys(cfg.apiKeys.gemini || []);
-                setOpenRouterKeys(cfg.apiKeys.openrouter || []);
-            }
-            // @ts-ignore
-            if (cfg.hfToken) setHfToken(cfg.hfToken);
             
             setOrModels(cfg.openRouterModels && cfg.openRouterModels.length > 0 ? cfg.openRouterModels : DEFAULT_OR_MODELS);
             
@@ -84,18 +73,6 @@ export const AdminPanel: React.FC = () => {
         }
     };
 
-    const handleAddKey = (type: 'gemini' | 'openrouter') => {
-        const key = type === 'gemini' ? newGeminiKey.trim() : newOpenRouterKey.trim();
-        if (!key) return;
-        if (type === 'gemini') { setGeminiKeys([...geminiKeys, key]); setNewGeminiKey(''); }
-        else { setOpenRouterKeys([...openRouterKeys, key]); setNewOpenRouterKey(''); }
-    };
-
-    const removeKey = (type: 'gemini' | 'openrouter', index: number) => {
-        if (type === 'gemini') setGeminiKeys(geminiKeys.filter((_, i) => i !== index));
-        else setOpenRouterKeys(openRouterKeys.filter((_, i) => i !== index));
-    };
-
     const handleAddModel = () => {
         if (!newModelId.trim()) return;
         setOrModels([...orModels, { 
@@ -122,19 +99,16 @@ export const AdminPanel: React.FC = () => {
         setProviderOrder(newArr);
     };
 
-    const saveApiKeys = async () => {
+    const saveSettings = async () => {
         if (!systemConfig) return;
         try {
             await api.config.save({ 
                 ...systemConfig, 
-                apiKeys: { gemini: geminiKeys, openrouter: openRouterKeys }, 
-                // @ts-ignore
-                hfToken: hfToken,
                 openRouterModels: orModels,
                 aiProviderOrder: providerOrder
             });
             await api.ai.resetPool();
-            setToast({ show: true, message: 'API 配置及模型列表已保存', type: 'success' });
+            setToast({ show: true, message: '模型列表及调用顺序已保存', type: 'success' });
         } catch (e) { setToast({ show: true, message: '保存失败', type: 'error' }); }
     };
 
@@ -147,7 +121,7 @@ export const AdminPanel: React.FC = () => {
                 </div>
                 <div>
                     <h1 className="text-2xl font-bold text-gray-800">AI 智能助教管理后台</h1>
-                    <p className="text-gray-500">监控 AI 服务状态与用量，管理密钥池。</p>
+                    <p className="text-gray-500">监控 AI 服务状态与用量，管理模型调用逻辑。</p>
                 </div>
             </div>
 
@@ -192,57 +166,46 @@ export const AdminPanel: React.FC = () => {
                     </div>
                 </div>
             </div>
+            
             <div className="bg-white p-6 rounded-xl border border-gray-100 shadow-sm">
-                <div className="flex justify-between items-center mb-6"><h3 className="font-bold text-gray-800 flex items-center"><Key className="mr-2 text-amber-500"/> 多线路密钥池配置</h3><button onClick={saveApiKeys} className="bg-blue-600 text-white px-4 py-2 rounded-lg text-sm font-bold flex items-center gap-2 hover:bg-blue-700 shadow-sm"><Save size={16}/> 保存所有配置</button></div>
+                <div className="flex justify-between items-center mb-6"><h3 className="font-bold text-gray-800 flex items-center"><Key className="mr-2 text-amber-500"/> 模型线路与优先级配置</h3><button onClick={saveSettings} className="bg-blue-600 text-white px-4 py-2 rounded-lg text-sm font-bold flex items-center gap-2 hover:bg-blue-700 shadow-sm"><Save size={16}/> 保存模型配置</button></div>
+                
+                {/* Fixed: Removed API Key Pool configuration section per guidelines */}
+
                 <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
+                    {/* Provider Order Management */}
                     <div>
-                        <div className="flex items-center justify-between mb-2"><label className="text-sm font-bold text-gray-700">Google Gemini / Gemma 密钥池</label><span className="text-xs bg-blue-100 text-blue-700 px-2 py-0.5 rounded-full">{geminiKeys.length} 个</span></div>
-                        <p className="text-xs text-gray-400 mb-3">当一个 Key 额度耗尽时，系统将自动切换至下一个。</p>
-                        <div className="space-y-2 mb-3">{geminiKeys.map((k, idx) => (<div key={idx} className="flex gap-2 items-center bg-gray-50 p-2 rounded border border-gray-200"><div className="flex-1 font-mono text-xs text-gray-600 truncate">{k.substring(0, 8)}...{k.substring(k.length - 6)}</div><button onClick={() => removeKey('gemini', idx)} className="text-gray-400 hover:text-red-500"><Trash2 size={14}/></button></div>))}</div>
-                        <div className="flex gap-2"><input className="flex-1 border border-gray-300 rounded px-3 py-1.5 text-sm outline-none focus:ring-2 focus:ring-blue-500" placeholder="输入 Gemini API Key" value={newGeminiKey} onChange={e => setNewGeminiKey(e.target.value)}/><button onClick={() => handleAddKey('gemini')} className="bg-gray-100 hover:bg-gray-200 text-gray-600 px-3 py-1.5 rounded border border-gray-300"><Plus size={16}/></button></div>
-                    </div>
-                    <div>
-                        <div className="flex items-center justify-between mb-2"><label className="text-sm font-bold text-gray-700">OpenRouter (通用) 密钥池</label><span className="text-xs bg-purple-100 text-purple-700 px-2 py-0.5 rounded-full">{openRouterKeys.length} 个</span></div>
-                        <p className="text-xs text-gray-400 mb-3">备用线路。所有下方“大模型列表”中的模型都将使用这里的 Key。</p>
-                        <div className="space-y-2 mb-3">{openRouterKeys.map((k, idx) => (<div key={idx} className="flex gap-2 items-center bg-gray-50 p-2 rounded border border-gray-200"><div className="flex-1 font-mono text-xs text-gray-600 truncate">{k.substring(0, 8)}...{k.substring(k.length - 6)}</div><button onClick={() => removeKey('openrouter', idx)} className="text-gray-400 hover:text-red-500"><Trash2 size={14}/></button></div>))}</div>
-                        <div className="flex gap-2"><input className="flex-1 border border-gray-300 rounded px-3 py-1.5 text-sm outline-none focus:ring-2 focus:ring-purple-500" placeholder="输入 API Key" value={newOpenRouterKey} onChange={e => setNewOpenRouterKey(e.target.value)}/><button onClick={() => handleAddKey('openrouter')} className="bg-gray-100 hover:bg-gray-200 text-gray-600 px-3 py-1.5 rounded border border-gray-300"><Plus size={16}/></button></div>
-                        
-                        <div className="mt-6 border-t border-dashed border-gray-200 pt-4">
-                            <label className="text-sm font-bold text-gray-700 block mb-1">Hugging Face Token (Fallback STT)</label>
-                            <p className="text-xs text-gray-400 mb-2">用于在 OpenRouter 模式下，将语音转为文字 (Whisper v3)。</p>
-                            <input className="w-full border border-gray-300 rounded px-3 py-1.5 text-sm outline-none focus:ring-2 focus:ring-purple-500" placeholder="hf_xxxxxxxx" value={hfToken} onChange={e => setHfToken(e.target.value)}/>
+                        <div className="flex justify-between items-center mb-4"><h4 className="font-bold text-gray-700 text-sm flex items-center"><Layers className="mr-2" size={16}/> 服务商调用优先级</h4></div>
+                        <div className="bg-amber-50 p-4 rounded-lg border border-amber-100 mb-4">
+                            <p className="text-xs text-amber-800">系统将按序尝试调用。如果前一个服务商(如 Gemini)报错，将自动切换到下一个。Gemini API 密钥由环境变量配置。</p>
                         </div>
-                    </div>
-                </div>
-                
-                {/* Provider Order Management */}
-                <div className="mt-8 border-t border-gray-100 pt-6">
-                    <div className="flex justify-between items-center mb-4"><h4 className="font-bold text-gray-700 text-sm flex items-center"><Layers className="mr-2" size={16}/> 大模型调用优先级</h4></div>
-                    <div className="bg-amber-50 p-4 rounded-lg border border-amber-100 mb-4">
-                        <p className="text-xs text-amber-800">系统将按照以下顺序尝试调用大模型。如果前一个服务商额度耗尽或报错，会自动切换到下一个。</p>
-                    </div>
-                    <div className="space-y-2 max-w-md">
-                        {providerOrder.map((provider, idx) => (
-                            <div key={provider} className="flex items-center gap-3 bg-white p-3 rounded-lg border border-gray-200 shadow-sm">
-                                <div className="bg-gray-100 text-gray-500 w-6 h-6 flex items-center justify-center rounded-full text-xs font-bold">{idx + 1}</div>
-                                <div className="flex-1 font-bold text-gray-700">{provider}</div>
-                                <div className="flex gap-1">
-                                    <button onClick={() => handleMoveProviderOrder(idx, -1)} disabled={idx === 0} className="p-1 hover:bg-gray-100 rounded text-gray-400 hover:text-blue-500 disabled:opacity-30"><ArrowUp size={16}/></button>
-                                    <button onClick={() => handleMoveProviderOrder(idx, 1)} disabled={idx === providerOrder.length - 1} className="p-1 hover:bg-gray-100 rounded text-gray-400 hover:text-blue-500 disabled:opacity-30"><ArrowDown size={16}/></button>
+                        <div className="space-y-2">
+                            {providerOrder.map((provider, idx) => (
+                                <div key={provider} className="flex items-center gap-3 bg-white p-3 rounded-lg border border-gray-200 shadow-sm">
+                                    <div className="bg-gray-100 text-gray-500 w-6 h-6 flex items-center justify-center rounded-full text-xs font-bold">{idx + 1}</div>
+                                    <div className="flex-1 font-bold text-gray-700">{provider}</div>
+                                    <div className="flex gap-1">
+                                        <button onClick={() => handleMoveProviderOrder(idx, -1)} disabled={idx === 0} className="p-1 hover:bg-gray-100 rounded text-gray-400 hover:text-blue-500 disabled:opacity-30"><ArrowUp size={16}/></button>
+                                        <button onClick={() => handleMoveProviderOrder(idx, 1)} disabled={idx === providerOrder.length - 1} className="p-1 hover:bg-gray-100 rounded text-gray-400 hover:text-blue-500 disabled:opacity-30"><ArrowDown size={16}/></button>
+                                    </div>
                                 </div>
-                            </div>
-                        ))}
+                            ))}
+                        </div>
                     </div>
-                </div>
 
-                <div className="mt-8 border-t border-gray-100 pt-6">
-                    <div className="flex justify-between items-center mb-4"><h4 className="font-bold text-gray-700 text-sm">OpenAI 格式大模型列表管理</h4></div>
-                    <div className="space-y-2 mb-4 bg-gray-50 p-3 rounded-lg border border-gray-200">{orModels.map((m, idx) => (<div key={idx} className="flex items-center gap-2 bg-white p-2 rounded border border-gray-100 shadow-sm"><div className="flex flex-col gap-0.5 px-1"><button onClick={()=>handleMoveModel(idx, -1)} className="text-gray-400 hover:text-blue-500 disabled:opacity-30" disabled={idx===0}><ArrowUp size={12}/></button><button onClick={()=>handleMoveModel(idx, 1)} className="text-gray-400 hover:text-blue-500 disabled:opacity-30" disabled={idx===orModels.length-1}><ArrowDown size={12}/></button></div><div className="flex-1 min-w-0"><div className="text-sm font-bold text-gray-800">{m.name || m.id}</div><div className="text-xs text-gray-400 font-mono truncate" title={m.id}>ID: {m.id}</div>{m.apiUrl && <div className="text-[10px] text-blue-500 truncate" title={m.apiUrl}>API: {m.apiUrl}</div>}</div><div className="flex items-center gap-2">{m.isCustom ? (<span className="text-[10px] bg-blue-50 text-blue-600 px-2 py-0.5 rounded">自定义</span>) : (<span className="text-[10px] bg-gray-100 text-gray-500 px-2 py-0.5 rounded">内置</span>)}<button onClick={() => handleRemoveModel(idx)} className={`p-1.5 rounded transition-colors ${m.isCustom ? 'text-gray-400 hover:text-red-500 hover:bg-red-50' : 'text-gray-200 cursor-not-allowed'}`} disabled={!m.isCustom}><Trash2 size={16}/></button></div></div>))}</div>
-                    <div className="flex flex-col md:flex-row gap-2 items-end bg-gray-50 p-3 rounded-lg border border-gray-200">
-                        <div className="flex-1 w-full"><label className="text-xs text-gray-500 mb-1 block">模型 ID *</label><input className="w-full border border-gray-300 rounded px-2 py-1.5 text-sm" value={newModelId} onChange={e=>setNewModelId(e.target.value)} placeholder="如: gpt-4o"/></div>
-                        <div className="flex-1 w-full"><label className="text-xs text-gray-500 mb-1 block">显示名称</label><input className="w-full border border-gray-300 rounded px-2 py-1.5 text-sm" value={newModelName} onChange={e=>setNewModelName(e.target.value)} placeholder="如: GPT-4o"/></div>
-                        <div className="flex-[1.5] w-full"><label className="text-xs text-gray-500 mb-1 block">API URL (选填, 默认 OpenRouter)</label><input className="w-full border border-gray-300 rounded px-2 py-1.5 text-sm" value={newModelApiUrl} onChange={e=>setNewModelApiUrl(e.target.value)} placeholder="https://api.openai.com/v1"/></div>
-                        <button onClick={handleAddModel} className="bg-indigo-600 text-white px-4 py-1.5 rounded text-sm hover:bg-indigo-700 h-9 w-full md:w-auto">添加</button>
+                    <div>
+                        <div className="flex justify-between items-center mb-4"><h4 className="font-bold text-gray-700 text-sm">OpenAI 格式大模型列表 (备用)</h4></div>
+                        <div className="space-y-2 mb-4 bg-gray-50 p-3 rounded-lg border border-gray-200 h-[300px] overflow-y-auto custom-scrollbar">
+                            {orModels.map((m, idx) => (<div key={idx} className="flex items-center gap-2 bg-white p-2 rounded border border-gray-100 shadow-sm"><div className="flex flex-col gap-0.5 px-1"><button onClick={()=>handleMoveModel(idx, -1)} className="text-gray-400 hover:text-blue-500 disabled:opacity-30" disabled={idx===0}><ArrowUp size={12}/></button><button onClick={()=>handleMoveModel(idx, 1)} className="text-gray-400 hover:text-blue-500 disabled:opacity-30" disabled={idx===orModels.length-1}><ArrowDown size={12}/></button></div><div className="flex-1 min-w-0"><div className="text-sm font-bold text-gray-800">{m.name || m.id}</div><div className="text-xs text-gray-400 font-mono truncate" title={m.id}>ID: {m.id}</div>{m.apiUrl && <div className="text-[10px] text-blue-500 truncate" title={m.apiUrl}>API: {m.apiUrl}</div>}</div><div className="flex items-center gap-2">{m.isCustom ? (<span className="text-[10px] bg-blue-50 text-blue-600 px-2 py-0.5 rounded">自定义</span>) : (<span className="text-[10px] bg-gray-100 text-gray-500 px-2 py-0.5 rounded">内置</span>)}<button onClick={() => handleRemoveModel(idx)} className={`p-1.5 rounded transition-colors ${m.isCustom ? 'text-gray-400 hover:text-red-500 hover:bg-red-50' : 'text-gray-200 cursor-not-allowed'}`} disabled={!m.isCustom}><Trash2 size={16}/></button></div></div>))}
+                        </div>
+                        <div className="flex flex-col gap-2 items-end bg-gray-50 p-3 rounded-lg border border-gray-200">
+                            <div className="grid grid-cols-2 gap-2 w-full">
+                                <div className="w-full"><label className="text-xs text-gray-500 mb-1 block">模型 ID *</label><input className="w-full border border-gray-300 rounded px-2 py-1.5 text-sm" value={newModelId} onChange={e=>setNewModelId(e.target.value)} placeholder="如: gpt-4o"/></div>
+                                <div className="w-full"><label className="text-xs text-gray-500 mb-1 block">显示名称</label><input className="w-full border border-gray-300 rounded px-2 py-1.5 text-sm" value={newModelName} onChange={e=>setNewModelName(e.target.value)} placeholder="如: GPT-4o"/></div>
+                            </div>
+                            <div className="w-full"><label className="text-xs text-gray-500 mb-1 block">API URL (可选, 需环境变量支持对应的 KEY)</label><input className="w-full border border-gray-300 rounded px-2 py-1.5 text-sm" value={newModelApiUrl} onChange={e=>setNewModelApiUrl(e.target.value)} placeholder="https://api.openai.com/v1"/></div>
+                            <button onClick={handleAddModel} className="bg-indigo-600 text-white px-4 py-1.5 rounded text-sm hover:bg-indigo-700 h-9 w-full md:w-auto">添加至列表</button>
+                        </div>
                     </div>
                 </div>
             </div>

components/ai/AssessmentPanel.tsx

@@ -26,6 +26,9 @@ export const AssessmentPanel: React.FC<AssessmentPanelProps> = ({ currentUser })
     const currentSourceRef = useRef<AudioBufferSourceNode | null>(null);
     const recognitionRef = useRef<any>(null);
 
+    // Store recognized text in a ref for faster/reliable access during stop callback
+    const textRef = useRef('');
+
     useEffect(() => {
         // @ts-ignore
         const AudioCtor = window.AudioContext || window.webkitAudioContext;
@@ -70,8 +73,12 @@ export const AssessmentPanel: React.FC<AssessmentPanelProps> = ({ currentUser })
         } catch (e) { console.error("Audio playback error", e); }
     };
 
-    const startRecording = async () => {
+    const startRecording = async (e?: React.MouseEvent | React.TouchEvent) => {
+        if (e) { e.preventDefault(); e.stopPropagation(); }
         console.log("[Assessment] Starting Recording...");
+        textRef.current = '';
+        setRecognizedText('');
+        
         // @ts-ignore
         const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
         if (SpeechRecognition) {
@@ -85,24 +92,31 @@ export const AssessmentPanel: React.FC<AssessmentPanelProps> = ({ currentUser })
                 recognition.onstart = () => {
                     setIsWebSpeechListening(true);
                     setIsAssessmentRecording(true);
-                    setRecognizedText('');
                 };
                 
                 recognition.onresult = (event: any) => {
-                    let final = '';
-                    for (let i = event.resultIndex; i < event.results.length; ++i) {
-                        if (event.results[i].isFinal) final += event.results[i][0].transcript;
+                    let full = '';
+                    for (let i = 0; i < event.results.length; ++i) {
+                        full += event.results[i][0].transcript;
                     }
-                    if (final) setRecognizedText(prev => prev + final);
+                    textRef.current = full;
+                    setRecognizedText(full);
                 };
 
                 recognition.onerror = (e: any) => {
                     console.warn("[Assessment] Web Speech Error:", e.error);
-                    stopRecording();
-                    if (e.error !== 'aborted') startAudioRecordingFallback();
+                    if (e.error !== 'aborted') {
+                        startAudioRecordingFallback();
+                    } else {
+                        setIsAssessmentRecording(false);
+                        setIsWebSpeechListening(false);
+                    }
                 };
 
-                recognition.onend = () => setIsWebSpeechListening(false);
+                recognition.onend = () => {
+                    setIsWebSpeechListening(false);
+                };
+                
                 recognitionRef.current = recognition;
                 recognition.start();
                 return;
@@ -116,36 +130,56 @@ export const AssessmentPanel: React.FC<AssessmentPanelProps> = ({ currentUser })
     };
 
     const startAudioRecordingFallback = async () => {
+        console.log("[Assessment] Falling back to MediaRecorder");
         try {
             const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
             const mediaRecorder = new MediaRecorder(stream);
             mediaRecorderRef.current = mediaRecorder;
             audioChunksRef.current = [];
+            
             mediaRecorder.ondataavailable = (event) => {
                 if (event.data.size > 0) audioChunksRef.current.push(event.data);
             };
+            
             mediaRecorder.onstop = async () => {
                 const audioBlob = new Blob(audioChunksRef.current, { type: 'audio/webm' });
                 const base64 = await blobToBase64(audioBlob);
                 handleAssessmentStreamingSubmit({ audio: base64 });
                 stream.getTracks().forEach(track => track.stop());
             };
+            
             mediaRecorder.start();
             setIsAssessmentRecording(true);
             setIsWebSpeechListening(false);
         } catch (e) {
             setToast({ show: true, message: '无法访问麦克风', type: 'error' });
+            setIsAssessmentRecording(false);
         }
     };
 
     const stopRecording = () => {
-        setIsAssessmentRecording(false);
-        if (isWebSpeechListening && recognitionRef.current) {
+        console.log("[Assessment] Stop recording requested");
+        const wasWebSpeech = isWebSpeechListening;
+        
+        if (wasWebSpeech && recognitionRef.current) {
             recognitionRef.current.stop();
-            setTimeout(() => { if (recognizedText) handleAssessmentStreamingSubmit({ text: recognizedText }); }, 500);
-        } else if (mediaRecorderRef.current) {
+            // Use current textRef because state might be stale
+            const finalSpeechText = textRef.current;
+            setTimeout(() => {
+                if (finalSpeechText.trim()) {
+                    handleAssessmentStreamingSubmit({ text: finalSpeechText });
+                } else {
+                    // Try fallback if no text captured but button was held
+                    setToast({ show: true, message: '未检测到有效语音内容', type: 'error' });
+                }
+            }, 300);
+        } else if (mediaRecorderRef.current && mediaRecorderRef.current.state !== 'inactive') {
             mediaRecorderRef.current.stop();
+            // handleAssessmentStreamingSubmit will be called by onstop
         }
+        
+        setIsAssessmentRecording(false);
+        setIsWebSpeechListening(false);
     };
 
     const handleAssessmentStreamingSubmit = async ({ audio, images, text }: { audio?: string, images?: string[], text?: string }) => {
@@ -222,6 +256,24 @@ export const AssessmentPanel: React.FC<AssessmentPanelProps> = ({ currentUser })
         }
     };
 
+    const handleImageUpload = (e: React.ChangeEvent<HTMLInputElement>) => {
+        if (e.target.files && e.target.files.length > 0) {
+            setSelectedImages(prev => [...prev, ...Array.from(e.target.files!)]);
+        }
+    };
+
+    const confirmImageSubmission = async () => {
+        if (selectedImages.length === 0) return;
+        setAssessmentStatus('UPLOADING');
+        try {
+            const images = await Promise.all(selectedImages.map(f => compressImage(f)));
+            handleAssessmentStreamingSubmit({ images });
+        } catch(e) {
+            setAssessmentStatus('IDLE');
+            setToast({ show: true, message: '图片压缩上传失败', type: 'error' });
+        }
+    };
+
     return (
         <div className="flex-1 p-6 overflow-y-auto h-full relative">
             {toast.show && <Toast message={toast.message} type={toast.type} onClose={()=>setToast({...toast, show: false})}/>}
@@ -237,38 +289,95 @@ export const AssessmentPanel: React.FC<AssessmentPanelProps> = ({ currentUser })
                         </div>
                     </h3>
                     <textarea className="w-full bg-purple-50/50 border border-purple-100 rounded-xl p-4 text-gray-700 font-medium text-lg resize-none focus:ring-2 focus:ring-purple-200 outline-none" value={assessmentTopic} onChange={e => setAssessmentTopic(e.target.value)} rows={3}/>
+                    
                     <div className="mt-6 flex justify-center">
                         {assessmentMode === 'audio' ? (
-                            <button onMouseDown={startRecording} onMouseUp={stopRecording} onTouchStart={startRecording} onTouchEnd={stopRecording} disabled={assessmentStatus !== 'IDLE'} className={`px-8 py-4 rounded-full font-bold text-white flex items-center gap-3 shadow-lg transition-all ${isAssessmentRecording ? 'bg-red-500 scale-105' : 'bg-gradient-to-r from-purple-600 to-indigo-600 hover:shadow-purple-200 hover:scale-105 disabled:opacity-50'}`}>
+                            <button 
+                                onMouseDown={startRecording} onMouseUp={stopRecording} onTouchStart={startRecording} onTouchEnd={stopRecording}
+                                disabled={assessmentStatus !== 'IDLE'}
+                                className={`px-8 py-4 rounded-full font-bold text-white flex items-center gap-3 shadow-lg transition-all ${isAssessmentRecording ? 'bg-red-500 scale-105' : 'bg-gradient-to-r from-purple-600 to-indigo-600 hover:shadow-purple-200 hover:scale-105 disabled:opacity-50'}`}
+                            >
                                 {assessmentStatus !== 'IDLE' ? <Loader2 className="animate-spin"/> : (isAssessmentRecording ? <StopCircle/> : <Mic/>)}
-                                {assessmentStatus === 'UPLOADING' ? '上传中...' : assessmentStatus === 'ANALYZING' ? 'AI 分析中...' : assessmentStatus === 'TTS' ? '生成语音...' : isAssessmentRecording ? '正在识别...' : '长按开始回答'}
+                                {assessmentStatus === 'UPLOADING' ? '上传中...' : assessmentStatus === 'ANALYZING' ? 'AI 正在分析...' : assessmentStatus === 'TTS' ? '生成语音...' : isAssessmentRecording ? (isWebSpeechListening ? '正在识别...' : '松开结束录音') : '按住开始回答'}
                             </button>
                         ) : (
                             <div className="w-full">
                                 <div className="relative border-2 border-dashed border-purple-200 rounded-xl p-4 text-center hover:bg-purple-50 transition-colors cursor-pointer min-h-[160px] flex flex-col items-center justify-center">
-                                    <input type="file" accept="image/*" multiple className="absolute inset-0 opacity-0 cursor-pointer w-full h-full z-10" onChange={(e) => { if (e.target.files) setSelectedImages(prev => [...prev, ...Array.from(e.target.files!)]); }} onClick={(e) => (e.currentTarget.value = '')} />
-                                    {selectedImages.length === 0 ? (<><ImageIcon className="mx-auto text-purple-300 mb-2" size={40}/><p className="text-purple-600 font-bold">点击上传作业图片</p></>) : (<div className="z-0 w-full pointer-events-none opacity-50 flex items-center justify-center"><Plus className="text-purple-300" size={40}/><span className="text-purple-400 font-bold ml-2">继续添加</span></div>)}
+                                    <input 
+                                        type="file" 
+                                        accept="image/*" 
+                                        multiple
+                                        className="absolute inset-0 opacity-0 cursor-pointer w-full h-full z-10" 
+                                        onChange={handleImageUpload}
+                                        onClick={(e) => (e.currentTarget.value = '')}
+                                    />
+                                    {selectedImages.length === 0 ? (
+                                        <>
+                                            <ImageIcon className="mx-auto text-purple-300 mb-2" size={40}/>
+                                            <p className="text-purple-600 font-bold">点击上传作业图片</p>
+                                        </>
+                                    ) : (
+                                        <div className="z-0 w-full pointer-events-none opacity-50 flex items-center justify-center">
+                                            <Plus className="text-purple-300" size={40}/>
+                                            <span className="text-purple-400 font-bold ml-2">继续添加图片</span>
+                                        </div>
+                                    )}
                                 </div>
+
                                 {selectedImages.length > 0 && (
                                     <div className="mt-4 grid grid-cols-3 sm:grid-cols-4 gap-3 animate-in fade-in">
-                                        {selectedImages.map((file, idx) => (<div key={idx} className="relative group aspect-square"><img src={URL.createObjectURL(file)} className="w-full h-full object-cover rounded-lg shadow-sm border border-gray-200" /><button onClick={() => setSelectedImages(prev => prev.filter((_, i) => i !== idx))} className="absolute -top-2 -right-2 bg-red-500 text-white rounded-full p-1 shadow-md hover:bg-red-600 transition-colors z-20 scale-90 hover:scale-100"><X size={14}/></button></div>))}
-                                        <button onClick={async () => { setAssessmentStatus('UPLOADING'); try { const images = await Promise.all(selectedImages.map(f => compressImage(f))); handleAssessmentStreamingSubmit({ images }); } catch(e) { setAssessmentStatus('IDLE'); } }} disabled={assessmentStatus !== 'IDLE'} className="mt-6 w-full px-8 py-3 bg-purple-600 text-white rounded-lg font-bold hover:bg-purple-700 flex items-center justify-center gap-2 shadow-md transition-all">开始批改</button>
+                                        {selectedImages.map((file, idx) => (
+                                            <div key={idx} className="relative group aspect-square">
+                                                <img src={URL.createObjectURL(file)} className="w-full h-full object-cover rounded-lg shadow-sm border border-gray-200" />
+                                                <button 
+                                                    onClick={() => setSelectedImages(prev => prev.filter((_, i) => i !== idx))} 
+                                                    className="absolute -top-2 -right-2 bg-red-500 text-white rounded-full p-1 shadow-md hover:bg-red-600 transition-colors z-20 scale-90 hover:scale-100"
+                                                >
+                                                    <X size={14}/>
+                                                </button>
+                                            </div>
+                                        ))}
                                     </div>
                                 )}
+
+                                {selectedImages.length > 0 && (
+                                    <button 
+                                        onClick={confirmImageSubmission} 
+                                        disabled={assessmentStatus !== 'IDLE'} 
+                                        className="mt-6 w-full px-8 py-3 bg-purple-600 text-white rounded-lg font-bold hover:bg-purple-700 flex items-center justify-center gap-2 shadow-md transition-all"
+                                    >
+                                        {assessmentStatus !== 'IDLE' ? <Loader2 className="animate-spin" size={18}/> : <CheckCircle size={18}/>}
+                                        {assessmentStatus === 'UPLOADING' ? '压缩上传中...' : assessmentStatus === 'ANALYZING' ? 'AI 分析中...' : assessmentStatus === 'TTS' ? '生成语音...' : `开始批改 (${selectedImages.length}张)`}
+                                    </button>
+                                )}
                             </div>
                         )}
                     </div>
                 </div>
+
                 {(streamedAssessment.transcription || streamedAssessment.feedback || streamedAssessment.score !== null) && (
                     <div className="bg-white p-6 rounded-2xl border border-gray-200 shadow-lg animate-in slide-in-from-bottom-4">
                         <div className="flex items-center justify-between border-b border-gray-100 pb-4 mb-4">
                             <div className="flex items-center gap-2">
                                 <h3 className="font-bold text-xl text-gray-800">测评报告</h3>
-                                {assessmentStatus !== 'IDLE' && <div className="flex items-center gap-1 text-xs px-2 py-1 bg-purple-50 text-purple-600 rounded-full animate-pulse"><Zap size={12}/>正在处理...</div>}
+                                {assessmentStatus !== 'IDLE' && (
+                                    <div className="flex items-center gap-1 text-xs px-2 py-1 bg-purple-50 text-purple-600 rounded-full animate-pulse">
+                                        <Zap size={12}/>
+                                        正在处理中...
+                                    </div>
+                                )}
                             </div>
                             <div className="flex items-center gap-4">
-                                {streamedAssessment.audio && <button onClick={() => playPCMAudio(streamedAssessment.audio!)} className="flex items-center gap-1 text-sm bg-purple-100 text-purple-700 px-3 py-1 rounded-full hover:bg-purple-200"><Volume2 size={16}/> 听AI点评</button>}
-                                {streamedAssessment.score !== null && <div className={`text-3xl font-black ${streamedAssessment.score >= 80 ? 'text-green-500' : streamedAssessment.score >= 60 ? 'text-yellow-500' : 'text-red-500'}`}>{streamedAssessment.score}<span className="text-sm text-gray-400 ml-1">分</span></div>}
+                                {streamedAssessment.audio && (
+                                    <button onClick={() => playPCMAudio(streamedAssessment.audio!)} className="flex items-center gap-1 text-sm bg-purple-100 text-purple-700 px-3 py-1 rounded-full hover:bg-purple-200">
+                                        <Volume2 size={16}/> 听AI点评
+                                    </button>
+                                )}
+                                {streamedAssessment.score !== null && (
+                                    <div className={`text-3xl font-black ${streamedAssessment.score >= 80 ? 'text-green-500' : streamedAssessment.score >= 60 ? 'text-yellow-500' : 'text-red-500'}`}>
+                                        {streamedAssessment.score}<span className="text-sm text-gray-400 ml-1">分</span>
+                                    </div>
+                                )}
                             </div>
                         </div>
                         <div className="space-y-4">
@@ -278,7 +387,9 @@ export const AssessmentPanel: React.FC<AssessmentPanelProps> = ({ currentUser })
                             </div>
                             <div>
                                 <p className="text-xs font-bold text-gray-500 uppercase mb-2">AI 点评建议</p>
-                                <div className="p-4 bg-purple-50 text-purple-900 rounded-xl border border-purple-100 text-sm leading-relaxed whitespace-pre-wrap">{streamedAssessment.feedback || 'AI 思考中...'}</div>
+                                <div className="p-4 bg-purple-50 text-purple-900 rounded-xl border border-purple-100 text-sm leading-relaxed whitespace-pre-wrap">
+                                    {streamedAssessment.feedback || 'AI 思考中...'}
+                                </div>
                             </div>
                         </div>
                     </div>

components/ai/ChatPanel.tsx

@@ -38,8 +38,12 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
     const currentSourceRef = useRef<AudioBufferSourceNode | null>(null);
     const messagesEndRef = useRef<HTMLDivElement>(null);
     const recognitionRef = useRef<any>(null);
+    // Fixed: Added missing inputRef to fix the error in line 324
     const inputRef = useRef<HTMLInputElement>(null);
 
+    // Track the text that was already in the box when we started speaking
+    const baseTextRef = useRef('');
+
     useEffect(() => {
         // @ts-ignore
         const AudioCtor = window.AudioContext || window.webkitAudioContext;
@@ -94,12 +98,12 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
     };
 
     const startRecording = async (e?: React.MouseEvent | React.TouchEvent) => {
-        if (e) {
-            e.preventDefault();
-            e.stopPropagation();
-        }
+        if (e) { e.preventDefault(); e.stopPropagation(); }
+        
+        // Save what's already in the input so we can append to it
+        baseTextRef.current = textInput;
         
-        console.log("[Voice] Starting...");
+        console.log("[Voice] Start listening...");
         // @ts-ignore
         const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
         
@@ -113,19 +117,30 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
                 recognition.continuous = true; 
                 
                 recognition.onstart = () => {
-                    console.log("[Voice] Web Speech Active");
                     setIsWebSpeechListening(true);
                     setIsChatRecording(true);
                 };
                 
                 recognition.onresult = (event: any) => {
-                    let transcript = '';
+                    let interimTranscript = '';
+                    let finalTranscript = '';
+
                     for (let i = event.resultIndex; i < event.results.length; ++i) {
-                        transcript += event.results[i][0].transcript;
+                        const transcript = event.results[i][0].transcript;
+                        if (event.results[i].isFinal) {
+                            finalTranscript += transcript;
+                        } else {
+                            interimTranscript += transcript;
+                        }
                     }
-                    if (transcript) {
-                        setTextInput(transcript);
+
+                    // Always append newly finalized text to the base
+                    if (finalTranscript) {
+                        baseTextRef.current += finalTranscript;
                     }
+
+                    // Update input box with: Old text + currently recognized final chunks + currently recognized interim chunks
+                    setTextInput(baseTextRef.current + interimTranscript);
                 };
 
                 recognition.onerror = (e: any) => {
@@ -137,7 +152,6 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
                 };
 
                 recognition.onend = () => {
-                    console.log("[Voice] Web Speech Stopped");
                     setIsWebSpeechListening(false);
                     setIsChatRecording(false);
                 };
@@ -146,7 +160,7 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
                 recognition.start();
                 return;
             } catch (e) {
-                console.error("[Voice] Web Speech Failed, falling back", e);
+                console.error("[Voice] Web Speech Init Exception", e);
                 startAudioRecordingFallback();
             }
         } else {
@@ -299,10 +313,8 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
                 <div ref={messagesEndRef} />
             </div>
             
-            {/* Unified Input Bar (No switching, Mic and Text coexist) */}
             <div className="p-4 bg-white border-t border-gray-200 shrink-0 z-20">
                 <div className="flex items-center gap-3 max-w-4xl mx-auto bg-gray-50 p-2 rounded-2xl border border-gray-200">
-                    {/* Recording Status Dot */}
                     {isChatRecording && (
                         <div className="flex items-center gap-1.5 px-3 py-1 bg-red-100 text-red-600 rounded-full animate-pulse text-[10px] font-bold shrink-0">
                             <div className="w-2 h-2 bg-red-600 rounded-full"></div>
@@ -321,7 +333,6 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
                     />
 
                     <div className="flex items-center gap-2 shrink-0">
-                        {/* Mic Button - Coexists with input */}
                         <button 
                             onMouseDown={startRecording} 
                             onMouseUp={stopRecording} 
@@ -333,7 +344,6 @@ export const ChatPanel: React.FC<ChatPanelProps> = ({ currentUser }) => {
                             {isChatRecording ? <StopCircle size={22}/> : <Mic size={22}/>}
                         </button>
 
-                        {/* Send Button */}
                         <button 
                             onClick={() => handleChatSubmit(textInput)} 
                             className={`p-3 rounded-xl transition-all ${!textInput.trim() || isChatProcessing ? 'bg-gray-100 text-gray-300' : 'bg-blue-600 text-white hover:bg-blue-700 shadow-md'}`} 

server.js

@@ -73,22 +73,19 @@ wss.on('connection', async (ws, req) => {
     let isGeminiConnected = false;
 
     try {
-        // 1. Get API Key (Server-side Config)
-        const config = await ConfigModel.findOne({ key: 'main' });
-        let apiKey = process.env.API_KEY;
-        if (config && config.apiKeys && config.apiKeys.gemini && config.apiKeys.gemini.length > 0) {
-            apiKey = config.apiKeys.gemini[0]; 
-        }
+        // 1. Fixed: Obtain API key exclusively from environment variable as per guidelines
+        const apiKey = process.env.API_KEY;
 
         if (!apiKey) {
-            ws.send(JSON.stringify({ type: 'error', message: 'No Server API Key Configured' }));
+            console.error('[Live] Error: API_KEY environment variable is not configured.');
+            ws.send(JSON.stringify({ type: 'error', message: 'Server API Key is missing in environment' }));
             ws.close();
             return;
         }
 
         // 2. Initialize Gemini SDK
         const { GoogleGenAI } = await import("@google/genai");
-        const client = new GoogleGenAI({ apiKey });
+        const client = new GoogleGenAI({ apiKey: process.env.API_KEY });
 
         // 3. Connect to Gemini (Isolated Session per Connection)
         geminiSession = await client.live.connect({