@staix/agent-hub 0.14.0 → 0.15.0

package/src/ui/index.html

@@ -201,6 +201,15 @@ details.settings-group{border-bottom:1px solid var(--line)}
 details.settings-group>summary{background:var(--panel-soft)}
 details.settings-group .row{border-bottom:1px dashed var(--line)}
 details.settings-group .row:last-child{border-bottom:0}
+/* Structure (#689): instances, lifecycle and the executable keys. Tier 3 is text only: no control, a command to run in the console. */
+.structure-group .row{padding:var(--space-3) var(--space-4)}
+.structure-instance,.structure-sdlc,.structure-add,.structure-backups{border-bottom:1px dashed var(--line)}
+.structure-tier3{background:var(--panel-soft);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius-surface);padding:var(--space-3) var(--space-4);margin:var(--space-3) var(--space-4)}
+.structure-tier3 code{display:block;overflow-wrap:anywhere;color:var(--muted)}
+.structure-group button,.structure-group input,.structure-group select{min-height:44px}
+.structure-field{display:grid;grid-template-columns:minmax(0,12rem) minmax(0,1fr);gap:var(--space-2);align-items:center;margin:var(--space-2) 0}
+.structure-diff{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--panel-soft);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius-control);padding:var(--space-2) var(--space-3);margin:var(--space-2) 0}
+.structure-error{color:var(--red);background:var(--red-soft);border:1px solid var(--red);border-radius:var(--radius-control);padding:var(--space-2) var(--space-3);margin:var(--space-2) 0}
 /* Peer colours: the registry's hue, one variant per theme, generated by peer-palette.ts */
 /* PEER_PALETTE_CSS */
 
@@ -233,7 +242,7 @@ details.settings-group .row:last-child{border-bottom:0}
 .board-unknown{padding:var(--space-3) var(--space-4);color:var(--amber)}
 @media(max-width:1100px){.board-columns{grid-template-columns:repeat(2,minmax(0,1fr))}}
 @media(max-width:900px){.stack{gap:var(--space-4)}.stream{height:300px}footer{padding:var(--space-4)}}
-@media(max-width:600px){.split{grid-template-columns:minmax(0,1fr)}.board-columns{grid-template-columns:1fr;padding:var(--space-3)}.board-toolbar{align-items:stretch}.board-toolbar select{max-width:none;width:100%}.board-toolbar label{width:100%}}
+@media(max-width:600px){.structure-field{grid-template-columns:minmax(0,1fr)}.structure-tier3{margin:var(--space-3)}.split{grid-template-columns:minmax(0,1fr)}.board-columns{grid-template-columns:1fr;padding:var(--space-3)}.board-toolbar{align-items:stretch}.board-toolbar select{max-width:none;width:100%}.board-toolbar label{width:100%}}
 /* Reduced motion (#469 R6): one rule for the whole page. Every transition and animation is off, whatever rule declares it. */
 @media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
 
@@ -863,6 +872,105 @@ function settingRow(row, raise) {
   actions.append(save); if (row.type === 'roles') { const inherit = el('button', 'Use profile/shared roles'); inherit.type = 'button'; inherit.dataset.mutation = 'project'; inherit.disabled = managerMode && !snapshotValid; inherit.setAttribute('aria-label', 'Inherit ' + row.label); inherit.addEventListener('click', async () => { out.textContent = 'Restoring inherited role guidance...'; const accepted = await action({action:'setting',key:row.key,value:null}, inherit); out.textContent = accepted ? 'Inherited selection saved. Applies at the next peer start.' : $('notice').textContent; }); actions.append(inherit); } node.append(actions, out);
   return node;
 }
