@worca/app 1.5.0 → 1.6.0-rc.2

package/ui/public/ask-model.mjs

@@ -190,6 +190,7 @@ export function createThreadModel({ threadId }) {
         row.text = live.text;
         row.status = 'error';
         row.errorMessage = frame.message || 'unknown error';
+        row.errorCode = frame.code || null;
         live = null;
         inFlight = null;
         dirty.structure = true;

package/ui/public/ask-panel.mjs

@@ -7,6 +7,7 @@
 import { openScheduleSheet, browserTimeZone } from './schedule-sheet.mjs';
 import { formatInstant, describeRule } from '../../src/shared/schedule/recurrence.mjs';
 import { createThreadModel } from './ask-model.mjs';
+import { credentialBadge } from './credential-badges.mjs';
 import { createMarkdownRenderer } from './ask-markdown.mjs';
 import { createThinkingOrb } from './thinking-orb.mjs';
 import { workflowPickerLabel } from './results-view.mjs';
@@ -164,21 +165,22 @@ const PILL_MORPH_IN_MS = 520;
 const PILL_MORPH_OUT_MS = 800;
 const PILL_SETTLE_FALLBACK_MS = PILL_MORPH_OUT_MS + 150;
 
-export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContext, openNewPipeline, openComposer = null, loadMarkdown, hljsLoader, storage, raf, now, runStore = null }) {
-  const storedPick = readStoredModel();   // hoisted declaration (defined below); null when nothing is stored
+export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContext, openNewPipeline, openComposer = null, openClaudeSetup = null, loadMarkdown, hljsLoader, storage, raf, now, runStore = null }) {
+  const homePick = browserPick();         // hoisted declaration (defined below)
   const st = {
     open: false,
     threadId: null,
     model: null,              // createThreadModel for the active thread (Task 4+)
-    picker: {
-      model: storedPick && storedPick.model ? storedPick.model : FALLBACK_PICK.model,
-      effort: storedPick ? storedPick.effort : FALLBACK_PICK.effort,
-    },
+    picker: homePick.picker,
     // D11 provenance, tracked per slot: only a MODEL the user actually picked
     // outranks the backend default. An effort-only record leaves the model slot
     // unclaimed, so a later change to ASK_LIMITS.defaultModel still reaches here.
-    pickerFromStore: !!(storedPick && storedPick.model),
-    effortFromStore: storedPick !== null,
+    pickerFromStore: homePick.pickerFromStore,
+    effortFromStore: homePick.effortFromStore,
+    // The picker shows the open thread's own last pick (its row's model/effort).
+    // It outranks the backend default like a stored pick, but it is the chat's,
+    // not the browser's: nothing sourced from a thread reaches worca-cc.ask.model.
+    pickerFromThread: false,
     catalog: null,
     // #397: the thread's project/workspace scope. pinned:false = Auto (follow the
     // page — today's behaviour). label caches the display name once resolved.
@@ -237,11 +239,28 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     } catch { /* storage unavailable */ }
     return null;                                    // no stored pick — the catalog decides (D5/D6/D11)
   }
+  /** The browser-level pick — what a new chat starts with: the stored record over the cold-start literal, with each slot's provenance. */
+  function browserPick() {
+    const stored = readStoredModel();
+    return {
+      picker: {
+        model: stored && stored.model ? stored.model : FALLBACK_PICK.model,
+        effort: stored ? stored.effort : FALLBACK_PICK.effort,
+      },
+      pickerFromStore: !!(stored && stored.model),
+      effortFromStore: stored !== null,
+    };
+  }
   function storeModel() {
     // Provenance travels with the record: writing st.picker.model when the user never
     // chose one would pin the cold-start literal (or a default they merely saw), and
-    // the backend would be authoritative exactly once per browser.
-    const rec = { model: st.pickerFromStore ? st.picker.model : null, effort: st.picker.effort };
+    // the backend would be authoritative exactly once per browser. A thread's model
+    // is not the user's browser-level choice either: an effort picked on it leaves
+    // the record's model slot as it was.
+    const model = st.pickerFromThread
+      ? (readStoredModel() || { model: null }).model
+      : (st.pickerFromStore ? st.picker.model : null);
+    const rec = { model, effort: st.picker.effort };
     try { storage.setItem('worca-cc.ask.model', JSON.stringify(rec)); } catch { /* ignore */ }
   }
   function readStoredThread() { try { return storage.getItem('worca-cc.ask.thread') || null; } catch { return null; } }
