opc-agent 4.1.24 → 4.2.0

package/dist/studio-ui/index.html

@@ -388,9 +388,6 @@
           <div class="nav-item" data-page="global-models" onclick="navigate('global-models')">
             <span class="icon">🧠</span> Models
           </div>
-          <div class="nav-item" data-page="global-channels" onclick="navigate('global-channels')">
-            <span class="icon">📡</span> Channels
-          </div>
           <div class="nav-item" data-page="global-memory" onclick="navigate('global-memory')">
             <span class="icon">💾</span> Memory
           </div>
@@ -422,14 +419,6 @@
           </div>
           <button class="btn btn-primary" onclick="navigate('create')">✨ Create New Agent</button>
         </div>
-        <!-- Dashboard Stats -->
-        <div class="card-grid" style="margin-bottom:24px;" id="dashboard-stats"></div>
-        <!-- Quick Actions -->
-        <div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:24px;" id="dashboard-actions">
-          <button class="btn btn-secondary" onclick="navigate('create')">✨ Create Agent</button>
-          <button class="btn btn-secondary" onclick="navigate('global-models')">🧠 Configure Model</button>
-          <button class="btn btn-secondary" onclick="navigate('templates')">📋 Browse Templates</button>
-        </div>
         <!-- Health Status Section -->
         <div id="health-section" style="margin-bottom:24px;"></div>
         <div id="agents-list" class="card-grid"></div>
@@ -481,46 +470,31 @@
           <div class="agent-settings-content" id="agent-settings-content">
             <div class="agent-tab-panel active" id="atab-role">
               <h3>角色配置</h3>
-              <div class="form-group"><label class="label">Agent 名称</label><input class="input" id="atab-role-name" placeholder="Agent name"></div>
-              <div class="form-group"><label class="label">描述</label><textarea class="input" id="atab-role-desc" rows="2" placeholder="Brief description..."></textarea></div>
-              <div class="form-group"><label class="label">System Prompt</label><textarea class="input" id="atab-role-prompt" rows="6" placeholder="You are a helpful assistant..."></textarea></div>
-              <button class="btn btn-primary" onclick="saveAgentRole()">💾 保存</button>
-              <span id="atab-role-status" style="margin-left:12px;font-size:18px;"></span>
+              <p style="color:var(--text-muted)">Agent 角色和人设配置（即将上线）</p>
             </div>
             <div class="agent-tab-panel" id="atab-models">
               <h3>模型配置</h3>
-              <div class="form-group">
-                <label style="display:flex;align-items:center;gap:8px;cursor:pointer;font-size:18px;"><input type="checkbox" id="atab-model-override"> 覆盖全局模型设置</label>
-              </div>
-              <div id="atab-model-fields" style="display:none;">
-                <div class="form-group"><label class="label">Provider</label><select class="input" id="atab-model-provider"><option value="ollama">Ollama (Local)</option><option value="openai">OpenAI</option><option value="anthropic">Anthropic</option><option value="deepseek">DeepSeek</option></select></div>
-                <div class="form-group"><label class="label">Model</label><input class="input" id="atab-model-name" placeholder="e.g. gpt-4o-mini"></div>
-                <div class="form-group"><label class="label">Temperature</label><input class="input" id="atab-model-temp" type="number" min="0" max="2" step="0.1" value="0.7"></div>
-              </div>
-              <button class="btn btn-primary" onclick="saveAgentModel()">💾 保存</button>
-              <span id="atab-model-status" style="margin-left:12px;font-size:18px;"></span>
+              <p style="color:var(--text-muted)">Agent 使用的模型配置（即将上线）</p>
             </div>
             <div class="agent-tab-panel" id="atab-channels">
               <h3>渠道配置</h3>
-              <div id="atab-channels-list" style="font-size:18px;color:var(--text-muted);">加载中...</div>
-              <button class="btn btn-primary" style="margin-top:16px;" onclick="saveAgentChannels()">💾 保存</button>
-              <span id="atab-channels-status" style="margin-left:12px;font-size:18px;"></span>
+              <p style="color:var(--text-muted)">Agent 接入的渠道配置（即将上线）</p>
             </div>
             <div class="agent-tab-panel" id="atab-memory">
               <h3>记忆管理</h3>
