qalita 2.3.2__py3-none-any.whl → 2.5.3__py3-none-any.whl

qalita/web/templates/studio/agent-panel.html

@@ -1,828 +0,0 @@
-<div id="agent_panel_root" style="display:flex; flex-direction:column; flex:1; min-height:0; position:relative;">
-  <div style="display:flex; flex-direction:row; justify-content:space-between; margin-bottom:2px;">
-    <div id="provider_selector" style="display:flex; align-items:center; gap:8px;">
-      <p for="agent_provider" style="min-width: 110px; margin: 0px;">Agent Provider</p>
-      <select id="agent_provider" class="studio-input" style="max-width:260px; margin-top: 0px;">
-        <option value="local">Ollama</option>
-        <option value="openai">ChatGPT</option>
-        <option value="mistral">Mistral</option>
-        <option value="claude">Claude</option>
-        <option value="gemini">Gemini</option>
-      </select>
-      <img id="provider_logo_inline" src="/static/ollama.png" alt="Provider Logo"
-        style="width: 24px; height: 24px; object-fit: contain; margin-left: 4px;" />
-      <div id="ollama_status_dot" title="Checking Ollama..."
-        style="width:28px; height:10px; border-radius:50%; background:#9ca3af; box-shadow:0 0 0 1px #e5e7eb;">
-      </div>
-    </div>
-    <div id="controls_top" style="display:flex; align-items:center; gap:8px;">
-      <button id="btn_mcp" title="Configure MCP"
-        style="top:4px; right:74px; background:transparent; border:0; cursor:pointer; padding:4px;">
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-          <path d="M12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Z" stroke="#6b7280" stroke-width="2" />
-          <path d="M3 12h2M19 12h2M12 3v2M12 19v2M5 5l1.5 1.5M17.5 17.5L19 19M5 19l1.5-1.5M17.5 6.5L19 5"
-            stroke="#6b7280" stroke-width="2" stroke-linecap="round" />
-        </svg>
-      </button>
-    </div>
-  </div>
-  <div
-    style="padding:4px 0; margin-bottom:8px; overflow-x:auto; overflow-y:hidden; display:flex; align-items:center; gap:8px; border-bottom:1px solid #e5e7eb;">
-    <button id="btn_history" title="Conversations"
-      style="top:4px; right:26px; background:transparent; border:0; cursor:pointer; padding:4px;">
-      <svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-        <path d="M21 12a9 9 0 1 1-3.51-7.07" stroke="#6b7280" stroke-width="2" stroke-linecap="round"
-          stroke-linejoin="round" />
-        <path d="M21 3v6h-6" stroke="#6b7280" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
-        <path d="M12 7v5l3 3" stroke="#6b7280" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
-      </svg>
-    </button>
-    <div id="agent_tabs" style="display:flex; align-items:center; gap:6px;">
-    </div>
-  </div>
-  <div id="agent_onboarding" class="studio-setup-card" style="display:none;">
-    <div style="display: flex; justify-content: space-between; align-items: start; gap: 10px;">
-      <div>
-        <div class="studio-setup-title">Setup local provider</div>
-        <p class="studio-setup-text" style="margin-top: 0;">Let's setup your local AI environment.</p>
-      </div>
-      <img src="/static/ollama.png" alt="Ollama Logo" style="width: 30px; height: auto;" />
-    </div>
-    <ol style="margin-top:3px;">
-      <li>Install Ollama: <a href="https://ollama.com" target="_blank" rel="noreferrer">https://ollama.com</a></li>
-      <li>Start the service locally, then verify below.</li>
-      <li>Pick a default model (ex: <code>gpt-oss:20b</code>).</li>
-      <li>Save your Studio configuration.</li>
-    </ol>
-    <div class="studio-setup-actions">
-      <button id="btn_check_ollama" class="btn outlined">Check Ollama</button>
-      <input id="inp_model" class="studio-input" type="text" placeholder="gpt-oss:20b"
-        style="max-width:260px; margin-top: 0px;" />
-      <button id="btn_save_studio" class="btn">Save</button>
-    </div>
-    <div id="onboarding_status" class="muted" style="margin-top:8px;"></div>
-  </div>
-  <div id="agent_chat" style="display:flex; flex-direction:column; min-height:0;">
-    <div id="chat_log"
-      style="flex:1; overflow:auto; border:1px solid #e5e7eb; border-radius:4px; padding:5px; background:#fff; min-height:0; height: calc(100vh - 200px);">
-    </div>
-    <div class="actions" style="margin-top:12px;">
-      <input id="chat_input" type="text" placeholder="Ask something..." style="flex:1; width:100%;" />
-      <button id="chat_send" class="btn" style="margin-top:5px;">Send</button>
-      <button id="chat_stop" class="btn secondary" style="margin-top:5px; display:none;">Stop</button>
-    </div>
-  </div>
-  <div id="agent_remote_setup" class="studio-setup-card" style="display:none;">
-    <div style="display: flex; justify-content: space-between; align-items: start; gap: 10px;">
-      <div>
-        <div class="studio-setup-title">Setup remote provider</div>
-        <p class="studio-setup-text" style="margin-top: 0;">Configure your API provider credentials.</p>
-      </div>
-      <img id="provider_logo_remote" src="/static/chatgpt.svg" alt="Provider Logo" style="width: 30px; height: auto;" />
-    </div>
-    <ol id="remote_help" style="margin-top:10px;">
-      <li id="help_openai_1" style="display:none;">Create an API key in your <a
-          href="https://platform.openai.com/api-keys" target="_blank" rel="noreferrer">OpenAI dashboard</a>.</li>
-      <li id="help_openai_2" style="display:none;">Paste the API key above and choose a model (e.g.,
-        <code>gpt-4o</code>).
-      </li>
-      <li id="help_mistral_1" style="display:none;">Create an API key in your <a
-          href="https://admin.mistral.ai/organization/api-keys" target="_blank" rel="noreferrer">Mistral dashboard</a>.
-      </li>
-      <li id="help_mistral_2" style="display:none;">Paste the API key above and choose a model (e.g.,
-        <code>mistral-large</code>).
-      </li>
-      <li id="help_claude_1" style="display:none;">Create an API key in your <a
-          href="https://docs.anthropic.com/en/docs/api-keys" target="_blank" rel="noreferrer">Anthropic dashboard</a>.
-      </li>
-      <li id="help_claude_2" style="display:none;">Paste the API key above and choose a model (e.g.,
-        <code>claude-3-5-sonnet-20240620</code>).
-      </li>
-      <li id="help_gemini_1" style="display:none;">Create an API key in your <a href="https://ai.google/"
-          target="_blank" rel="noreferrer">Google AI Studio</a>.</li>
-      <li id="help_gemini_2" style="display:none;">Paste the API key above and choose a model (e.g.,
-        <code>gemini-1.5-pro</code>).
-      </li>
-    </ol>
-    <div class="studio-setup-actions">
-      <input id="inp_remote_api_key" class="studio-input" type="password" placeholder="API Key"
-        style="min-width:260px;" />
-      <input id="inp_remote_model" class="studio-input" type="text" placeholder="Model (e.g., gpt-4o, mistral-large)"
-        style="min-width:260px;" />
-      <button id="btn_check_remote" class="btn outlined">Check</button>
-      <button id="btn_save_remote" class="btn">Save</button>
-    </div>
-    <div id="remote_status" class="muted" style="margin-top:8px;"></div>
-  </div>
-  <div id="history_modal"
-    style="display:none; position:fixed; inset:0; background:rgba(0,0,0,.35); align-items:center; justify-content:center; z-index:50;">
-    <div
-      style="background:#ffffff; border:1px solid #e5e7eb; border-radius:10px; width: min(520px, 92vw); max-width: 520px; box-shadow: 0 10px 30px rgba(0,0,0,.25);">
-      <div
-        style="padding:12px 14px; border-bottom:1px solid #e5e7eb; display:flex; align-items:center; justify-content:space-between;">
-        <div style="font-weight:600; color:#111827;">Conversations</div>
-        <button id="history_close" class="btn outlined" style="padding:2px 8px;">Close</button>
-      </div>
-      <div style="padding:14px; display:flex; gap:10px; align-items:center; flex-wrap:wrap;">
-        <select id="history_select" class="studio-input" style="min-width:280px;"></select>
-        <button id="history_load" class="btn">Load</button>
-      </div>
-      <div id="history_status" class="muted" style="padding:0 14px 14px 14px;"></div>
-    </div>
-  </div>
-
-  <div id="mcp_modal"
-    style="display:none; position:fixed; inset:0; background:rgba(0,0,0,.35); align-items:center; justify-content:center; z-index:50;">
-    <div
-      style="background:#ffffff; border:1px solid #e5e7eb; border-radius:10px; width: min(700px, 92vw); max-width: 700px; box-shadow: 0 10px 30px rgba(0,0,0,.25);">
-      <div
-        style="padding:12px 14px; border-bottom:1px solid #e5e7eb; display:flex; align-items:center; justify-content:space-between;">
-        <div style="font-weight:600; color:#111827;">MCP Configuration</div>
-        <button id="mcp_close" class="btn outlined" style="padding:2px 8px;">Close</button>
-      </div>
-      <div style="padding:14px; display:flex; flex-direction:column; gap:8px;">
-        <div class="muted">Enter the MCP configuration (JSON). It will be saved in
-          <code>~/.qalita/.studio</code> under the provider <code>mcp</code>.
-        </div>
-        <textarea id="mcp_textarea" class="studio-input"
-          style="min-height:220px; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;"></textarea>
-        <div style="display:flex; gap:8px; align-items:center; justify-content:flex-end;">
-          <div id="mcp_status" class="muted" style="margin-right:auto;"></div>
-          <button id="mcp_save" class="btn">Save</button>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-
-<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/dompurify@3.0.6/dist/purify.min.js"></script>
-<script>
-  (function () {
-    const providerSelect = document.getElementById('agent_provider');
-    const providerLogoInline = document.getElementById('provider_logo_inline');
-    const providerLogoRemote = document.getElementById('provider_logo_remote');
-    const elOnboarding = document.getElementById('agent_onboarding');
-    const elChat = document.getElementById('agent_chat');
-    const elRemote = document.getElementById('agent_remote_setup');
-    const status = document.getElementById('onboarding_status');
-    const modelInp = document.getElementById('inp_model');
-    const btnCheck = document.getElementById('btn_check_ollama');
-    const btnSave = document.getElementById('btn_save_studio');
-    const log = document.getElementById('chat_log');
-    const input = document.getElementById('chat_input');
-    const send = document.getElementById('chat_send');
-    const stop = document.getElementById('chat_stop');
-    const statusDot = document.getElementById('ollama_status_dot');
-    const btnHistory = document.getElementById('btn_history');
-    const historyModal = document.getElementById('history_modal');
-    const historyClose = document.getElementById('history_close');
-    const historySelect = document.getElementById('history_select');
-    const historyLoad = document.getElementById('history_load');
-    const historyStatus = document.getElementById('history_status');
-    const btnMcp = document.getElementById('btn_mcp');
-    const mcpModal = document.getElementById('mcp_modal');
-    const mcpClose = document.getElementById('mcp_close');
-    const mcpTextarea = document.getElementById('mcp_textarea');
-    const mcpSave = document.getElementById('mcp_save');
-    const mcpStatus = document.getElementById('mcp_status');
-    const agentTabsEl = document.getElementById('agent_tabs');
-    const btnClearIssue = document.getElementById('btn_clear_issue');
-    let currentConvId = '';
-    function updateUrlParam(key, value) {
-      try {
-        const params = new URLSearchParams(window.location.search);
-        if (value == null || value === '') params.delete(key); else params.set(key, String(value));
-        const newUrl = window.location.pathname + (params.toString() ? ('?' + params.toString()) : '');
-        window.history.replaceState({}, '', newUrl);
-      } catch (e) { /* noop */ }
-    }
-    function readUrlParam(key) {
-      try { return new URLSearchParams(window.location.search).get(key) || ''; } catch (e) { return ''; }
-    }
-    function generateConvId() {
-      const d = new Date();
-      const pad = (n) => String(n).padStart(2, '0');
-      const id = `conv_${d.getFullYear()}${pad(d.getMonth() + 1)}${pad(d.getDate())}_${pad(d.getHours())}${pad(d.getMinutes())}${pad(d.getSeconds())}`;
-      return id;
-    }
-    let lastStatus = null;
-    let streamingController = null;
-    let isStreaming = false;
-
-    function readAgentTabs() {
-      try { return JSON.parse(sessionStorage.getItem('studio_agent_tabs') || '[]'); } catch (e) { return []; }
-    }
-    function writeAgentTabs(list) {
-      try { sessionStorage.setItem('studio_agent_tabs', JSON.stringify(Array.isArray(list) ? list : [])); } catch (e) { }
-    }
-    function ensureAgentTab(id) {
-      if (!id) return;
-      var tabs = readAgentTabs();
-      if (tabs.indexOf(id) === -1) { tabs.unshift(id); writeAgentTabs(tabs); }
-      renderAgentTabs();
-    }
-    function renderAgentTabs() {
-      var root = agentTabsEl; if (!root) return;
-      root.innerHTML = '';
-      // Plus button on the left
-      var plus = document.createElement('button');
-      plus.title = 'Nouvelle conversation';
-      plus.textContent = '+';
-      plus.style.cssText = 'border:1px solid #e5e7eb; background:#ffffff; color:#374151; padding:4px 8px; border-radius:6px; cursor:pointer;';
-      plus.addEventListener('click', function () {
-        try {
-          log.innerHTML = '';
-          currentConvId = generateConvId();
-          updateUrlParam('conv_id', currentConvId);
-          ensureAgentTab(currentConvId);
-        } catch (e) { }
-      });
-      root.appendChild(plus);
-      // Tabs
-      var tabs = readAgentTabs();
-      function removeAgentTab(id) {
-        var list = readAgentTabs().filter(function (t) { return t !== id; });
-        writeAgentTabs(list);
-        // If closing active tab
-        if (id === currentConvId) {
-          if (list.length) {
-            loadConversationById(list[0], true);
-          } else {
-            currentConvId = '';
-            updateUrlParam('conv_id', '');
-            if (log) log.innerHTML = '';
-            renderAgentTabs();
-          }
-        } else {
-          renderAgentTabs();
-        }
-      }
-      tabs.forEach(function (id) {
-        var container = document.createElement('div');
-        container.style.cssText = 'display:inline-flex; align-items:center; gap:4px; border:1px solid #e5e7eb; background:' + (id === currentConvId ? '#eef2ff' : '#ffffff') + '; color:#111827; padding:2px 4px; border-radius:6px; white-space:nowrap;';
-        var labelBtn = document.createElement('button');
-        var label = String(id);
-        labelBtn.textContent = label;
-        labelBtn.title = label;
-        labelBtn.style.cssText = 'background:transparent; border:0; color:inherit; padding:2px 4px; cursor:pointer;';
-        labelBtn.addEventListener('click', function () { if (id !== currentConvId) { loadConversationById(id, true); } });
-        var closeBtn = document.createElement('button');
-        closeBtn.textContent = '×';
-        closeBtn.title = 'Fermer';
-        closeBtn.style.cssText = 'background:transparent; border:0; color:#6b7280; padding:2px 4px; cursor:pointer;';
-        closeBtn.addEventListener('click', function (ev) { ev.stopPropagation(); removeAgentTab(id); });
-        container.appendChild(labelBtn);
-        container.appendChild(closeBtn);
-        root.appendChild(container);
-      });
-    }
-
-    function append(role, text) {
-      const wrapper = document.createElement('div');
-      wrapper.className = 'msg ' + (role === 'You' ? 'user' : 'agent');
-      const bubble = document.createElement('div');
-      bubble.className = 'bubble';
-      if (role === 'You') {
-        bubble.textContent = text || '';
-      } else {
-        const raw = text || '';
-        let html = '';
-        try {
-          html = (window.marked && window.marked.parse) ? window.marked.parse(raw) : raw.replace(/</g, '&lt;');
-        } catch (e) {
-          html = raw.replace(/</g, '&lt;');
-        }
-        try {
-          if (window.DOMPurify && window.DOMPurify.sanitize) {
-            html = window.DOMPurify.sanitize(html, { USE_PROFILES: { html: true } });
-          }
-        } catch (e) { /* ignore */ }
-        bubble.innerHTML = html;
-      }
-      wrapper.appendChild(bubble);
-      log.appendChild(wrapper);
-      log.scrollTop = log.scrollHeight;
-      return role === 'You' ? bubble : bubble;
-    }
-
-    async function refreshStatus() {
-      try {
-        const r = await fetch('/studio/status');
-        const j = await r.json();
-        lastStatus = j;
-        // Rebuild provider options depending on cloud flag
-        setProviderOptions(!!j.cloud_enabled);
-        const current = j.current_provider || 'local';
-        if (providerSelect) providerSelect.value = current;
-        updateProviderUI(current, j);
-      } catch (e) { /* ignore */ }
-    }
-
-    function openMcpModal() {
-      try {
-        if (!mcpModal) return;
-        // Load existing MCP config from status if available
-        const j = lastStatus || {};
-        let payload = {};
-        try {
-          const configs = (j && j.config && j.config.providers) ? j.config.providers : (j.configs || {});
-          const current = (configs && typeof configs === 'object') ? (configs['mcp'] || {}) : {};
-          payload = current || {};
-        } catch (e) { payload = {}; }
-        if (mcpTextarea) mcpTextarea.value = JSON.stringify(payload, null, 2);
-        if (mcpStatus) mcpStatus.textContent = '';
-        mcpModal.style.display = 'flex';
-      } catch (e) { /* noop */ }
-    }
-    function closeMcpModal() { if (mcpModal) mcpModal.style.display = 'none'; }
-    async function saveMcpConfig() {
-      if (!mcpTextarea) return;
-      let obj = null;
-      try {
-        obj = JSON.parse(mcpTextarea.value || '{}');
-      } catch (e) {
-        if (mcpStatus) mcpStatus.textContent = 'Invalid JSON';
-        return;
-      }
-      if (mcpStatus) mcpStatus.textContent = 'Saving...';
-      try {
-        const r = await fetch('/studio/config', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ provider: 'mcp', config: obj, set_current: false }) });
-        const j = await r.json();
-        if (mcpStatus) mcpStatus.textContent = j.ok ? 'Saved' : (j.message || 'Save failed');
-        // Refresh status to reflect saved config
-        refreshStatus();
-      } catch (e) {
-        if (mcpStatus) mcpStatus.textContent = 'Save failed';
-      }
-    }
-
-    async function checkOllama() {
-      status.textContent = 'Checking Ollama...';
-      if (statusDot) { statusDot.style.background = '#9ca3af'; statusDot.title = 'Checking Ollama...'; }
-      try {
-        const r = await fetch('/studio/check-ollama');
-        const j = await r.json();
-        status.textContent = j.ok ? 'Ollama is reachable on http://127.0.0.1:11434' : 'Ollama is not reachable';
-        if (statusDot) { statusDot.style.background = j.ok ? '#10b981' : '#ef4444'; statusDot.title = j.ok ? 'Ollama reachable' : 'Ollama not reachable'; }
-      } catch (e) {
-        status.textContent = 'Ollama check failed';
-        if (statusDot) { statusDot.style.background = '#ef4444'; statusDot.title = 'Ollama check failed'; }
-      }
-    }
-
-    async function saveStudio() {
-      const payload = { model: modelInp.value || 'deepseek-r1:8b' };
-      try {
-        const r = await fetch('/studio/config', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ provider: 'local', config: payload, set_current: true }) });
-        const j = await r.json();
-        status.textContent = j.ok ? 'Saved. You can now use the chat.' : (j.message || 'Save failed');
-        await refreshStatus();
-      } catch (e) { status.textContent = 'Save failed'; }
-    }
-
-    async function saveRemote() {
-      const keyEl = document.getElementById('inp_remote_api_key');
-      const modelEl = document.getElementById('inp_remote_model');
-      const key = keyEl && keyEl.value ? keyEl.value : '';
-      const model = modelEl && modelEl.value ? modelEl.value : '';
-      const provider = providerSelect ? providerSelect.value : 'openai';
-      const cfg = { api_key: key, model: model };
-      const msg = document.getElementById('remote_status');
-      if (msg) msg.textContent = 'Saving...';
-      try {
-        const r = await fetch('/studio/config', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ provider: provider, config: cfg, set_current: true }) });
-        const j = await r.json();
-        if (msg) msg.textContent = j.ok ? 'Saved.' : (j.message || 'Save failed');
-      } catch (e) { if (msg) msg.textContent = 'Save failed'; }
-    }
-
-    async function checkRemote() {
-      const keyEl = document.getElementById('inp_remote_api_key');
-      const modelEl = document.getElementById('inp_remote_model');
-      const key = keyEl && keyEl.value ? keyEl.value : '';
-      const model = modelEl && modelEl.value ? modelEl.value : '';
-      const provider = providerSelect ? providerSelect.value : 'openai';
-      const msg = document.getElementById('remote_status');
-      if (msg) msg.textContent = 'Checking...';
-      try {
-        const r = await fetch('/studio/check-remote', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ provider, api_key: key, model }) });
-        const j = await r.json();
-        if (msg) msg.textContent = j.ok ? 'Connectivity OK' : (j.message || (j.error && (j.error.detail || j.error.message || j.error.error)) || 'Connectivity failed');
-      } catch (e) { if (msg) msg.textContent = 'Connectivity failed'; }
-    }
-
-    function setProviderOptions(cloudEnabled) {
-      try {
-        if (!providerSelect) return;
-        // Desired list depending on cloud flag
-        var desired = cloudEnabled ? [
-          { v: 'local', t: 'Ollama' },
-          { v: 'openai', t: 'ChatGPT' },
-          { v: 'mistral', t: 'Mistral' },
-          { v: 'claude', t: 'Claude' },
-          { v: 'gemini', t: 'Gemini' }
-        ] : [
-          { v: 'local', t: 'Ollama' }
-        ];
-        // If options already match, skip rebuild (lightweight check by values set)
-        var currentValues = Array.prototype.map.call(providerSelect.options || [], function (o) { return o && o.value; });
-        var desiredValues = desired.map(function (d) { return d.v; });
-        var equal = currentValues.length === desiredValues.length && currentValues.every(function (v, i) { return v === desiredValues[i]; });
-        if (!equal) {
-          providerSelect.innerHTML = '';
-          desired.forEach(function (d) {
-            var opt = document.createElement('option');
-            opt.value = d.v; opt.textContent = d.t;
-            providerSelect.appendChild(opt);
-          });
-        }
-        // Force selection to local if cloud is disabled
-        if (!cloudEnabled) {
-          providerSelect.value = 'local';
-        }
-      } catch (e) { /* noop */ }
-    }
-
-    function updateProviderUI(provider, statusObj) {
-      // Update logo
-      let src = '/static/ollama.png';
-      let alt = 'Ollama Logo';
-      if (provider === 'openai') { src = '/static/chatgpt.svg'; alt = 'ChatGPT Logo'; }
-      else if (provider === 'mistral') { src = '/static/mistral.svg'; alt = 'Mistral Logo'; }
-      else if (provider === 'claude') { src = '/static/claude.png'; alt = 'Claude Logo'; }
-      else if (provider === 'gemini') { src = '/static/gemini.png'; alt = 'Gemini Logo'; }
-      if (providerLogoInline) { providerLogoInline.src = src; providerLogoInline.alt = alt; }
-      if (providerLogoRemote) { providerLogoRemote.src = src; providerLogoRemote.alt = alt; }
-      // Toggle setup cards
-      var cloudEnabled = !!(statusObj && statusObj.cloud_enabled);
-      if (provider !== 'local' && !cloudEnabled) {
-        // Force local UI when cloud disabled
-        provider = 'local';
-        if (providerSelect) providerSelect.value = 'local';
-      }
-      if (provider === 'local') {
-        const isConfigured = !!(statusObj && statusObj.configured);
-        elOnboarding.style.display = isConfigured ? 'none' : 'block';
-        elRemote.style.display = 'none';
-        elChat.style.display = isConfigured ? 'block' : 'none';
-      } else {
-        // Only show remote setup when cloud is enabled
-        if (cloudEnabled) {
-          elOnboarding.style.display = 'none';
-          elRemote.style.display = 'block';
-          elChat.style.display = 'none';
-        } else {
-          const isConfigured = !!(statusObj && statusObj.configured);
-          elOnboarding.style.display = isConfigured ? 'none' : 'block';
-          elRemote.style.display = 'none';
-          elChat.style.display = isConfigured ? 'block' : 'none';
-        }
-      }
-      // Toggle provider-specific help
-      const h11 = document.getElementById('help_openai_1');
-      const h12 = document.getElementById('help_openai_2');
-      const h21 = document.getElementById('help_mistral_1');
-      const h22 = document.getElementById('help_mistral_2');
-      const c11 = document.getElementById('help_claude_1');
-      const c12 = document.getElementById('help_claude_2');
-      const g11 = document.getElementById('help_gemini_1');
-      const g12 = document.getElementById('help_gemini_2');
-      var showHelp = function (cond) { return cond ? '' : 'none'; };
-      var allowRemoteHelp = cloudEnabled;
-      if (h11) h11.style.display = allowRemoteHelp && provider === 'openai' ? '' : 'none';
-      if (h12) h12.style.display = allowRemoteHelp && provider === 'openai' ? '' : 'none';
-      if (h21) h21.style.display = allowRemoteHelp && provider === 'mistral' ? '' : 'none';
-      if (h22) h22.style.display = allowRemoteHelp && provider === 'mistral' ? '' : 'none';
-      if (c11) c11.style.display = allowRemoteHelp && provider === 'claude' ? '' : 'none';
-      if (c12) c12.style.display = allowRemoteHelp && provider === 'claude' ? '' : 'none';
-      if (g11) g11.style.display = allowRemoteHelp && provider === 'gemini' ? '' : 'none';
-      if (g12) g12.style.display = allowRemoteHelp && provider === 'gemini' ? '' : 'none';
-    }
-
-    // --- Source pre-prompt helpers ---
-    function buildDomainPreprompt() {
-      return 'Vous êtes un expert en qualité des données. Votre but est d\'aider à détecter, expliquer et corriger des anomalies de qualité (ex: doublons, valeurs manquantes, incohérences, dérive, outliers, règles métier).';
-    }
-    async function fetchSourceDetails(sourceId) {
-      try {
-        const url = '/sources/preview?source_id=' + encodeURIComponent(sourceId) + '&verbose=1&limit=1';
-        const r = await fetch(url);
-        const j = await r.json();
-        return j || null;
-      } catch (e) { return null; }
-    }
-    function buildSourceExcerpt(view) {
-      try {
-        if (!view || typeof view !== 'object') return '';
-        const type = String(view.type || '').toLowerCase();
-        if (type === 'table') {
-          const rows = Array.isArray(view.rows) ? view.rows : (Array.isArray(view.items) ? view.items : []);
-          const headers = Array.isArray(view.headers) ? view.headers : (rows.length && typeof rows[0] === 'object' ? Object.keys(rows[0]) : []);
-          // Normalize rows to array of arrays
-          let outRows = [];
-          if (rows.length && typeof rows[0] === 'object' && !Array.isArray(rows[0])) {
-            outRows = rows.map(function (it) { return headers.map(function (h) { var v = it[h]; return v == null ? '' : String(v); }); });
-          } else if (rows.length && Array.isArray(rows[0])) {
-            outRows = rows;
-          }
-          const maxRows = 5;
-          const head = headers.join(' | ');
-          const sep = headers.map(function () { return '---'; }).join(' | ');
-          const body = outRows.slice(0, maxRows).map(function (r) { return r.map(function (c) { return String(c); }).join(' | '); }).join('\n');
-          const more = outRows.length > maxRows ? '\n…' : '';
-          return 'Aperçu des données (table):\n' + head + '\n' + sep + '\n' + body + more;
-        }
-        if (type === 'text' && typeof view.text === 'string') {
-          const s = view.text.slice(0, 1000);
-          return 'Aperçu du texte:\n' + s + (view.text.length > 1000 ? '\n…' : '');
-        }
-        if (type === 'json' && (view.data != null)) {
-          let s = '';
-          try { s = JSON.stringify(view.data, null, 2); } catch (e) { s = String(view.data); }
-          s = s.slice(0, 1000);
-          return 'Aperçu JSON:\n' + s + (s.length === 1000 ? '\n…' : '');
-        }
-        if (typeof view.csv === 'string' && view.csv) {
-          const s = view.csv.split(/\r?\n/).slice(0, 8).join('\n');
-          return 'Aperçu CSV:\n' + s + (view.csv.split(/\r?\n/).length > 8 ? '\n…' : '');
-        }
-        return '';
-      } catch (e) { return ''; }
-    }
-    function extractSourceInfo(j) {
-      let src = null;
-      try {
-        if (j && j.debug && j.debug.source) src = j.debug.source;
-        else if (j && j.source) src = j.source;
-        else if (j && j.data && j.data.source) src = j.data.source;
-        else if (j && j.view && j.view.source) src = j.view.source;
-        else if (j && j.data) src = j.data;
-      } catch (e) { /* noop */ }
-      let type = '';
-      let config = {};
-      let id = '';
-      let name = '';
-      try { type = (src && (src.type || (src.source && src.source.type))) || (j && j.type) || ''; } catch (e) { }
-      try { config = (src && (src.config || (src.source && src.source.config))) || (j && j.config) || {}; } catch (e) { }
-      try { id = String((src && (src.id || src.source_id)) || (j && j.id) || ''); } catch (e) { }
-      try { name = (src && src.name) || (j && j.name) || ''; } catch (e) { }
-      return { type: String(type || '').toLowerCase(), config: config || {}, id, name };
-    }
-    function buildPrepromptFromInfo(info) {
-      if (!info || !info.type) return '';
-      const t = info.type;
-      const c = info.config || {};
-      const kv = [];
-      function pushIf(k, label) { try { if (c && c[k] != null && c[k] !== '') { kv.push(label + ': ' + String(c[k])); } } catch (e) { } }
-      let header = '';
-      if (t === 'csv' || t === 'excel' || t === 'json' || t === 'parquet' || t === 'file' || t === 'xls' || t === 'xlsx') {
-        header = 'La source est de type "' + t + '" (fichier).';
-        pushIf('path', 'chemin');
-      } else if (t === 'folder') {
-        header = 'La source est de type "folder" (dossier).';
-        pushIf('path', 'chemin');
-        pushIf('pattern', 'pattern');
-      } else if (t === 's3') {
-        header = 'La source est de type "s3".';
-        pushIf('bucket', 'bucket');
-        pushIf('prefix', 'prefix');
-        pushIf('path', 'chemin');
-      } else if (t === 'gcs') {
-        header = 'La source est de type "gcs".';
-        pushIf('bucket', 'bucket');
-        pushIf('prefix', 'prefix');
-        pushIf('path', 'chemin');
-      } else if (t === 'azure_blob') {
-        header = 'La source est de type "azure_blob".';
-        pushIf('container', 'container');
-        pushIf('prefix', 'prefix');
-        pushIf('path', 'chemin');
-      } else if (t === 'hdfs') {
-        header = 'La source est de type "hdfs".';
-        pushIf('path', 'chemin');
-      } else {
-        header = 'La source est de type "' + t + '" (base de données).';
-        pushIf('host', 'host');
-        pushIf('port', 'port');
-        pushIf('database', 'database');
-        pushIf('schema', 'schema');
-        // Intentionally avoid sensitive fields (username, password, connection_string)
-      }
-      pushIf('table_or_query', 'table_or_query');
-      const details = kv.length ? (' ' + kv.join(', ') + '.') : '';
-      return header + details + '\nVeuillez utiliser ces informations pour lire le fichier ou requêter la base de données si nécessaire.';
-    }
-    async function buildSourcePreprompt(sourceId) {
-      try {
-        if (!sourceId) return '';
-        const cacheKey = 'studio_source_preprompt_' + sourceId;
-        try { const cached = sessionStorage.getItem(cacheKey); if (cached) return cached; } catch (e) { }
-        const j = await fetchSourceDetails(sourceId);
-        const info = extractSourceInfo(j);
-        const pre = buildPrepromptFromInfo(info);
-        // Try include a compact excerpt from preview view
-        let excerpt = '';
-        try { if (j && j.view) { excerpt = buildSourceExcerpt(j.view); } } catch (e) { excerpt = ''; }
-        const domain = buildDomainPreprompt();
-        const parts = [];
-        if (domain) parts.push(domain);
-        if (pre) parts.push(pre);
-        if (excerpt) parts.push(excerpt);
-        const full = parts.join('\n\n');
-        try { sessionStorage.setItem(cacheKey, full); } catch (e) { }
-        return full;
-      } catch (e) { return ''; }
-    }
-
-    async function sendMessage() {
-      const text = input.value.trim();
-      if (!text) return;
-      append('You', text);
-      input.value = '';
-      if (isStreaming) return;
-      isStreaming = true;
-      if (!currentConvId) { currentConvId = generateConvId(); updateUrlParam('conv_id', currentConvId); ensureAgentTab(currentConvId); }
-      send.disabled = true; if (stop) stop.style.display = 'inline-block';
-      const agentDiv = append('Agent', '');
-      const decoder = new TextDecoder();
-      streamingController = new AbortController();
-      let accumulated = '';
-      function render(text) {
-        const raw = text || '';
-        let html = '';
-        try {
-          html = (window.marked && window.marked.parse) ? window.marked.parse(raw) : raw.replace(/</g, '&lt;');
-        } catch (e) {
-          html = raw.replace(/</g, '&lt;');
-        }
-        try {
-          if (window.DOMPurify && window.DOMPurify.sanitize) {
-            html = window.DOMPurify.sanitize(html, { USE_PROFILES: { html: true } });
-          }
-        } catch (e) { /* ignore */ }
-        agentDiv.innerHTML = html;
-        log.scrollTop = log.scrollHeight;
-      }
-      try {
-        const issueId = readUrlParam('issue_id');
-        const sourceId = readUrlParam('source_id');
-        const domainPre = buildDomainPreprompt();
-        let preprompt = '';
-        try { if (sourceId) { preprompt = await buildSourcePreprompt(sourceId); } } catch (e) { preprompt = ''; }
-        let issueDetails = null;
-        try { if (issueId) { const s = sessionStorage.getItem('studio_issue_' + issueId); if (s) issueDetails = JSON.parse(s); } } catch (e) { }
-        const outgoingPrompt = [domainPre, preprompt, text].filter(Boolean).join('\n\n');
-        const r = await fetch('/studio/chat?stream=1', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ prompt: outgoingPrompt, conv_id: currentConvId, issue_id: issueId, source_id: sourceId, issue_details: issueDetails }), signal: streamingController.signal });
-        if (!r.ok) {
-          // Non-streaming error response
-          try {
-            const j = await r.json();
-            let show = j.response || (j.error && (typeof j.error === 'string' ? j.error : (j.error.detail || j.error.message || j.error.error))) || j.message || ('HTTP ' + r.status);
-            render(show);
-          } catch (_) {
-            const t = await r.text();
-            render(t || ('HTTP ' + r.status));
-          }
-        } else if (r.body) {
-          const reader = r.body.getReader();
-          while (true) {
-            const { value, done } = await reader.read();
-            if (done) break;
-            const chunk = decoder.decode(value, { stream: true });
-            accumulated += chunk;
-            render(accumulated);
-          }
-        } else {
-          render('(no response)');
-        }
-      } catch (e) {
-        if (e && e.name === 'AbortError') {
-          render(accumulated || '(stopped)');
-        } else {
-          render('Request failed');
-        }
-      } finally {
-        isStreaming = false;
-        send.disabled = false; if (stop) stop.style.display = 'none';
-        try {
-          const issueId = readUrlParam('issue_id');
-          if (issueId && currentConvId) {
-            await fetch('/studio/upload-conversation', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ conv_id: currentConvId, issue_id: issueId }) });
-          }
-        } catch (e) { /* ignore */ }
-        streamingController = null;
-      }
-    }
-
-    async function openHistory() {
-      if (!historyModal) return;
-      try {
-        if (historyStatus) historyStatus.textContent = '';
-        const r = await fetch('/studio/conversations');
-        const j = await r.json();
-        if (!j.ok) throw new Error(j.message || 'Failed to list conversations');
-        if (historySelect) {
-          historySelect.innerHTML = '';
-          (j.items || []).forEach(function (it) {
-            const opt = document.createElement('option');
-            opt.value = it.id;
-            opt.textContent = it.id + ' (' + (it.lines || 0) + ' msgs)';
-            historySelect.appendChild(opt);
-          });
-        }
-      } catch (e) {
-        if (historyStatus) historyStatus.textContent = 'Failed to load conversations';
-      }
-      historyModal.style.display = 'flex';
-    }
-
-    async function loadSelectedConversation() {
-      if (!historySelect || !historySelect.value) return;
-      const id = historySelect.value;
-      await loadConversationById(id, true);
-    }
-    async function loadConversationById(id, closeModal) {
-      try {
-        if (historyStatus) historyStatus.textContent = 'Loading...';
-        const r = await fetch('/studio/conversation?id=' + encodeURIComponent(id));
-        const j = await r.json();
-        if (!j.ok) throw new Error(j.message || 'Failed to load conversation');
-        log.innerHTML = '';
-        (j.messages || []).forEach(function (m) {
-          if (m.role === 'user') append('You', m.text || '');
-          else append('Agent', m.text || '');
-        });
-        currentConvId = j.id || id;
-        updateUrlParam('conv_id', currentConvId);
-        ensureAgentTab(currentConvId);
-        if (historyStatus) historyStatus.textContent = 'Loaded';
-        if (closeModal && historyModal) historyModal.style.display = 'none';
-      } catch (e) {
-        if (historyStatus) historyStatus.textContent = 'Failed to load conversation';
-      }
-    }
-
-    btnCheck && btnCheck.addEventListener('click', checkOllama);
-    btnSave && btnSave.addEventListener('click', saveStudio);
-    (document.getElementById('btn_save_remote')) && document.getElementById('btn_save_remote').addEventListener('click', saveRemote);
-    (document.getElementById('btn_check_remote')) && document.getElementById('btn_check_remote').addEventListener('click', checkRemote);
-    providerSelect && providerSelect.addEventListener('change', function () {
-      try {
-        var cloudEnabled = !!(lastStatus && lastStatus.cloud_enabled);
-        var target = cloudEnabled ? providerSelect.value : 'local';
-        if (providerSelect.value !== target) providerSelect.value = target;
-        updateProviderUI(target, lastStatus);
-      } catch (e) { updateProviderUI('local', lastStatus); }
-    });
-    send && send.addEventListener('click', sendMessage);
-    stop && stop.addEventListener('click', function () { if (streamingController) { try { streamingController.abort(); } catch (e) { } } });
-    input && input.addEventListener('keydown', function (e) { if (e.key === 'Enter') sendMessage(); });
-    btnHistory && btnHistory.addEventListener('click', openHistory);
-    historyClose && historyClose.addEventListener('click', function () { if (historyModal) historyModal.style.display = 'none'; });
-    historyLoad && historyLoad.addEventListener('click', loadSelectedConversation);
-    (document.getElementById('btn_new_conv')) && document.getElementById('btn_new_conv').addEventListener('click', function () {
-      try {
-        // Clear UI
-        log.innerHTML = '';
-        // Generate a new conversation id and update URL
-        currentConvId = generateConvId();
-        updateUrlParam('conv_id', currentConvId);
-        ensureAgentTab(currentConvId);
-      } catch (e) { /* noop */ }
-    });
-    btnMcp && btnMcp.addEventListener('click', openMcpModal);
-    mcpClose && mcpClose.addEventListener('click', closeMcpModal);
-    mcpSave && mcpSave.addEventListener('click', saveMcpConfig);
-    btnClearIssue && btnClearIssue.addEventListener('click', function () {
-      try {
-        const params = new URLSearchParams(window.location.search);
-        params.delete('issue_id');
-        const newUrl = window.location.pathname + (params.toString() ? ('?' + params.toString()) : '');
-        window.history.replaceState({}, '', newUrl);
-      } catch (e) { }
-    });
-
-    renderAgentTabs();
-    // Default to local-only providers until status says otherwise
-    try { setProviderOptions(false); } catch (e) { }
-    refreshStatus();
-    checkOllama();
-    // Load conversation if present in URL
-    (function () {
-      const cid = readUrlParam('conv_id');
-      if (cid) {
-        currentConvId = cid;
-        loadConversationById(cid, false);
-      }
-    })();
-    // Keep highlight/state on browser navigation
-    window.addEventListener('popstate', function () {
-      const cid = readUrlParam('conv_id');
-      if (cid && cid !== currentConvId) {
-        currentConvId = cid;
-        loadConversationById(cid, false);
-      }
-    });
-  })();
-</script>