@@ -1231,15 +1250,20 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
   }
 
   function applyCatalogToPicker() {
+    const list = st.catalog && Array.isArray(st.catalog.models) ? st.catalog.models : [];
+    // A thread's model the catalog no longer has (a removed user model) falls back
+    // to the browser-level pick, then the backend default. The thread is not
+    // patched: its next send stores whatever is used.
+    if (st.pickerFromThread && list.length && !catalogEntry(st.picker.model)) { restoreBrowserPick(); return; }
     const fallback = catalogDefault();
     // Each slot is decided by its own provenance: a stored MODEL outranks the backend
     // default, and a stored EFFORT survives even when the model comes from the default.
     // (effortFromStore ⊇ pickerFromStore — a stored model always carries its effort.)
+    // A thread's pick claims both slots.
     const wanted = {
-      model: st.pickerFromStore ? st.picker.model : fallback.model,
-      effort: st.effortFromStore ? st.picker.effort : fallback.effort,
+      model: st.pickerFromThread || st.pickerFromStore ? st.picker.model : fallback.model,
+      effort: st.pickerFromThread || st.effortFromStore ? st.picker.effort : fallback.effort,
     };
-    const list = st.catalog && Array.isArray(st.catalog.models) ? st.catalog.models : [];
     const wantedEntry = catalogEntry(wanted.model);
     // Unknown stored/default id -> the backend default -> the first model we do
     // have that is not a hidden built-in (#422; a hidden id is still a valid pick).
@@ -1250,11 +1274,43 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     const changed = next.model !== st.picker.model || next.effort !== st.picker.effort;
     st.picker = next;
     // D11: persist ONLY a repair of a pick the user actually made. Writing the
-    // backend default here would make it authoritative exactly once, ever.
-    if (changed && st.pickerFromStore) storeModel();
+    // backend default here would make it authoritative exactly once, ever — and a
+    // thread's pick is never the browser's.
+    if (changed && st.pickerFromStore && !st.pickerFromThread) storeModel();
     updatePickerButton();
   }
 
+  /** Back to the browser-level pick (new chat, a thread with no model of its own). */
+  function restoreBrowserPick() {
+    const home = browserPick();
+    st.picker = home.picker;
+    st.pickerFromStore = home.pickerFromStore;
+    st.effortFromStore = home.effortFromStore;
+    st.pickerFromThread = false;
+    if (st.catalog) applyCatalogToPicker();
+    else updatePickerButton();
+  }
+
+  /** A thread SWITCH shows that thread's last model/effort; a row without one gets the browser-level pick. */
+  function applyThreadPick(thread) {
+    const t = thread && typeof thread === 'object' ? thread : null;
+    if (!t || typeof t.model !== 'string' || !t.model || typeof t.effort !== 'string' || !t.effort) { restoreBrowserPick(); return; }
+    st.picker = { model: t.model, effort: t.effort };
+    st.pickerFromThread = true;
+    if (st.catalog) applyCatalogToPicker();   // effort coerced against the entry; a dropped model falls back
+    else updatePickerButton();               // the raw id shows until the catalog lands
+  }
+
+  /** Keep the pick on the open thread, so switching away and back finds it before any send. */
+  function persistThreadPick() {
+    const id = st.threadId;
+    if (!id) return;                           // a brand-new chat: the first send stores it
+    const body = JSON.stringify({ model: st.picker.model, effort: st.picker.effort });
+    Promise.resolve()
+      .then(() => fetch(`/api/ask/threads/${id}`, { method: 'PATCH', headers: { 'Content-Type': 'application/json' }, body }))
+      .catch(() => { /* the next message stores the pick anyway */ });
+  }
+
   function loadCatalog() {
     if (st.catalog) return Promise.resolve(st.catalog);
     if (st.catalogLoading) return st.catalogLoading;
@@ -1313,7 +1369,9 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     st.picker = { model: id, effort: coerceEffort(catalogEntry(id), st.picker.effort) };
     st.pickerFromStore = true;                      // an explicit model choice claims the slot (D11)
     st.effortFromStore = true;
+    st.pickerFromThread = false;                    // the user's own pick now, not the thread's
     storeModel();
+    persistThreadPick();
     updatePickerButton();
     closePopover({ focusTrigger: false });
     focusComposer();
@@ -1323,6 +1381,7 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     st.picker = { ...st.picker, effort };
     st.effortFromStore = true;                      // the effort only — the model slot is untouched (D11)
     storeModel();
+    persistThreadPick();
     updatePickerButton();
     closePopover({ focusTrigger: false });
     focusComposer();
@@ -1355,6 +1414,9 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
       if (m.needsSignIn) {
         item.appendChild(tag('needs sign-in', 'is-err', m.signInMessage || 'The provider behind this model is not usable yet — Settings › Models › Providers.'));
       }
+      // Credential broker: whether the signed-in person has the key this model spends from.
+      const cb = credentialBadge(m.id);
+      if (cb) item.appendChild(tag(cb.text, cb.missing ? 'is-err' : 'is-key', cb.title));
       if (m.id === st.picker.model) item.appendChild(make('span', 'ask-model-check', '✓'));
       return item;
     };