-              <div id="atab-memory-list" style="font-size:18px;color:var(--text-muted);">加载中...</div>
+              <p style="color:var(--text-muted)">Agent 记忆和知识库（即将上线）</p>
             </div>
             <div class="agent-tab-panel" id="atab-skills">
               <h3>技能配置</h3>
-              <div id="atab-skills-list" style="font-size:18px;color:var(--text-muted);">加载中...</div>
+              <p style="color:var(--text-muted)">Agent 已安装的技能（即将上线）</p>
             </div>
             <div class="agent-tab-panel" id="atab-schedules">
               <h3>定时任务</h3>
-              <div id="atab-schedules-list" style="font-size:18px;color:var(--text-muted);">加载中...</div>
+              <p style="color:var(--text-muted)">Agent 定时任务配置（即将上线）</p>
             </div>
             <div class="agent-tab-panel" id="atab-usage">
               <h3>用量统计</h3>
-              <div id="atab-usage-content" style="font-size:18px;color:var(--text-muted);">加载中...</div>
+              <p style="color:var(--text-muted)">Agent 使用量和成本（即将上线）</p>
             </div>
           </div>
         </div>
@@ -633,42 +607,22 @@
               <label class="label">Company / Business Description</label>
               <textarea class="input" id="agent-desc" rows="3" placeholder="Brief description of your business so the agent can better help you..."></textarea>
             </div>
-
-            <!-- AI Prompt Generator -->
-            <div class="form-group">
-              <label class="label">What should this agent do? <span style="color:var(--text-dim);font-size:13px;">(Describe in plain words, AI generates the prompt)</span></label>
-              <textarea class="input" id="agent-task-desc" rows="2" placeholder="e.g. Help me answer customer questions about our products, be friendly and professional..."></textarea>
-              <button class="btn btn-sm" style="margin-top:8px;background:var(--accent-light);color:var(--accent);border:1px solid var(--border);" onclick="generatePrompt()">✨ AI Generate Prompt</button>
-              <textarea class="input" id="agent-prompt" rows="4" placeholder="System prompt will appear here (or write your own)..." style="margin-top:8px;display:none;"></textarea>
-            </div>
-
             <div class="form-group">
               <label class="label">AI Model</label>
               <select class="input" id="agent-model">
-                <option value="auto">🤖 Auto-detect (Ollama local first)</option>
-                <option value="ollama/qwen2.5:7b">🏠 Ollama: Qwen 2.5 7B (Free, Local)</option>
-                <option value="ollama/llama3.1:8b">🏠 Ollama: Llama 3.1 8B (Free, Local)</option>
-                <option value="ollama/qwen2.5:0.5b">🏠 Ollama: Qwen 2.5 0.5B (Ultra-fast)</option>
-                <option value="gpt-4o-mini">☁️ GPT-4o Mini (Fast & Affordable)</option>
-                <option value="gpt-4o">☁️ GPT-4o (Most Capable)</option>
-                <option value="claude-sonnet-4">☁️ Claude Sonnet (Balanced)</option>
-                <option value="deepseek-v3">☁️ DeepSeek V3 (Affordable)</option>
-                <option value="gemini-2.0-flash">☁️ Gemini Flash (Google)</option>
+                <option value="gpt-4o-mini">GPT-4o Mini (Fast & Affordable) ⭐ Recommended</option>
+                <option value="gpt-4o">GPT-4o (Most Capable)</option>
+                <option value="claude-sonnet-4">Claude Sonnet (Balanced)</option>
+                <option value="claude-haiku">Claude Haiku (Fast)</option>
+                <option value="gemini-2.0-flash">Gemini 2.0 Flash (Google)</option>
+                <option value="deepseek-v3">DeepSeek V3 (Open Source)</option>
               </select>
-              <p style="color:var(--text-dim);font-size:12px;margin-top:4px;">🏠 = runs locally, free forever. ☁️ = needs API key.</p>
             </div>