+/* Structure (#689): tier 2 edits inside a settings session; tier 3 keys are text only, with the console command that changes them. */
+const STRUCTURE_FIELDS = [['kind', 'text'], ['roles', 'text'], ['start_mode', 'text'], ['review_mode', 'text'], ['worktree', 'text'], ['permission_mode', 'text'], ['readOnly', 'text']];
+const structureState = {revision: {}, lines: [], error: '', field: '', tier: 0, preview: null};
+const structureList = (text) => String(text).split(',').map((item) => item.trim()).filter(Boolean);
+function structureField(form, name, label, placeholder) {
+  const row = el('div', undefined, 'structure-field'), input = el('input'), id = 'structure-' + name;
+  const title = el('label', label, 'meta'); title.htmlFor = id; input.id = id; input.type = 'text'; input.placeholder = placeholder || ''; input.setAttribute('aria-label', label);
+  row.append(title, input); form.append(row); return input;
+}
+function structureResult(box, out) {
+  box.replaceChildren();
+  if (structureState.error) box.append(el('p', structureState.error + (structureState.field ? ' (' + structureState.field + ')' : ''), 'structure-error'));
+  if (structureState.lines.length) box.append(el('pre', structureState.lines.join('\n'), 'structure-diff'));
+  if (out) out(box);
+}
+function structureForm(cls, title, build, file, edit, raise) {
+  const form = el('div', undefined, cls), head = el('p', title, 'label'), fields = {}, result = el('div');
+  form.append(head);
+  build(form, fields);
+  const preview = el('button', 'Preview change', 'primary'); preview.type = 'button'; preview.dataset.mutation = 'project';
+  const reason = structureField(form, 'reason', 'Reason (recorded with the change)', 'why this change');
+  const actions = el('div', undefined, 'actions'); actions.append(preview);
+  form.append(actions, result);
+  const body = () => { const set = fields.set(); return set ? {file, revision: edit.revisions[file], set} : null; };
+  preview.addEventListener('click', async () => {
+    structureState.error = ''; structureState.field = ''; structureState.lines = [];
+    const request = body();
+    if (!request) { if (!structureState.error) structureState.error = 'Give a mode or the required checks.'; structureResult(result); return; }
+    try {
+      const reply = await post('/action', {action:'config_edit_preview', edit: request});
+      if (reply.ok === false) { structureState.error = reply.error || 'The hub refused this change.'; structureState.field = reply.field || ''; }
+      else { structureState.lines = (reply.lines || []).map(String); structureState.tier = reply.tier || 2; }
+    } catch (error) { structureState.error = error.message; }
+    structureResult(result, (box) => {
+      if (structureState.error || structureState.tier === 3) { if (!structureState.error) box.append(el('p', 'This key runs code or locates secrets: change it in the console, never here.', 'structure-error')); return; }
+      const write = el('button', 'Write change', 'primary'); write.type = 'button'; write.dataset.mutation = 'project';
+      write.addEventListener('click', async () => {
+        if (!reason.value.trim()) { notice('Give a reason before writing.', true); return; }
+        const done = await action({action:'config_edit_apply', edit: request, reason: reason.value.trim()}, write);
+        if (done) { structureState.lines = []; structureResult(result); }
+      });
+      box.append(write);
+    });
+  });
+  return form;
+}
+function renderStructure(target, edit, raise) {
+  const group = el('div', undefined, 'structure-group'), head = el('div', undefined, 'row-head');
+  head.append(el('span', 'Structure', 'label'));
+  if (edit.sdlc && edit.sdlc.pending) head.append(badge('restart pending', 'warn'));
+  group.append(head);
+  if (!raise) group.append(el('p', 'Read only here. Open a settings session with ahub ui --settings to change instances, review, snapshots, approvals and the lifecycle.', 'meta'));
+  for (const instance of edit.instances || []) {
+    const row = el('div', undefined, 'structure-instance'), line = Object.entries(instance.fields).map(([key, value]) => key + ': ' + (Array.isArray(value) ? value.join(', ') : String(value))).join(' / ');
+    row.append(el('p', instance.id, 'label'), el('p', line || 'no tier 2 fields set', 'meta'));
+    if (instance.tier3.length) row.append(el('p', instance.tier3.join(', ') + ': set in the console', 'meta'));
+    group.append(row);
+  }
+  for (const block of edit.blocks || []) group.append(el('p', block.path + ': ' + settingText(block.value), 'meta'));
+  const lifecycle = el('div', undefined, 'structure-sdlc');
+  lifecycle.append(el('p', 'Lifecycle (sdlc.toml): ' + edit.sdlc.mode + '; required checks: ' + (edit.sdlc.requiredChecks.length ? edit.sdlc.requiredChecks.join(', ') : 'none'), 'meta'));
+  group.append(lifecycle);
+  if (raise) {
+    lifecycle.append(structureForm('structure-sdlc-form', 'Change the lifecycle', (form, fields) => {
+      const mode = structureField(form, 'sdlc-mode', 'sdlc mode (off, advise, enforce)', edit.sdlc.mode), checks = structureField(form, 'sdlc-checks', 'required checks, comma list', edit.sdlc.requiredChecks.join(', '));
+      fields.set = () => { const set = []; if (mode.value.trim()) set.push({path:['mode'], value: mode.value.trim()}); if (checks.value.trim()) set.push({path:['required_checks'], value: structureList(checks.value)}); return set.length ? set : null; };
+    }, 'sdlc.toml', edit, raise));
+    const add = structureForm('structure-add', 'Add an instance, or change one field of an existing one (type clear to remove a field)', (form, fields) => {
+      const id = structureField(form, 'id', 'instance id, <kind>-<name>', 'codex-review');
+      const inputs = {}; for (const [name] of STRUCTURE_FIELDS) inputs[name] = structureField(form, name, name + (name === 'roles' ? ' (comma list)' : name === 'readOnly' ? ' (true or false)' : ''), '');
+      const convert = (name, text) => name === 'roles' ? structureList(text) : name === 'readOnly' ? text === 'true' : text;
+      fields.set = () => {
+        const name = id.value.trim(), known = (edit.known || []).includes(name), typed = [];
+        for (const [field] of STRUCTURE_FIELDS) { const text = inputs[field].value.trim(); if (text) typed.push([field, text]); }
+        if (!name) { structureState.error = 'An instance needs an id and a kind.'; return null; }
+        // readOnly is exactly true or false: anything else is the person's typo, never a silent false.
+        if (typed.some(([field, text]) => field === 'readOnly' && text !== 'true' && text !== 'false' && text !== 'clear')) { structureState.error = 'readOnly is true or false.'; return null; }
+        if (known) {
+          // An existing instance changes leaf by leaf: a field left blank keeps its value, and a tier 3 field it holds is never part of the request.
+          if (!typed.length) { structureState.error = 'Type the field to change, or clear to remove it.'; return null; }
+          return typed.map(([field, text]) => ({path:['instances', name, field], value: text === 'clear' ? null : convert(field, text)}));
+        }
+        const value = {}; for (const [field, text] of typed) { if (text !== 'clear') value[field] = convert(field, text); }
+        if (!value.kind) { structureState.error = 'An instance needs an id and a kind.'; return null; }
+        return [{path:['instances', name], value}];
+      };
+    }, 'config.local.json', edit, raise);
+    group.append(add);
+  }
+  const tier3 = el('div', undefined, 'structure-tier3');
+  tier3.append(el('p', 'Executable and secret-locating keys', 'label'), el('p', "Changing one runs code with the daemon's rights or chooses where secrets are read from. It is never done from a browser: use the console command.", 'meta'));
+  for (const item of edit.tier3 || []) { tier3.append(el('p', item.key + (item.set ? ' (set)' : ' (not set)'), 'meta'), el('code', item.command)); }
+  group.append(tier3);
+  const backups = el('div', undefined, 'structure-backups');
+  backups.append(el('p', 'Backups (the last ' + (edit.backups || []).length + ')', 'label'));
+  for (const item of edit.backups || []) backups.append(el('p', new Date(item.at).toISOString() + ' ' + item.file + ' ' + item.bytes + ' bytes', 'meta'));
+  group.append(backups);
+  target.append(group);
+}
 const settingSlots = new Map();
 function setText(node, text) { if (node.textContent !== text) node.textContent = text; }
 function renderSettings(settings, roster = []) {
@@ -876,6 +984,7 @@ function renderSettings(settings, roster = []) {
     settingSlots.clear();
     const reload = el('div', undefined, 'settings-reload'); settingSlots.set('$reload', { node: reload, signature: null }); target.append(reload);
     const undo = el('div'); settingSlots.set('', { node: undo, signature: null }); target.append(undo);
+    const structure = el('div'); settingSlots.set('$structure', { node: structure, signature: null }); target.append(structure);
     for (const group of SETTING_GROUPS) {
       const rows = settings.rows.filter((row) => row.group === group);
       if (!rows.length) continue;
@@ -903,6 +1012,11 @@ function renderSettings(settings, roster = []) {
       }
     }
   }
+  const structureSlot = settingSlots.get('$structure'), structureSignature = JSON.stringify([settings.configEdit, raise]);
+  if (structureSlot && structureSlot.signature !== structureSignature) {
+    structureSlot.signature = structureSignature; structureSlot.node.replaceChildren();
+    if (settings.configEdit && Array.isArray(settings.configEdit.instances)) renderStructure(structureSlot.node, settings.configEdit, raise);
+  }
   const undoSlot = settingSlots.get(''), undoKey = settings.undo || '';
   if (undoSlot && undoSlot.signature !== undoKey) {
     undoSlot.signature = undoKey; undoSlot.node.replaceChildren();