@@ -1640,6 +1702,7 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     storeThread(null);
     el.title.textContent = 'Ask Worca';
     applyThreadScope(null);             // #397: a brand-new chat starts on Auto
+    restoreBrowserPick();               // …and on the browser-level pick, not the last chat's
     pruneCardEls();                     // st.model is already null — renderTranscript's keep set cannot see the old ids
     renderTranscript();
     updateMeters();
@@ -2404,6 +2467,55 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     return { el: rootEl };
   }
 
+  /** The web card (propose_web_access): proposed → applied | failed, or declined. The exact URL is shown, so a
+   *  request that smuggles data is visible before the click. Every value is text. */
+  function buildWebCard(block) {
+    const card = block.card || {};
+    const host = card.host || 'a website';
+    if (block.state === 'declined') return { el: make('div', 'ask-card-stub', `Declined — ${card.summary || `Read ${host}`}`) };
+    const rootEl = make('div', `ask-card ask-mcard ask-webcard is-${block.state}`);
+    rootEl.setAttribute('data-ask-webcard', block.state);
+    const result = card.result || null;
+    const head = make('div', 'ask-mcard-head');
+    const title = block.state === 'failed' ? 'Web access not granted'
+      : block.state === 'applied' ? (result && result.scope === 'always' ? 'Always allowed' : 'Allowed for this chat')
+        : 'Ask Worca wants to read a new site';
+    head.appendChild(make('span', 'ask-mcard-title', title));
+    head.appendChild(make('span', 'ask-mcard-kind', 'Web'));
+    rootEl.appendChild(head);
+    const body = make('div', 'ask-mcard-body');
+    const sum = make('div', 'ask-mcard-summary');
+    if (block.state === 'applied') sum.appendChild(svgIcon(WF_ICO.check, 15, 2.4));
+    sum.appendChild(make('span', null, host));
+    body.appendChild(sum);
+    if (card.reason) body.appendChild(make('div', 'ask-mcard-note', card.reason));
+    const ul = make('ul', 'ask-mcard-changes');
+    const li = make('li');
+    li.appendChild(make('span', 'ask-mcard-change-label', 'URL'));
+    const val = make('span', 'ask-mcard-change-val');
+    val.appendChild(make('span', 'ask-mcard-after', String(card.url || '')));
+    li.appendChild(val);
+    ul.appendChild(li);
+    body.appendChild(ul);
+    if (block.state === 'failed') body.appendChild(make('div', 'ask-mcard-failed', `Could not allow: ${block.error || (result && result.error) || 'unknown error'}`));
+    rootEl.appendChild(body);
+    rootEl.appendChild(make('div', 'ask-card-err'));
+    if (block.state === 'proposed') {
+      const actions = make('div', 'ask-mcard-actions');
+      const btn = (cls, text, attr) => { const b = make('button', cls, text); b.type = 'button'; b.setAttribute(attr, ''); return b; };
+      const decline = btn('ask-card-not-now', 'Deny', 'data-ask-web-decline');
+      decline.addEventListener('click', () => postCard(block, rootEl, { state: 'declined' }, decline));
+      const always = btn('ask-card-not-now', 'Always allow', 'data-ask-web-always');
+      always.title = `Adds ${host} to Settings → Ask Worca → Web access`;
+      always.addEventListener('click', () => postCard(block, rootEl, { state: 'applied', scope: 'always' }, always));
+      const chat = btn('ask-card-start', 'Allow for this chat', 'data-ask-web-chat');
+      chat.addEventListener('click', () => postCard(block, rootEl, { state: 'applied', scope: 'chat' }, chat));
+      actions.append(make('span', 'ask-card-actions-spacer'), decline, always, chat);
+      rootEl.appendChild(actions);
+    }
+    return { el: rootEl };
+  }
+
   /** The clone card (propose_clone_project): proposed → cloning → applied | failed, or declined. Every value is text. */
   function buildCloneCard(block) {
     const card = block.card || {};
@@ -2480,6 +2592,12 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
             closePopover({ focusTrigger: true });
           });
           item.appendChild(make('span', 'ask-model-name', m.label || m.id));