-
-            <!-- Skill Toggles -->
-            <div class="form-group">
-              <label class="label">Enable Skills <span style="color:var(--text-dim);font-size:13px;">(What can your agent do?)</span></label>
-              <div id="skill-toggles" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;max-height:200px;overflow-y:auto;padding:4px;"></div>
-            </div>
-
             <div class="form-group">
               <label class="label">Language Preference</label>
               <select class="input" id="agent-lang">
-                <option value="zh">中文</option>
                 <option value="en">English</option>
+                <option value="zh">中文</option>
                 <option value="auto">Auto-detect</option>
               </select>
             </div>
@@ -781,10 +735,6 @@
             <label class="label">Description</label>
             <textarea class="input" id="sched-desc" rows="2" placeholder="e.g. Send a news summary every morning at 8am"></textarea>
           </div>
-          <div class="form-group">
-            <label class="label">Agent</label>
-            <select class="input" id="sched-agent"></select>
-          </div>
           <div class="form-group">
             <label class="label">Output Channel</label>
             <select class="input" id="sched-channel">
@@ -811,8 +761,17 @@
     </div>
   </div>
 
-  <!-- Settings Page -->
-  <div class="page" id="page-settings">
+  <!-- Channel Config Dialog -->
+  <div class="dialog-overlay" id="channel-dialog">
+    <div class="dialog" style="max-width:480px;width:92%;">
+      <div class="dialog-title" id="channel-dialog-title">配置渠道</div>
+      <div id="channel-dialog-body" style="margin-bottom:4px;"></div>
+      <div class="dialog-actions">
+        <button class="btn btn-secondary btn-sm" onclick="closeChannelDialog()">取消</button>
+        <button class="btn btn-primary btn-sm" onclick="saveCurrentChannel()">💾 保存</button>
+      </div>
+      <!-- Settings Page -->
+      <div class="page" id="page-settings">
         <div class="settings-layout">
           <div class="settings-nav">
             <div class="settings-nav-item active" data-settings="models" onclick="showSettings('models')">🤖 模型配置</div>
@@ -1030,6 +989,9 @@
         </div>
       </div>
 
+    </div>
+  </div>
+
   <!-- Delete Confirm Dialog -->
   <div class="dialog-overlay" id="delete-dialog">
     <div class="dialog">
@@ -1165,7 +1127,6 @@
     async function init() {
       await Promise.all([loadTemplates(), loadAgents(), loadSidebarAgents()]);
       loadSidebarGroups();
-      loadDashboardStats();
       handleRoute();
       window.addEventListener('popstate', handleRoute);
       checkFirstRun();
@@ -1306,7 +1267,7 @@
       document.getElementById('agent-chat-view').style.display = '';
       document.getElementById('agent-settings-view').style.display = 'none';
       document.getElementById('agent-detail-toggle').classList.remove('active');
-      const welcomeEl = document.querySelector('.agent-chat-welcome'); document.getElementById('agent-chat-messages').innerHTML = welcomeEl ? welcomeEl.outerHTML : '<div class="agent-chat-welcome"><div style="font-size:48px;margin-bottom:16px">💬</div><div style="font-size:18px;font-weight:600;margin-bottom:8px">开始对话</div><div style="color:var(--text-muted);font-size:14px">向你的 Agent 发送第一条消息</div></div>';
+      document.getElementById('agent-chat-messages').innerHTML = document.querySelector('.agent-chat-welcome').outerHTML || '<div class="agent-chat-welcome"><div style="font-size:48px;margin-bottom:16px">💬</div><div style="font-size:18px;font-weight:600;margin-bottom:8px">开始对话</div><div style="color:var(--text-muted);font-size:14px">向你的 Agent 发送第一条消息</div></div>';
       document.getElementById('agent-chat-input').value = '';
 
       // Show agent detail page
@@ -1331,7 +1292,6 @@
       document.querySelector(`.agent-tab[data-atab="${tab}"]`)?.classList.add('active');
       document.querySelectorAll('.agent-tab-panel').forEach(p => p.classList.remove('active'));
       document.getElementById(`atab-${tab}`)?.classList.add('active');
-      if (typeof loadAgentTabData === 'function') loadAgentTabData(tab);
     }
 
     let agentChatHistory = [];
