Autonomy { setAutonomy((s) => ({ ...s, [a.id]: v })); showToast(a.name + ' set to ' + AUTONOMY[v].label.toLowerCase(), 'Undo', () => setAutonomy((s) => ({ ...s, [a.id]: level }))); }}
/>
{AUTONOMY[level].caption}
{a.stats.map(([k, v]) => (
{k}
{v}
))}
shield{a.guardrail}{a.last}
);
})}
Every agent action is attributed in record timelines and the audit log. Raising autonomy never removes the audit trail - it only changes when you’re asked.
setRailsOpen(false)} />
);
}
/* ============================== INBOX ============================== */
const CONF_LABELS = { high: ['confirmed', 'High confidence'], medium: ['suggested', 'Medium confidence'], mixed: ['suggested', 'Mixed confidence'] };
function ApprovalsScreen() {
const { showToast } = React.useContext(E8Ctx);
/* R78: the queue is live (E8Queue). R82: guardrails hold blocked actions with the rule
cited, the stream is keyboard-first (J/K/A/E/R), and the median stat is measured. */
const [items, setItems] = React.useState(() => window.E8Queue.list());
const [tab, setTab] = React.useState('review');
const [sel, setSel] = React.useState(0);
const [railsOpen, setRailsOpen] = React.useState(false);
const isMobile = useIsMobile();
const listRef = React.useRef(null);
React.useEffect(() => window.E8Events.subscribe(['queue:changed', 'store:changed', 'policy:changed'], () => setItems(window.E8Queue.list())), []);
const move = (id, to, opts) => {
const res = window.E8Queue.decide(id, to, opts);
if (!res) return;
if (res.held) {
showToast('Held by guardrail \u00b7 ' + res.verdict.label + ' - ' + res.verdict.reason, 'Undo', () => res.undo());
return;
}
showToast(
to === 'done' ? '\u201c' + res.item.title.split(' - ')[0] + (opts && opts.override ? '\u201d approved (guardrail overridden)' : res.item.action ? '\u201d approved - done' : '\u201d approved') : 'Dismissed',
'Undo',
() => res.undo()
);
};
const counts = { review: 0, held: 0, done: 0 };
items.forEach((i) => { if (counts[i.state] != null) counts[i.state] += 1; });
const rows = items.filter((i) => i.state === tab);
/* Measured median time-to-clear over live items (enqueue timestamp -> decision). */
const clearSecs = items
.filter((i) => i.at && i.decidedAt && (i.state === 'done' || i.state === 'dismissed'))
.map((i) => (new Date(i.decidedAt) - new Date(i.at)) / 1000)
.filter((x) => x >= 0)
.sort((a, b) => a - b);
const median = clearSecs.length ? (clearSecs.length % 2 ? clearSecs[(clearSecs.length - 1) / 2] : (clearSecs[clearSecs.length / 2 - 1] + clearSecs[clearSecs.length / 2]) / 2) : null;
const fmtDur = (x) => x == null ? 'no decisions yet' : x < 90 ? Math.round(x) + ' seconds' : x < 5400 ? Math.round(x / 60) + ' minutes' : Math.round(x / 3600) + ' hours';
/* R82: the J/K/A/E/R stream. One clamped index drives the ring AND the key target;
A/R only act on tabs whose buttons offer them (never on Done). */
const selIdx = Math.min(sel, Math.max(0, rows.length - 1));
React.useEffect(() => { setSel(0); }, [tab]);
React.useEffect(() => { setSel((v) => Math.min(v, Math.max(0, rows.length - 1))); }, [rows.length]);
React.useEffect(() => {
const onKey = (e) => {
if (e.metaKey || e.ctrlKey || e.altKey) return;
const t = e.target;
if (t && (t.tagName === 'INPUT' || t.tagName === 'TEXTAREA' || t.tagName === 'SELECT' || t.isContentEditable)) return;
const k = e.key.toLowerCase();
if (['j', 'k', 'a', 'e', 'r'].indexOf(k) === -1) return;
e.preventDefault();
if (k === 'j') setSel((v) => Math.min(v + 1, Math.max(0, rows.length - 1)));
if (k === 'k') setSel((v) => Math.max(v - 1, 0));
const cur = rows[selIdx];
if (!cur) return;
if (k === 'a' && tab !== 'done') move(cur.id, 'done', tab === 'held' ? { override: true } : undefined);
if (k === 'r' && tab !== 'done') move(cur.id, 'dismissed');
if (k === 'e' && cur.route) navigate(cur.route);
};
window.addEventListener('keydown', onKey);
return () => window.removeEventListener('keydown', onKey);
}, [rows, selIdx, tab]);
React.useEffect(() => {
const el = listRef.current && listRef.current.children[selIdx];
if (el && el.scrollIntoView) el.scrollIntoView({ block: 'nearest' });
}, [selIdx, tab]);
return (
setRailsOpen(true)}>Guardrails navigate('agents')}>Tune autonomy
{counts.review > 1 ? { const undos = items.filter((i) => i.state === 'review').map((i) => window.E8Queue.decide(i.id, 'done', { batch: true })).filter(Boolean); const held = undos.filter((u) => u.held).length; showToast((undos.length - held) + ' approved' + (held ? ' \u00b7 ' + held + ' held by guardrails' : ''), 'Undo', () => undos.forEach((u) => u.undo())); }}>Approve all : null}
}
/>
Approvals
Everything the agents drafted or flagged for you. Approve it, edit it, or let it go - nothing moves without you.
{!isMobile ? J/K navigate · A {tab === 'held' ? 'override & approve' : 'approve'} · R dismiss · E open : null}
{[
'Agents draft; you approve. Nothing reaches a client or candidate without sign-off.',
'Guardrails run in code: blocked actions are held with the rule cited.',
'Every approval is logged with who, when and what changed.',
].map((t, i) => (
{r.desc}{r.id === 'no-overwrite-human' ? ' First producer: enrichment field updates (a later round) - the check is live for any queued field write today.' : ''}