+          const cb = credentialBadge(m.id);
+          if (cb) {
+            const t = make('span', `ask-model-tag ${cb.missing ? 'is-err' : 'is-key'}`, cb.text);
+            t.title = cb.title;
+            item.appendChild(t);
+          }
           if (m.id === cur().model) item.appendChild(make('span', 'ask-model-check', '✓'));
           p.appendChild(item);
         }
@@ -3122,7 +3240,7 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
   function isProgressBlock(block) {
     const card = block.card || {};
     if (card.type === PROGRESS_CARD_TYPE) return true;
-    if (card.type === 'workflow' || card.type === 'metrics' || card.type === 'policy' || card.type === 'schedule' || card.type === 'model' || card.type === 'clone') return false;
+    if (card.type === 'workflow' || card.type === 'metrics' || card.type === 'policy' || card.type === 'schedule' || card.type === 'model' || card.type === 'clone' || card.type === 'web') return false;
     return block.state === 'started' || (block.state === 'failed' && !!block.runId);
   }
   function buildCard(block) {
@@ -3134,14 +3252,16 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     const isSchedule = !!(block.card && block.card.type === 'schedule');
     const isModel = !!(block.card && block.card.type === 'model');
     const isClone = !!(block.card && block.card.type === 'clone');
+    const isWeb = !!(block.card && block.card.type === 'web');
     const isProgress = isProgressBlock(block);
-    if (cached && cached.state === block.state && (isWorkflow || isMetrics || isSchedule || isModel || isClone || isProgress || block.state === 'proposed')) return cached.el;
+    if (cached && cached.state === block.state && (isWorkflow || isMetrics || isSchedule || isModel || isClone || isWeb || isProgress || block.state === 'proposed')) return cached.el;
     if (cached) disposeCardEntry(cached);
     const built = isWorkflow ? buildWorkflowCard(block, cached)
       : isMetrics ? buildMetricsCard(block)
       : isSchedule ? buildScheduleCard(block)
       : isModel ? buildModelCard(block)
       : isClone ? buildCloneCard(block)
+      : isWeb ? buildWebCard(block)
       : isProgress ? buildProgressCard(block)
         : { el: block.state === 'proposed' ? buildCardForm(block) : buildCardTerminal(block) };
     st.cardEls.set(block.id, { el: built.el, state: block.state, handle: built.handle || null, dispose: built.dispose || null, animate: !!built.animate, cancelAnim: null, lastW: -1 });
@@ -3386,10 +3506,15 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
       // Stopped after — and nothing more while the turn is live: the orb row at the
       // bottom of the message owns the elapsed and the meter, and printing either
       // set twice is the noise this replaced. A turn that ended badly says so
-      // instead of Done; nothing else marks a stop.
+      // instead of Done; nothing else marks a stop. A turn that ended before any
+      // result, or within a few ms (a signed-out CLI answers in ~20 ms), has no
+      // duration worth printing: plain Stopped, never a dangling "Stopped after"
+      // or "Stopped after 0.0s".
       if (!isLive) {
-        if (stopped) parts.push(make('span', 'ask-activity-label', 'Stopped after'));
-        parts.push(make('span', 'ask-activity-elapsed', fmtElapsed(r.durationMs) || ''));
+        const shown = fmtElapsed(r.durationMs);
+        const elapsed = shown && shown !== '0.0s' ? shown : '';
+        if (stopped) parts.push(make('span', 'ask-activity-label', elapsed ? 'Stopped after' : 'Stopped'));
+        parts.push(make('span', 'ask-activity-elapsed', elapsed));
         parts.push(make('span', 'ask-activity-spacer'));
         const meter = [fmtCtx(r.usage && r.usage.ctx), fmtUsd(r.costUsd)].filter(Boolean).join(' · ');
         parts.push(make('span', 'ask-activity-meter', meter));
@@ -3515,7 +3640,7 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
       if (b.kind === 'notice') parts.push(`n:${b.id ?? ''}:${b.text || ''}:${b.href || ''}`);
       else if (b.kind === 'card') parts.push(`c:${b.id}:${b.state || ''}:${(b.card && b.card.type) || ''}:${b.runId || ''}:${b.error || ''}`);
     }
-    parts.push(`r:${row.status || ''}:${row.errorMessage || ''}:${isLiveRow(row) ? 1 : 0}`);
+    parts.push(`r:${row.status || ''}:${row.errorMessage || ''}:${row.errorCode || ''}:${isLiveRow(row) ? 1 : 0}`);
     return parts.join('|');
   }
 