@@ -1430,12 +1390,11 @@
       const navItem = document.querySelector(`.nav-item[data-page="${page}"]`);
       if (navItem) navItem.classList.add('active');
 
-      if (page === 'dashboard') { loadAgents(); loadHealthDashboard(); loadSidebarAgents(); loadDashboardStats(); }
+      if (page === 'dashboard') { loadAgents(); loadHealthDashboard(); loadSidebarAgents(); }
       if (page === 'create') { renderWizard(); renderWizardTemplates(); }
       if (page === 'settings') { showSettings(currentSettingsTab || 'models'); }
       if (page === 'global-runtime') { currentSettingsTab='status'; showSettings('status'); showPage('settings'); return; }
       if (page === 'global-models') { currentSettingsTab='models'; showSettings('models'); showPage('settings'); return; }
-      if (page === 'global-channels') { currentSettingsTab='channels'; showSettings('channels'); showPage('settings'); return; }
       if (page === 'global-memory') { currentSettingsTab='memory'; showSettings('memory'); showPage('settings'); return; }
       if (page === 'global-templates') { navigate('templates'); return; }
       if (page === 'create-group') { loadGroupAgentSelect(); }
@@ -1646,112 +1605,13 @@
       }
       if (wizardStep === 2 && selectedTemplate) {
         document.getElementById('agent-name').placeholder = selectedTemplate.name;
-        document.getElementById('agent-model').value = selectedTemplate.suggestedModel || 'auto';
-        renderSkillToggles();
+        document.getElementById('agent-model').value = selectedTemplate.suggestedModel;
       }
       if (wizardStep === 3) {
         renderConfirmCard();
       }
     }
 
