system agents: generalise the scheduler and add the two memory lints

Memory is kept as a maintained wiki, and a wiki nobody prunes rots. This adds
the scheduled maintenance pass, and generalises the machinery TIC had grown so
that a background agent is a trait impl rather than a loop of its own.

Two lint agents, not one. The private pass runs per user over `user-memory/`
and reports to them; the shared pass runs once over `shared-memory/`, where the
interesting defect is different — a note failing the table rule, i.e. private
business written where every member can read it. It names the note and the
category without repeating the content, since restating it spreads the very
thing being flagged. Both share `agents/common/memory-lint.md`.

Both are read-only, and that is enforced twice: the prompt says report-never-
repair, and `shared-memory/*` writes are already `@fs_write require`, so an
agent that tried to fix something would raise an approval card from an
unattended pass, which is auto-denied. Read-only is the only design that works
here, not merely the safe one.

One scheduler for cadences three orders of magnitude apart. TIC runs every few
minutes, a lint weekly — the case that tempts a second loop. It stays one
because the wake-up decides nothing: `base_tick` picks only how often to look,
and whether an agent runs for a user is `is_due` against persisted state.

Due-ness moves out of the run log into a new owner table, `system_agent_state`.
The two answer different questions: the run log skips idle ticks so it stays a
history rather than a heartbeat, while scheduling needs every attempt. Reading
due-ness off the log would re-run an idle agent on every tick and never bring a
weekly one due once its last productive run aged out. Persisting it is also
what makes a long interval survive a restart — an in-memory deadline is fine at
TIC's scale, but a weekly agent on a box rebooted every few days would have it
re-armed before it ever fired.

The shared store belongs to nobody, so `AgentScope::Instance` runs that pass as
the first unlocked admin. An ownerless run would write its trace into system.db,
which the runs endpoint shows to nobody by design, and its notify() would have
no recipient; attributing it to a user keeps the whole per-user surface working
unchanged.

Settings move to where the run log is. `ConfigSet` gains `owner`, so placement
is data on the set rather than a page that knows set names; the System agents
page grows one tab per agent holding its description, its settings (admin only)
and its runs — "why did this do nothing last night?" is half a schedule
question and half a log question. The form is shared with the Config page, and
writes still go through PUT /api/config/{key}.

Fixes an authorization gap found on the way: neither /api/config handler took
the caller into account, so any authenticated session could read and write
instance-wide config. The sidebar hiding the page is presentation, not access
control. Both are now admin-gated.

web/components/system-agents.js

@@ -1,10 +1,14 @@
 import { html, nothing } from 'lit';
 import { LightElement } from '../lib/base.js';
 import { t }            from '../lib/i18n.js';
+import { ConfigFormController, maybeT, propKeyId } from './shared/config-form.js';
 
 const PAGE_ID  = 'system-agents';
 const PER_PAGE = 20;
 