@@ -3565,7 +3690,15 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
         }
         if (cur.status === 'error') {
           const explained = (cur.blocks || []).some((b) => b && b.kind === 'notice');
-          if (cur.errorMessage) wrap.appendChild(make('div', 'ask-error-line', cur.errorMessage));
+          if (cur.errorCode === 'claude-signed-out' && typeof openClaudeSetup === 'function') {
+            // The CLI's raw "Not logged in" → one line whose link opens Connect Claude Code.
+            const line = make('div', 'ask-error-line', "Claude Code isn't signed in. ");
+            const link = make('a', '', 'Sign in…');
+            link.href = '#';
+            link.addEventListener('click', (e) => { e.preventDefault(); openClaudeSetup(); });
+            line.appendChild(link);
+            wrap.appendChild(line);
+          } else if (cur.errorMessage) wrap.appendChild(make('div', 'ask-error-line', cur.errorMessage));
           else if (!explained) wrap.appendChild(make('div', 'ask-error-line', 'This turn ended with an error.'));
         }
         if (isLiveRow(cur)) {
@@ -3643,12 +3776,16 @@ export function createAskPanel({ doc, win, fetch, sendWs, confirm, getPageContex
     // A SWITCH starts a fresh ledger, so the new chat rises in. A resync or a
     // reconnect re-loads the SAME thread and must keep it: those repaint rows the
     // user is already reading, mid-turn.
-    if (st.threadId !== id) st.seenRows = new Set();
+    const switched = st.threadId !== id;
+    if (switched) st.seenRows = new Set();
     st.threadId = id;
     st.model = createThreadModel({ threadId: id });
     st.model.load(snap);
     el.title.textContent = (snap.thread && snap.thread.title) || 'Ask Worca';
     applyThreadScope(snap.thread && snap.thread.context);   // #397: restore the pin
+    // The picker follows the chat — on a SWITCH only: a resync of the same thread
+    // would otherwise clobber a pick the user just made (its PATCH may not have landed).
+    if (switched) applyThreadPick(snap.thread);
     renderTranscript();
     updateMeters();
     // P4: the count rides the snapshot loadThread ALREADY fetched — no extra GET.