-    // --- Skill toggle rendering ---
-    const WIZARD_SKILL_CATEGORIES = {
-      productivity: { icon: '📋', label: 'Productivity' },
-      knowledge: { icon: '📚', label: 'Knowledge' },
-      creative: { icon: '✍️', label: 'Creative' },
-      developer: { icon: '💻', label: 'Developer' },
-      lifestyle: { icon: '🏠', label: 'Lifestyle' },
-      business: { icon: '💼', label: 'Business' },
-      education: { icon: '🎓', label: 'Education' },
-    };
-    const PRESET_SKILLS = [
-      { id: 'note-assistant', name: '📝 Notes', cat: 'productivity', default: true },
-      { id: 'todo-manager', name: '✅ Todo', cat: 'productivity', default: true },
-      { id: 'reminder', name: '🔔 Reminder', cat: 'productivity', default: true },
-      { id: 'reading-summary', name: '📚 Summarize', cat: 'knowledge', default: true },
-      { id: 'knowledge-search', name: '🔍 Search', cat: 'knowledge', default: true },
-      { id: 'dictionary-translator', name: '📖 Translate', cat: 'knowledge', default: false },
-      { id: 'calculator', name: '🧮 Calculate', cat: 'knowledge', default: false },
-      { id: 'writing-assistant', name: '✍️ Writing', cat: 'creative', default: true },
-      { id: 'social-media', name: '📱 Social', cat: 'creative', default: false },
-      { id: 'code-assistant', name: '💻 Code', cat: 'developer', default: false },
-      { id: 'data-analysis', name: '📊 Data', cat: 'knowledge', default: false },
-      { id: 'customer-followup', name: '🤝 CRM', cat: 'business', default: false },
-      { id: 'weather-query', name: '🌤 Weather', cat: 'lifestyle', default: false },
-      { id: 'language-tutor', name: '🗣 Language', cat: 'education', default: false },
-      { id: 'meeting-summarizer', name: '📋 Meeting', cat: 'productivity', default: false },
-      { id: 'brainstorm', name: '💡 Brainstorm', cat: 'creative', default: false },
-    ];
-    let selectedSkills = new Set(PRESET_SKILLS.filter(s => s.default).map(s => s.id));
-
-    function renderSkillToggles() {
-      const grid = document.getElementById('skill-toggles');
-      if (!grid) return;
-      grid.innerHTML = PRESET_SKILLS.map(s => `
-        <label style="display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:10px;border:1px solid ${selectedSkills.has(s.id) ? 'var(--accent)' : 'var(--border)'};background:${selectedSkills.has(s.id) ? 'var(--accent-light)' : 'transparent'};cursor:pointer;font-size:14px;transition:all 0.2s;" onclick="toggleSkill('${s.id}',this)">
-          <input type="checkbox" ${selectedSkills.has(s.id) ? 'checked' : ''} style="display:none;">
-          <span>${s.name}</span>
-        </label>
-      `).join('');
-    }
-
-    function toggleSkill(id, el) {
-      if (selectedSkills.has(id)) { selectedSkills.delete(id); } else { selectedSkills.add(id); }
-      renderSkillToggles();
-    }
-
-    // --- AI Prompt Generator ---
-    async function generatePrompt() {
-      const taskDesc = document.getElementById('agent-task-desc').value.trim();
-      const tplName = selectedTemplate?.name || '';
-      const agentName = document.getElementById('agent-name').value.trim();
-      const bizDesc = document.getElementById('agent-desc').value.trim();
-
-      if (!taskDesc && !tplName) { alert('Please describe what your agent should do'); return; }
-
-      const promptArea = document.getElementById('agent-prompt');
-      promptArea.style.display = 'block';
-      promptArea.value = '✨ Generating prompt...';
-
-      // Build the meta-prompt
-      const context = [
-        tplName ? `Role template: ${tplName}` : '',
-        agentName ? `Agent name: ${agentName}` : '',
-        bizDesc ? `Business: ${bizDesc}` : '',
-        taskDesc ? `User request: ${taskDesc}` : '',
-        `Enabled skills: ${[...selectedSkills].join(', ')}`,
-      ].filter(Boolean).join('\n');
-
-      const metaPrompt = `Generate a system prompt for an AI agent with these requirements:\n${context}\n\nRules:\n- Be specific and actionable\n- Include personality traits\n- Mention the skills it can use\n- Keep it under 300 words\n- Write in the same language as the user's request\n\nOutput ONLY the system prompt, no explanation.`;
-
-      try {
-        const res = await fetch(`${API}/api/agents/generate-prompt`, {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ prompt: metaPrompt }),
-        });
-        if (res.ok) {
-          const data = await res.json();
-          promptArea.value = data.prompt || data.text || 'Failed to generate. Try writing manually.';
-        } else {
-          // Fallback: generate a simple prompt locally
-          promptArea.value = generateLocalPrompt(tplName, taskDesc, bizDesc);
-        }
-      } catch {
-        // Offline fallback
-        promptArea.value = generateLocalPrompt(tplName, taskDesc, bizDesc);
-      }
-    }
-
-    function generateLocalPrompt(role, task, biz) {
-      const parts = [`You are ${role || 'an AI assistant'}.`];
-      if (biz) parts.push(`You work for: ${biz}.`);
-      if (task) parts.push(`Your main job: ${task}.`);
-      parts.push('Be helpful, professional, and friendly. Ask clarifying questions when needed.');
-      if (selectedSkills.size > 0) parts.push(`You have access to these skills: ${[...selectedSkills].join(', ')}.`);
-      return parts.join('\n');
-    }
-
     function wizardNext() {
       if (wizardStep === 1 && !selectedTemplate) { alert('Please select a template first'); return; }
       if (wizardStep < 3) { wizardStep++; renderWizard(); }
@@ -2604,31 +2464,8 @@
     let frCreatedAgentId = null;
 
     async function checkFirstRun() {
-      try {
-        const res = await fetch(`${API}/api/first-run/status`);
-        const data = await res.json();
-        if (data.completed) return; // already configured
-        // Check if models are configured — if so, skip
-        const modelRes = await fetch(`${API}/api/settings/models`);
-        const modelData = await modelRes.json();
-        const hasCloudKey = modelData.providers && Object.values(modelData.providers).some(p => p && p.apiKey);
-        if (hasCloudKey) return; // user already has API keys
-        // Check if Ollama is running with models
-        const ollamaRes = await fetch(`${API}/api/settings/models/local`);
-        const ollamaData = await ollamaRes.json();
-        if (ollamaData.running && ollamaData.models?.length > 0) {
-          // Ollama ready — auto-set local mode and skip wizard
-          await fetch(`${API}/api/settings/models`, {
-            method: 'PUT', headers: {'Content-Type':'application/json'},
-            body: JSON.stringify({ mode: 'local', provider: 'ollama', chatModel: ollamaData.models[0]?.name || 'qwen2.5:7b' })
-          });
-          return;
-        }
-        // Nothing configured — show wizard
-        showFirstRunWizard({ ollamaDetected: ollamaData.running, ollamaModels: ollamaData.models });
-      } catch {
-        // API not ready, skip
-      }
+      // Skip first-run wizard — agents are configured via init
+      return;
     }
 
     function showFirstRunWizard(data) {
@@ -2759,158 +2596,6 @@
       });
     }
 