+/** The overview tab: every agent's runs, interleaved. */
+const ALL_TAB = '__all__';
+
 function formatDate(iso) {
   if (!iso) return '—';
   return new Date(iso).toLocaleString(undefined, {
@@ -29,9 +33,27 @@ const STATUS_ICON = {
   cancelled: 'bi-slash-circle',
 };
 
+/**
+ * The background agents the instance runs, one tab per agent.
+ *
+ * **The tab is the agent, not the kind of information.** A tab holds an agent's
+ * settings *and* its run history, because the question people actually arrive
+ * with — "why did this do nothing last night?" — is answered half by the
+ * schedule and half by the log. Splitting them into a "runs" tab and a
+ * "settings" tab would put the two halves of every answer on opposite sides of
+ * the page.
+ *
+ * **Two audiences on one page.** The run history is the caller's own and is
+ * shown to everyone; the settings are instance-wide and shown only to an admin
+ * (`can_configure`). Hiding the form is presentation only — the backend gates
+ * both the listing and `PUT /api/config/{key}`.
+ */
 export class SystemAgentsPage extends LightElement {
   static properties = {
     _open:    { state: true },
+    _agents:  { state: true },
+    _canCfg:  { state: true },
+    _tab:     { state: true },
     _items:   { state: true },
     _total:   { state: true },
     _page:    { state: true },
@@ -42,11 +64,15 @@ export class SystemAgentsPage extends LightElement {
   constructor() {
     super();
     this._open    = false;
+    this._agents  = [];
+    this._canCfg  = false;
+    this._tab     = ALL_TAB;
     this._items   = [];
     this._total   = 0;
     this._page    = 1;
     this._loading = false;
     this._error   = null;
+    this._form    = new ConfigFormController(() => this.requestUpdate());
   }
 
   connectedCallback() {
@@ -56,7 +82,7 @@ export class SystemAgentsPage extends LightElement {
     window.addEventListener('llm-page-change', (e) => {
       this._open = e.detail.page === PAGE_ID;
       this.style.display = this._open ? 'flex' : 'none';
-      if (this._open) this._fetch(this._page);
+      if (this._open) this._loadAll();
     });
   }
 
@@ -65,12 +91,35 @@ export class SystemAgentsPage extends LightElement {
     super.disconnectedCallback();
   }
 
+  async _loadAll() {
+    await this._fetchAgents();
+    await this._fetch(this._page);
+  }
+
+  async _fetchAgents() {
+    try {
+      const res = await fetch('/api/system-agents');
+      if (!res.ok) throw new Error(`HTTP ${res.status}`);
+      const data   = await res.json();
+      this._agents = data.items ?? [];
+      this._canCfg = !!data.can_configure;
+      // A member gets no `config` at all, so there is nothing to seed.
+      this._form.seedFromSets(this._agents.map(a => a.config).filter(Boolean));
+    } catch (e) {
+      // Non-fatal: without the agent list the page still shows the run log,
+      // which is the half everyone can see.
+      this._agents = [];
+      this._canCfg = false;
+    }
+  }
+
   async _fetch(page) {
     this._loading = true;
     this._error   = null;
     try {
       const params = new URLSearchParams({ page, per_page: PER_PAGE });
-      const res    = await fetch(`/api/system-agents/runs?${params}`);
+      if (this._tab !== ALL_TAB) params.set('agent_id', this._tab);
+      const res = await fetch(`/api/system-agents/runs?${params}`);
       if (!res.ok) throw new Error(`HTTP ${res.status}`);
       const data    = await res.json();
       this._items   = data.items;
@@ -83,14 +132,33 @@ export class SystemAgentsPage extends LightElement {
     }
   }
 
+  _selectTab(id) {
+    if (this._tab === id) return;
+    this._tab  = id;
+    this._page = 1;
+    this._fetch(1);
+  }
+
   _openSession(id) {
     if (id != null) window.location.hash = `session/${id}`;
   }
 
   get _totalPages() { return Math.max(1, Math.ceil(this._total / PER_PAGE)); }
 
-  /// The agent's own counters. Rendered generically so a second system agent
-  /// needs no change here: unknown keys fall back to the raw key name.
+  get _currentAgent() {
+    return this._agents.find(a => a.id === this._tab) ?? null;
+  }
+
+  /** Server-supplied English unless the instance ships a translation. */
+  _agentLabel(agent) {
+    return {
+      name:        maybeT(`system_agents.agent.${agent.id}.name`, agent.name),
+      description: maybeT(`system_agents.agent.${agent.id}.desc`, agent.description),
+    };
+  }
+
+  /// The agent's own counters. Rendered generically so a new system agent needs
+  /// no change here: unknown keys fall back to the raw key name.
   _renderStats(stats) {
     if (!stats || typeof stats !== 'object') return '—';
     const parts = Object.entries(stats)
@@ -102,6 +170,46 @@ export class SystemAgentsPage extends LightElement {
     return parts.length ? parts.join(' · ') : '—';
   }
 
+  _renderTabs() {
+    if (this._agents.length === 0) return nothing;
+    const tab = (id, label, icon) => html`
+      <button class="sa-tab ${this._tab === id ? 'sa-tab--active' : ''}"
+              @click=${() => this._selectTab(id)}>
+        ${icon ? html`<i class="bi ${icon}"></i>` : nothing}${label}
+      </button>`;
+
+    return html`
+      <div class="sa-tab-bar">
+        ${tab(ALL_TAB, t('system_agents.tab.all'), 'bi-collection')}
+        ${this._agents.map(a => tab(a.id, this._agentLabel(a).name, null))}
+      </div>`;
+  }
+
+  /** The selected agent's description, plus its settings when the caller is an admin. */
+  _renderAgentPanel() {
+    const agent = this._currentAgent;
+    if (!agent) return nothing;
+    const label = this._agentLabel(agent);
+
+    return html`
+      <div class="sa-agent-panel">
+        <p class="sa-agent-desc">${label.description}</p>
+        ${this._canCfg && agent.config ? html`
+          <div class="config-set sa-agent-config">
+            <div class="config-set-header">
+              <div class="config-set-name">${t('system_agents.settings')}</div>
+            </div>
+            ${this._form.renderRows(agent.config.properties, p => {
+              const pk = propKeyId(p.key);
+              return {
+                name:        maybeT(`config.prop.${pk}.name`, p.name),
+                description: maybeT(`config.prop.${pk}.desc`, p.description),
+              };
+            })}
+          </div>` : nothing}
+      </div>`;
+  }
+
   _renderTable() {
     if (this._loading) return html`
       <div class="sa-state">
@@ -123,12 +231,15 @@ export class SystemAgentsPage extends LightElement {
       </div>
     `;
 
+    // The agent column is redundant once a single agent's tab is selected.
+    const showAgent = this._tab === ALL_TAB;
+
     return html`
       <div class="sa-table-wrap">
         <table class="table table-sm sa-table">
           <thead>
             <tr>
-              <th>${t('system_agents.table.agent')}</th>
+              ${showAgent ? html`<th>${t('system_agents.table.agent')}</th>` : nothing}
               <th>${t('system_agents.table.started')}</th>
               <th>${t('system_agents.table.status')}</th>
               <th class="text-end">${t('system_agents.table.duration')}</th>
@@ -139,7 +250,7 @@ export class SystemAgentsPage extends LightElement {
             ${this._items.map(r => html`
               <tr class=${r.session_id != null ? 'sa-row--clickable' : ''}
                   @click=${() => this._openSession(r.session_id)}>
-                <td><span class="sa-agent">${r.agent_id}</span></td>
+                ${showAgent ? html`<td><span class="sa-agent">${r.agent_id}</span></td>` : nothing}
                 <td class="sa-date">${formatDate(r.started_at)}</td>
                 <td>
                   <span class="sa-status sa-status--${r.status}">
@@ -182,124 +293,19 @@ export class SystemAgentsPage extends LightElement {
 
   render() {
     return html`
-      <style>
-        .sa-page {
-          display: flex;
-          flex-direction: column;
-          flex: 1;
-          min-height: 0;
-          width: 100%;
-          padding: 1.5rem;
-          overflow-y: auto;
-        }
-        .sa-header {
-          display: flex;
-          align-items: baseline;
-          gap: 0.75rem;
-          margin-bottom: 0.35rem;
-        }
-        .sa-title {
-          font-size: 1.2rem;
-          font-weight: 600;
-          margin: 0;
-        }
-        .sa-total-badge {
-          font-size: 0.75rem;
-          color: var(--bs-secondary-color);
-          background: var(--bs-tertiary-bg);
-          border: 1px solid var(--bs-border-color);
-          border-radius: 1rem;
-          padding: 0.1rem 0.6rem;
-        }
-        .sa-refresh-btn { margin-left: auto; }
-        .sa-subtitle {
-          font-size: 0.85rem;
-          color: var(--bs-secondary-color);
-          margin-bottom: 1.25rem;
-          max-width: 65ch;
-        }
-        .sa-table-wrap {
-          border: 1px solid var(--bs-border-color);
-          border-radius: 0.5rem;
-          overflow-x: auto;
-        }
-        .sa-table { margin-bottom: 0; }
-        .sa-row--clickable { cursor: pointer; }
-        .sa-row--clickable:hover td { background: var(--bs-tertiary-bg); }
-        .sa-agent {
-          font-family: monospace;
-          font-size: 0.82rem;
-        }
-        .sa-date {
-          font-size: 0.82rem;
-          color: var(--bs-secondary-color);
-          white-space: nowrap;
-        }
-        .sa-num {
-          font-variant-numeric: tabular-nums;
-          font-size: 0.85rem;
-          white-space: nowrap;
-        }
-        .sa-status {
-          display: inline-flex;
-          align-items: center;
-          gap: 0.3rem;
-          font-size: 0.8rem;
-          white-space: nowrap;
-        }
-        .sa-status--completed { color: var(--bs-success); }
-        .sa-status--failed    { color: var(--bs-danger); }
-        .sa-status--running   { color: var(--bs-secondary-color); }
-        .sa-status--cancelled { color: var(--bs-secondary-color); }
-        .sa-result {
-          font-size: 0.82rem;
-          color: var(--bs-secondary-color);
-        }
-        .sa-error {
-          color: var(--bs-danger);
-          display: inline-block;
-          max-width: 40ch;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-          vertical-align: bottom;
-        }
-        .sa-state {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          gap: 0.4rem;
-          padding: 3rem;
-          justify-content: center;
-          color: var(--bs-secondary-color);
-          font-size: 0.9rem;
-        }
-        .sa-state--empty i { font-size: 1.6rem; opacity: 0.6; }
-        .sa-state--error { color: var(--bs-danger); flex-direction: row; }
-        .sa-pagination {
-          display: flex;
-          align-items: center;
-          gap: 0.75rem;
-          margin-top: 1rem;
-          justify-content: center;
-        }
-        .sa-page-info {
-          font-size: 0.82rem;
-          color: var(--bs-secondary-color);
-        }
-      </style>
-
       <div class="sa-page">
         <div class="sa-header">
           <h2 class="sa-title"><i class="bi bi-robot"></i> ${t('system_agents.title')}</h2>
           <span class="sa-total-badge">${t('system_agents.total', { n: this._total })}</span>
           <button class="btn btn-sm btn-outline-secondary sa-refresh-btn"
                   ?disabled=${this._loading}
-                  @click=${() => this._fetch(this._page)}>
+                  @click=${() => this._loadAll()}>
             <i class="bi bi-arrow-clockwise"></i> ${t('system_agents.refresh')}
           </button>
         </div>
         <p class="sa-subtitle">${t('system_agents.subtitle')}</p>
+        ${this._renderTabs()}
+        ${this._renderAgentPanel()}
         ${this._renderTable()}
         ${this._renderPagination()}
       </div>