codehere 0.7.1 → 1.0.1

package/dist/infrastructure/protocols/ui/app-script-wpass.js

@@ -0,0 +1,312 @@
+/**
+ * W-PASS approval modal — the browser half of mediated tool approval: poll for a pending
+ * pass, render what the agent wants to do in human words, take the decision back.
+ *
+ * Split out of app-script.ts (strangler fig, split 5). This is a verbatim slice of the same
+ * template literal and is interpolated back at exactly the position it was cut from, so it
+ * still shares the surrounding IIFE scope — `wpCloseModal` is called by the Escape handler
+ * that stayed behind, and that keeps working precisely because nothing about scope moved.
+ * Extraction is verified by hashing the composed APP_SCRIPT before and after: same bytes.
+ */
+export const WPASS_MODAL = `  /* v0.9 S6 part C · W-PASS approval modal · poll -> render -> decide */
+  let _wpCurrent = null;     // current pending pass shown in modal
+  let _wpEditing = false;
+  const wpModal = document.getElementById('wp-modal');
+  const wpBadge = document.getElementById('wp-pending-badge');
+
+  function wpPretty(v){
+    try { return JSON.stringify(v, null, 2); }
+    catch { return String(v); }
+  }
+  // Demo v12 diff-style payload coloring · render JSON with keys grey,
+  // string vals green, "from->to" patterns colored. When the value is a
+  // string starting with "FROM:VAL -> TO:VAL" or {from, to} pair, render
+  // the FROM with strike-through red and the TO with green.
+  function wpPayloadHtml(v){
+    function esc(s){ return String(s).replace(/[&<>"]/g, c=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;'}[c])); }
+    function renderVal(val, indent){
+      const pad = '  '.repeat(indent);
+      if(val === null) return '<span class="val">null</span>';
+      if(typeof val === 'number' || typeof val === 'boolean') return '<span class="val">'+esc(String(val))+'</span>';
+      if(typeof val === 'string'){
+        const m = val.match(/^(.+?)\\s*\\u2192\\s*(.+)$/);
+        if(m) return '<span class="from">"'+esc(m[1])+'"</span><span class="arrow">\\u203A</span><span class="val">"'+esc(m[2])+'"</span>';
+        return '<span class="val">"'+esc(val)+'"</span>';
+      }
+      if(Array.isArray(val)){
+        if(val.length === 0) return '[]';
+        const parts = val.map(x => pad + '  ' + renderVal(x, indent+1));
+        return '[\\n' + parts.join(',\\n') + '\\n' + pad + ']';
+      }
+      if(typeof val === 'object'){
+        // Special-case {from, to} -> render as colored diff
+        if('from' in val && 'to' in val){
+          return '<span class="from">"'+esc(String(val.from))+'"</span><span class="arrow">\\u203A</span><span class="val">"'+esc(String(val.to))+'"</span>';
+        }
+        const keys = Object.keys(val);
+        if(keys.length === 0) return '{}';
+        const parts = keys.map(k => pad + '  <span class="key">"'+esc(k)+'"</span>: ' + renderVal(val[k], indent+1));
+        return '{\\n' + parts.join(',\\n') + '\\n' + pad + '}';
+      }
+      return esc(String(val));
+    }
+    try { return renderVal(v, 0); }
+    catch { return esc(wpPretty(v)); }
+  }
+  function wpHumanTitle(intent){
+    const target = String(intent.target||'');
+    const method = String(intent.method||'POST');
+    const tail = target.replace(/^[a-z]+:\\/\\//,'');
+    return method + ' · ' + tail;
+  }
+  function wpHumanTarget(intent){
+    return String(intent.target||'');
+  }
+  let _wpTrustGrade = null;     // last-known trust grade for current pass
+  function wpRender(status){
+    if(!status || status.kind !== 'pending') return Promise.resolve();
+    const it = status.intent;
+    _wpCurrent = status;
+    _wpEditing = false;
+    document.getElementById('wp-title').textContent = wpHumanTitle(it);
+    document.getElementById('wp-reason').textContent = it.reason || '(no reason given)';
+    document.getElementById('wp-target').textContent = wpHumanTarget(it);
+    document.getElementById('wp-emitter').textContent = it.emittedBy || 'agent';
+    document.getElementById('wp-session').textContent = (it.sessionId||'').slice(0,12);
+    document.getElementById('wp-method').textContent = it.method || 'POST';
+    // v0.9 · fetch + render per-domain trust grade · returned promise lets
+    // callers (e.g., openWpModal demo synth) chain reliably instead of
+    // racing setTimeout. Resolves whether the fetch succeeds, 404s, or
+    // network-fails.
+    const trustPromise = fetch('/api/writepass/'+encodeURIComponent(it.id)+'/trust')
+      .then(r=>r.json()).then(t=>{
+        _wpTrustGrade = t;
+        const row = document.getElementById('wp-trust-row');
+        if(!row || !t || !t.host) { if(row) row.style.display='none'; return; }
+        row.style.display = '';
+        document.getElementById('wp-trust-host').textContent = t.host;
+        const ge = document.getElementById('wp-trust-grade');
+        ge.textContent = t.grade;
+        ge.className = 'wp-trust-grade ' + t.grade;
+        document.getElementById('wp-trust-reason').textContent = ' · ' + (t.reason||'');
+      })
+      .catch(()=>{ /* no daemon trust info · ignore */ });
+    document.getElementById('wp-targetline').textContent = wpHumanTarget(it);
+    document.getElementById('wp-payload').innerHTML = wpPayloadHtml(it.payload);
+    document.getElementById('wp-payload-wrap').style.display = '';
+    document.getElementById('wp-payload-edit').style.display = 'none';
+    document.getElementById('wp-actions').style.display = '';
+    document.getElementById('wp-actions-editing').style.display = 'none';
+    // S11 · a synthesized demo pass has no server-side intent — Approve would
+    // 404 every time (a dead-end the atomic audit found by clicking it).
+    // Disabled-with-reason, never a button that always fails.
+    const isSynth = !!status.synth || /^demo-wp-/.test(String(it.id||''));
+    const aBtn=document.getElementById('wp-approve'), eBtn=document.getElementById('wp-edit');
+    if(aBtn){ aBtn.disabled=isSynth; aBtn.title=isSynth?'demo pass \\u00b7 not sendable (no real write awaits)':''; }
+    if(eBtn){ eBtn.disabled=isSynth; eBtn.title=isSynth?'demo pass \\u00b7 nothing to edit-and-send':''; }
+    const result = document.getElementById('wp-result');
+    result.style.display = 'none';
+    result.className = 'wp-result';
+    result.textContent = '';
+    wpModal.classList.add('open');
+    wpBadge.classList.remove('show');
+    return trustPromise;
+  }
+  function wpCloseModal(){
+    wpModal.classList.remove('open');
+    _wpCurrent = null;
+    _wpEditing = false;
+    // Fix D9 (2026-05-23) · re-poll immediately so the badge re-appears
+    // for any still-pending pass without waiting up to 4s. Without this,
+    // closing the modal without deciding left the badge hidden for one
+    // poll cycle even though the pass was still pending.
+    wpPoll();
+  }
+  async function wpPoll(){
+    try{
+      const r = await fetch('/api/writepass/pending');
+      if(!r.ok) return;
+      const j = await r.json();
+      const passes = (j && j.passes) || [];
+      // S13 · the decision queue renders from the SAME pending list the
+      // modal polls — one truth, two surfaces.
+      window._wpPendingAll = passes;
+      try{ renderDecisions(); }catch(e){}
+      if(passes.length === 0){
+        if(!wpModal.classList.contains('open')) wpBadge.classList.remove('show');
+        return;
+      }
+      // If modal already open with this pass, skip · otherwise badge it.
+      const top = passes[0];
+      if(_wpCurrent && _wpCurrent.intent.id === top.intent.id) return;
+      if(wpModal.classList.contains('open')) return;
+      _wpCurrent = top;
+      wpBadge.classList.add('show');
+    }catch{
+      // Daemon hiccup · ignore · next poll catches up.
+    }
+  }
+  async function wpDecide(kind, editedPayload, trustThisDomain){
+    if(!_wpCurrent) return;
+    const passId = _wpCurrent.intent.id;
+    // Synth demo passes exist only client-side — the daemon has no record, so
+    // a POST can only error. Cancel just closes the modal locally.
+    if(_wpCurrent.synth || /^demo-wp-/.test(String(passId||''))){ wpCloseModal(); return; }
+    const body = { kind };
+    if(kind === 'edit') body.editedPayload = editedPayload;
+    if(trustThisDomain) body.trustThisDomain = true;
+    const result = document.getElementById('wp-result');
+    result.style.display = 'block';
+    result.className = 'wp-result';
+    result.textContent = kind === 'cancel' ? 'cancelling…' : 'sending…';
+    try{
+      const r = await fetch('/api/writepass/'+encodeURIComponent(passId)+'/decide', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(body),
+      });
+      const j = await r.json();
+      // v0.9 · first-write domain trust gate
+      if(j && j.status === 'requires_domain_trust'){
+        result.className = 'wp-result fail';
+        result.innerHTML = 'first-write to <b>'+orEscape(j.host)+'</b> (grade '+orEscape(j.grade)+') requires trust · '+orEscape(j.reason||'')+
+          '<div class="wp-trust-prompt"><label><input type="checkbox" id="wp-trust-confirm"/> Trust <b>'+orEscape(j.host)+'</b> for future writes · then approve + send</label>'+
+          ' <button class="wp-btn-approve" id="wp-trust-approve" style="margin-left:8px;padding:5px 10px;font-size:12px">Approve + trust</button></div>';
+        document.getElementById('wp-trust-approve').onclick = ()=>{
+          if(!document.getElementById('wp-trust-confirm').checked){ result.textContent='Tick the checkbox to confirm trust first.'; return; }
+          wpDecide('approve', undefined, true);
+        };
+        return;
+      }
+      const finalStatus = j && j.kind ? j : null;
+      if(!finalStatus){
+        result.className = 'wp-result fail';
+        result.textContent = 'unexpected response · check daemon logs';
+        return;
+      }
+      if(finalStatus.kind === 'cancelled'){
+        result.className = 'wp-result cancelled';
+        result.textContent = 'cancelled · audit chain captured the refusal';
+      } else if(finalStatus.kind === 'sent'){
+        const code = finalStatus.response && finalStatus.response.status;
+        result.className = 'wp-result ok';
+        result.textContent = '✓ sent · HTTP '+code+' · audit chain captured payload + response';
+      } else if(finalStatus.kind === 'failed'){
+        const code = finalStatus.response && finalStatus.response.status;
+        const err = finalStatus.response && finalStatus.response.error;
+        result.className = 'wp-result fail';
+        result.textContent = '\\u2715 failed · HTTP '+code+(err?' · '+err:'')+' · audit captured';
+      }
+      _wpCurrent = null;
+      setTimeout(wpCloseModal, 2400);
+    }catch(err){
+      result.className = 'wp-result fail';
+      result.textContent = 'request failed · '+((err&&err.message)||String(err));
+    }
+  }
+
+  wpBadge?.addEventListener('click', ()=>{
+    if(_wpCurrent && _wpCurrent.kind === 'pending') wpRender(_wpCurrent);
+    else wpPoll().then(()=>{ if(_wpCurrent) wpRender(_wpCurrent); });
+  });
+  // Expose an opener so the inline .write-pass primitive's "Approve + send"
+  // button (rendered inside the step timeline · see toolCardsHtml · gap 8)
+  // can open the modal. If a real pending pass is already polled, use it.
+  // Artifacts drawer open/close (task #51). Global so inline onclick resolves.
+  window.openArtD = function(){ _artOpen=true; var d=document.getElementById('artDrawer'),s=document.getElementById('artScrim'); if(d)d.classList.add('open'); if(s)s.classList.add('open'); };
+  window.closeArtD = function(){ _artOpen=false; var d=document.getElementById('artDrawer'),s=document.getElementById('artScrim'); if(d)d.classList.remove('open'); if(s)s.classList.remove('open'); };
+
+  // Otherwise synthesize a demo-shape pass from the open detail view so the
+  // modal isn't a dead button on the seed session.
+  window.openWpModal = function(){
+    if(_wpCurrent && _wpCurrent.kind === 'pending') {
+      wpRender(_wpCurrent);
+      return;
+    }
+    // Synthesize from the current detail view if one is open · the demo
+    // seed's W-PASS step has the payload encoded in step.output.
+    const id = (document.getElementById('detail-view') && window._detailId) || 'demo-pending';
+    const synth = {
+      kind: 'pending',
+      synth: true,
+      intent: {
+        id: 'demo-wp-' + Date.now(),
+        sessionId: id,
+        emittedBy: 'conductor',
+        method: 'PATCH',
+        target: 'linear://INFRA-247',
+        reason: 'Close ticket once tests pass + benchmark holds · human approval required for third-party writes.',
+        payload: { status: { from: 'in-progress', to: 'done' } },
+      },
+    };
+    // Synthesize the trust-grade row too so the demo modal shows the full
+    // affordance. wpRender now returns the fetch promise · chain on .then()
+    // so the override fires AFTER the async fetch settles (no setTimeout
+    // race · was 300ms guess, now deterministic). The trust-reason includes
+    // a "(demo data)" suffix per the 2026-05-24 retro: synth data must be
+    // visibly honest about being synth, per [[no-screen-lies]] +
+    // [[demo-synth-modal-pattern]] rules.
+    wpRender(synth).then(() => {
+      const row = document.getElementById('wp-trust-row');
+      if(!row) return;
+      row.style.display = '';
+      document.getElementById('wp-trust-host').textContent = 'linear.app';
+      const ge = document.getElementById('wp-trust-grade');
+      ge.textContent = 'A';
+      ge.className = 'wp-trust-grade A';
+      document.getElementById('wp-trust-reason').textContent =
+        ' \\u00B7 18mo on this domain \\u00B7 no overrides \\u00B7 (demo data \\u00B7 linear adapter not configured)';
+    });
+  };
+  // S13 · inline Approve/Deny from the decision queue — the SAME wpDecide
+  // the modal uses; the result is mirrored inline + toasted, never silent.
+  window.wpQueueDecide = function(passId, kind, btn){
+    const p=(window._wpPendingAll||[]).find(function(x){ return x.intent&&x.intent.id===passId; });
+    if(!p){ al('That write-pass is no longer pending'); return; }
+    _wpCurrent=p;
+    const row=btn&&btn.closest?btn.closest('.dq-row'):null;
+    if(row) row.querySelectorAll('.dq-btn').forEach(function(b){ b.disabled=true; });
+    Promise.resolve(wpDecide(kind)).then(function(){
+      // First-write trust gate -> the interactive confirm lives in the modal;
+      // open it rather than leaving a dead inline row.
+      if(document.getElementById('wp-trust-approve')){ wpRender(p); return; }
+      const res=document.getElementById('wp-result');
+      const txt=(res&&res.textContent)||'';
+      if(row){ const rl=row.querySelector('.dq-result'); if(rl&&txt){ rl.textContent=txt; rl.style.display='block'; } }
+      if(txt) al(txt);
+      wpPoll();
+    });
+  };
+  document.getElementById('wp-approve')?.addEventListener('click', ()=>wpDecide('approve'));
+  document.getElementById('wp-cancel')?.addEventListener('click', ()=>wpDecide('cancel'));
+  document.getElementById('wp-edit')?.addEventListener('click', ()=>{
+    if(!_wpCurrent) return;
+    _wpEditing = true;
+    document.getElementById('wp-payload-wrap').style.display = 'none';
+    const ta = document.getElementById('wp-payload-edit');
+    ta.style.display = 'block';
+    ta.value = wpPretty(_wpCurrent.intent.payload);
+    document.getElementById('wp-actions').style.display = 'none';
+    document.getElementById('wp-actions-editing').style.display = '';
+  });
+  document.getElementById('wp-edit-cancel')?.addEventListener('click', ()=>{
+    if(!_wpCurrent) return;
+    wpRender(_wpCurrent); // re-render the read-only view
+  });
+  document.getElementById('wp-save')?.addEventListener('click', ()=>{
+    const ta = document.getElementById('wp-payload-edit');
+    let parsed;
+    try{ parsed = JSON.parse(ta.value); }
+    catch(err){
+      const result = document.getElementById('wp-result');
+      result.style.display = 'block';
+      result.className = 'wp-result fail';
+      result.textContent = 'edited payload is not valid JSON · '+((err&&err.message)||'parse error');
+      return;
+    }
+    wpDecide('edit', parsed);
+  });
+  // Poll on load + every 4s. Cheap.
+  wpPoll();
+  setInterval(wpPoll, 4000);`;
+//# sourceMappingURL=app-script-wpass.js.map