-    // === Dashboard Stats ===
-    async function loadDashboardStats() {
-      const el = document.getElementById('dashboard-stats');
-      if (!el) return;
-      try {
-        const [agentsRes, modelsRes] = await Promise.all([
-          fetch('/api/agents').then(r=>r.json()).catch(()=>({})),
-          fetch('/api/settings/models').then(r=>r.json()).catch(()=>({})),
-        ]);
-        const agentList = agentsRes.agents || [];
-        const currentModel = modelsRes.chatModel || 'Not configured';
-        el.innerHTML = `
-          <div class="card stat-card"><div class="stat-value">${agentList.length}</div><div class="stat-label">Agents</div></div>
-          <div class="card stat-card"><div class="stat-value" style="font-size:18px;">${currentModel}</div><div class="stat-label">Current Model</div></div>
-          <div class="card stat-card"><div class="stat-value">${agentList.filter(a=>(a.status||'').toLowerCase()==='online').length}</div><div class="stat-label">Online</div></div>
-        `;
-      } catch { el.innerHTML = ''; }
-    }
-
-    // === Agent Detail Settings Tab Logic ===
-
-    async function loadAgentTabData(tab) {
-      if (!selectedAgentId) return;
-      const id = selectedAgentId;
-      try {
-        if (tab === 'role') {
-          const res = await fetch(`/api/agents/${id}`);
-          const a = await res.json();
-          document.getElementById('atab-role-name').value = a.name || '';
-          document.getElementById('atab-role-desc').value = a.description || '';
-          document.getElementById('atab-role-prompt').value = a.systemPrompt || a.prompt || '';
-        } else if (tab === 'models') {
-          const res = await fetch(`/api/agents/${id}`);
-          const a = await res.json();
-          const ov = document.getElementById('atab-model-override');
-          const fields = document.getElementById('atab-model-fields');
-          ov.checked = !!a.modelOverride;
-          fields.style.display = ov.checked ? '' : 'none';
-          ov.onchange = () => { fields.style.display = ov.checked ? '' : 'none'; };
-          if (a.modelOverride) {
-            document.getElementById('atab-model-provider').value = a.provider || 'ollama';
-            document.getElementById('atab-model-name').value = a.model || '';
-            document.getElementById('atab-model-temp').value = a.temperature ?? 0.7;
-          }
-        } else if (tab === 'channels') {
-          const chList = ['web','telegram','discord','slack','feishu','email','whatsapp'];
-          const res = await fetch(`/api/agents/${id}`);
-          const a = await res.json();
-          const enabled = a.channels || ['web'];
-          document.getElementById('atab-channels-list').innerHTML = chList.map(ch =>
-            `<label style="display:flex;align-items:center;gap:10px;padding:8px 0;font-size:18px;cursor:pointer;">
-              <input type="checkbox" class="atab-ch-cb" value="${ch}" ${enabled.includes(ch)?'checked':''}>
-              ${ch.charAt(0).toUpperCase()+ch.slice(1)}
-            </label>`
-          ).join('');
-        } else if (tab === 'memory') {
-          const el = document.getElementById('atab-memory-list');
-          el.innerHTML = '<span style="color:var(--text-muted);">⏳ Loading...</span>';
-          try {
-            const res = await fetch(`/api/agents/${id}/memory`);
-            const data = await res.json();
-            const entries = data.entries || [];
-            if (!entries.length) { el.innerHTML = '<p style="color:var(--text-muted);">No memories yet.</p>'; return; }
-            el.innerHTML = '<div class="timeline">' + entries.map(e =>
-              `<div class="timeline-item"><div class="timeline-date">${new Date(e.timestamp).toLocaleString()}</div><div class="timeline-content">${esc(e.summary||e.content||'')}</div></div>`
-            ).join('') + '</div>';
-          } catch { el.innerHTML = '<p style="color:var(--text-muted);">Failed to load memories.</p>'; }
-        } else if (tab === 'skills') {
-          const el = document.getElementById('atab-skills-list');
-          el.innerHTML = '<span style="color:var(--text-muted);">⏳ Loading...</span>';
-          try {
-            const res = await fetch(`/api/agents/${id}`);
-            const a = await res.json();
-            const skills = a.skills || [];
-            if (!skills.length) { el.innerHTML = '<p style="color:var(--text-muted);">No skills installed.</p>'; return; }
-            el.innerHTML = skills.map(s => `<div class="card" style="margin-bottom:8px;padding:12px;"><span style="font-size:18px;font-weight:600;">${s.name||s}</span></div>`).join('');
-          } catch { el.innerHTML = '<p style="color:var(--text-muted);">Failed to load skills.</p>'; }
-        } else if (tab === 'schedules') {
-          const el = document.getElementById('atab-schedules-list');
-          el.innerHTML = '<span style="color:var(--text-muted);">⏳ Loading...</span>';
-          try {
-            const res = await fetch('/api/schedules');
-            const all = await res.json();
-            const tasks = (Array.isArray(all)?all:[]).filter(t => t.agentId === id);
-            if (!tasks.length) { el.innerHTML = '<p style="color:var(--text-muted);">No schedules for this agent.</p>'; return; }
-            el.innerHTML = tasks.map(t => `<div class="card" style="margin-bottom:8px;padding:12px;display:flex;align-items:center;gap:12px;">
-              <span>⏰</span><div style="flex:1;"><div style="font-weight:600;font-size:18px;">${esc(t.name)}</div><div style="font-size:18px;color:var(--text-dim);">${esc(t.schedule||t.frequency||'')}</div></div>
-              <span style="font-size:18px;color:${t.enabled?'var(--green)':'var(--text-dim)'};">${t.enabled?'Active':'Paused'}</span>
-            </div>`).join('');
-          } catch { el.innerHTML = '<p style="color:var(--text-muted);">Failed to load schedules.</p>'; }
-        } else if (tab === 'usage') {
-          const el = document.getElementById('atab-usage-content');
-          el.innerHTML = '<span style="color:var(--text-muted);">⏳ Loading...</span>';
-          try {
-            const res = await fetch('/api/settings/usage');
-            const data = await res.json();
-            const tokens = data.totalTokens || 0;
-            const cost = data.totalCost || 0;
-            el.innerHTML = `<div class="card-grid"><div class="card stat-card"><div class="stat-value">${tokens>1000?(tokens/1000).toFixed(1)+'K':tokens}</div><div class="stat-label">Total Tokens</div></div><div class="card stat-card"><div class="stat-value">$${cost.toFixed(4)}</div><div class="stat-label">Est. Cost</div></div></div>`;
-          } catch { el.innerHTML = '<p style="color:var(--text-muted);">Failed to load usage data.</p>'; }
-        }
-      } catch(e) { console.error('loadAgentTabData error:', e); }
-    }
-
-    async function saveAgentRole() {
-      if (!selectedAgentId) return;
-      const st = document.getElementById('atab-role-status');
-      try {
-        await fetch(`/api/agents/${selectedAgentId}`, { method:'PUT', headers:{'Content-Type':'application/json'}, body:JSON.stringify({
-          name: document.getElementById('atab-role-name').value.trim(),
-          description: document.getElementById('atab-role-desc').value.trim(),
-          systemPrompt: document.getElementById('atab-role-prompt').value.trim(),
-        })});
-        st.textContent = '✅ Saved'; st.style.color = 'var(--green)';
-        loadSidebarAgents();
-      } catch { st.textContent = '❌ Failed'; st.style.color = 'var(--red)'; }
-    }
-
-    async function saveAgentModel() {
-      if (!selectedAgentId) return;
-      const st = document.getElementById('atab-model-status');
-      const ov = document.getElementById('atab-model-override').checked;
-      const body = { modelOverride: ov };
-      if (ov) { body.provider = document.getElementById('atab-model-provider').value; body.model = document.getElementById('atab-model-name').value; body.temperature = parseFloat(document.getElementById('atab-model-temp').value); }
-      try {
-        await fetch(`/api/agents/${selectedAgentId}`, { method:'PUT', headers:{'Content-Type':'application/json'}, body:JSON.stringify(body) });
-        st.textContent = '✅ Saved'; st.style.color = 'var(--green)';
-      } catch { st.textContent = '❌ Failed'; st.style.color = 'var(--red)'; }
-    }
-
-    async function saveAgentChannels() {
-      if (!selectedAgentId) return;
-      const st = document.getElementById('atab-channels-status');
-      const channels = [...document.querySelectorAll('.atab-ch-cb:checked')].map(cb => cb.value);
-      try {
-        await fetch(`/api/agents/${selectedAgentId}`, { method:'PUT', headers:{'Content-Type':'application/json'}, body:JSON.stringify({ channels }) });
-        st.textContent = '✅ Saved'; st.style.color = 'var(--green)';
-      } catch { st.textContent = '❌ Failed'; st.style.color = 'var(--red)'; }
-    }
-
-    // === Populate schedule form agent select ===
-    async function populateSchedAgentSelect() {
-      const sel = document.getElementById('sched-agent');
-      if (!sel) return;
-      try {
-        const res = await fetch('/api/agents');
-        const data = await res.json();
-        const list = data.agents || [];
-        sel.innerHTML = list.map(a => `<option value="${a.id}">${a.name||a.id}</option>`).join('');
-      } catch { sel.innerHTML = '<option value="">No agents</option>'; }
-    }
-
     // === Start ===
     init();
 
@@ -2977,9 +2662,6 @@
       document.getElementById('sched-desc').value = task ? task.description : '';
       document.getElementById('sched-channel').value = task ? task.outputChannel : 'web';
       onSchedFreqChange();
-      populateSchedAgentSelect().then(() => {
-        if (task?.agentId) document.getElementById('sched-agent').value = task.agentId;
-      });
     }
 
     function hideScheduleForm() {
@@ -3000,7 +2682,6 @@
         time: document.getElementById('sched-time').value,
         schedule: document.getElementById('sched-frequency').value === 'custom' ? document.getElementById('sched-cron').value.trim() : '',
         description: document.getElementById('sched-desc').value.trim(),
-        agentId: document.getElementById('sched-agent').value,
         outputChannel: document.getElementById('sched-channel').value,
         enabled: true,
       };
@@ -3156,17 +2837,17 @@
     // =============================================
     async function saveImageGenConfig() {
       const data = {
-        openaiApiKey: document.getElementById('ig-openai-key')?.value?.trim() || '',
-        sdApiUrl: document.getElementById('ig-sd-url')?.value?.trim() || '',
-        replicateApiKey: document.getElementById('ig-replicate-key')?.value?.trim() || '',
+        openaiApiKey: document.getElementById('ig-openai-key').value.trim(),
+        sdApiUrl: document.getElementById('ig-sd-url').value.trim(),
+        replicateApiKey: document.getElementById('ig-replicate-key').value.trim(),
       };
       try {
         await fetch('/api/image-gen/config', { method: 'PUT', headers: {'Content-Type':'application/json'}, body: JSON.stringify(data) });
-        const st = document.getElementById('ig-status');
-        if (st) { st.textContent = '✅ Configuration saved'; st.style.color = 'var(--green)'; }
+        document.getElementById('ig-status').textContent = '✅ Configuration saved!';
+        document.getElementById('ig-status').style.color = 'var(--green)';
       } catch(e) {
-        const st = document.getElementById('ig-status');
-        if (st) { st.textContent = '❌ Failed: ' + e.message; st.style.color = 'var(--red)'; }
+        document.getElementById('ig-status').textContent = '❌ Failed: ' + e.message;
+        document.getElementById('ig-status').style.color = 'var(--red)';
       }
     }