@bongos/core 1.19.371 → 1.19.372

package/modules/hall-ui/public/dom-utils.js

@@ -269,11 +269,42 @@
     return (data && typeof data === 'object') ? data : {};
   }
 
+  // task 1003276 (goal 1000072, criterion legibility-categories) — a work
+  // CATEGORY as a chip. Lives HERE, not in goals-lib.js, because three surfaces
+  // render it — the Goals page, the Tasks board and the task page — and
+  // dom-utils.js is the only script all three load. One renderer means the
+  // goal's chip and the task's inherited chip cannot drift.
+  //
+  // A LABEL and nothing more: no href, no pointer affordance. A per-category
+  // destination would be a navigation tier, and that is precisely how an
+  // advisory word becomes the second hierarchy in practice even when no code
+  // gates on it (ADR 0192 — a category authorises nothing).
+  //
+  // `inherited` marks a TASK's chip. A task stores no category; it reads its
+  // goal's through goal_id, and saying so out loud stops anyone hunting for a
+  // per-task editor that does not exist.
+  //
+  // Uncategorised renders NOTHING rather than an "Uncategorised" pill: most
+  // goals will carry one, and a board of grey placeholders reads worse than a
+  // board with gaps. The Category filter's "not categorised yet" option is how
+  // you find them.
+  function categoryChip(category, opts) {
+    const label = category && category.label ? String(category.label).trim() : '';
+    if (!label) return '';
+    const inherited = !!(opts && opts.inherited);
+    const title = inherited
+      ? `Category: ${label} — inherited from this task's goal (a task carries no category of its own)`
+      : `Category: ${label}`;
+    return `<span class="gr-cat${inherited ? ' gr-cat--inherited' : ''}" title="${escapeHtml(title)}">`
+      + `${escapeHtml(label)}${inherited ? '<i class="gr-cat__from" aria-hidden="true">via goal</i>' : ''}</span>`;
+  }
+
   window.OTB = {
     escapeHtml, $, fmtNum, num, fmtInt, fmtCompact, fmtDate, rankLabel, toast, moduleOn,
     errCode, errMessage, errDetails, // task 1002462 — ADR 0116 envelope readers
     contributeSettingsPanel, settingsPanels,
     contributeHallWidget, hallWidgets, hallWidgetIds,
     splitCriterion,
+    categoryChip, // task 1003276 — shared by the Goals page, the Tasks board and the task page
   };
 })();

package/modules/hall-ui/public/goals-page.js

@@ -228,6 +228,34 @@
     }
   }
 
+  // task 1003276 — the Category dropdown. Unlike Version and Owner (derived from
+  // the loaded goals), the options come from the project's SET — GET
+  // /work-categories — so a category nobody has used yet is still offered, and a
+  // client never hard-codes the labels ("present in every builders hall on any
+  // project" only holds if the vocabulary travels over the wire). The 'none'
+  // option finds the uncategorised, which is the set this feature exists to
+  // shrink. Best-effort: a failed fetch leaves the control with just "— any —".
+  async function populateCategoryFilter() {
+    const sel = $('#f-goal-category');
+    if (!sel) return;
+    let cats = [];
+    try {
+      cats = (await getJSON(`${API}/work-categories`))?.categories || [];
+    } catch (_) { return; }
+    for (const c of cats) {
+      const opt = document.createElement('option');
+      opt.value = c.slug;
+      opt.textContent = c.label;
+      sel.appendChild(opt);
+    }
+    if (cats.length) {
+      const opt = document.createElement('option');
+      opt.value = 'none';
+      opt.textContent = 'not categorised yet';
+      sel.appendChild(opt);
+    }
+  }
+
   // Archon check for the detail view's manage/visibility affordances (the
   // server-side rank gates are the real enforcement). The task-1760 drag-reorder
   // affordance this once also served is retired — see the note where
@@ -797,6 +825,9 @@
       // task 1003135 — fire-and-forget: the Owner options fill when the (cached)
       // directory resolves; boot never waits on a label lookup.
       populateOwnerFilter().catch(() => {});
+      // task 1003276 — same fire-and-forget posture: boot never waits on the
+      // category vocabulary, and the board renders fine before it lands.
+      populateCategoryFilter().catch(() => {});
       // Prefetch details (ring + members on the cards). Sequentially-parallel,
       // failure-tolerant: a card without detail still renders.
       // task 1002439 — also fold in per-goal task-readiness rollups (one request
@@ -859,6 +890,9 @@
       { id: 'f-goal-status', label: 'Status', options: [{ value: '', label: '— any —' }, 'open', 'achieved', 'archived'] },
       { id: 'f-goal-mine', label: 'Membership', options: [{ value: '', label: 'All goals' }, { value: 'mine', label: 'My goals' }] },
       { id: 'f-goal-owner', label: 'Owner', options: [{ value: '', label: '— any —' }] },
+      // task 1003276 — filled from GET /work-categories after boot
+      // (populateCategoryFilter), the populateOwnerFilter pattern.
+      { id: 'f-goal-category', label: 'Category', options: [{ value: '', label: '— any —' }] },
       { id: 'f-goal-order',
         label: 'Sort',
         value: GOAL_SORTS[savedGoalSort] ? savedGoalSort : undefined,

package/modules/hall-ui/public/goals-render.js

@@ -19,7 +19,7 @@
 
   window.OTBGoalsRender = function createGoalsRender(ctx) {
     const { API, curLabel, getJSON, patchJSON, postJSON, sameId, selfId, state } = ctx;
-    const { escapeHtml, $, fmtNum, fmtDate, toast, rankLabel } = window.OTB;
+    const { escapeHtml, $, fmtNum, fmtDate, toast, rankLabel, categoryChip } = window.OTB;
     const {
       priorityRank, touchesConflict, rankTagHtml, deHashRefs,
       creditsPerMinute, buildPromptForTask, friendlyBatchReason,
@@ -81,11 +81,18 @@
     const q = ($('#f-goals-search')?.value || '').trim().toLowerCase();
     const needle = q.replace(/^#/, '');
     const owner = $('#f-goal-owner')?.value || '';
+    // task 1003276 — the Category dropdown. Matches on the SLUG (the stable
+    // machine key) so re-wording a label never breaks a filter, and 'none' is
+    // the uncategorised set — which must be findable, because "what has nobody
+    // placed yet" is exactly the prompt this feature is built around.
+    const cat = $('#f-goal-category')?.value || '';
     const matchesSearch = (g) => !needle
       || String(g.id).includes(needle)
       || (g.title || '').toLowerCase().includes(needle);
     const matchesOwner = (g) => !owner
       || (owner === 'none' ? g.created_by == null : String(g.created_by) === owner);
+    const matchesCategory = (g) => !cat
+      || (cat === 'none' ? !g.category : (g.category?.slug === cat));
     const myId = selfId();
     const iAmMember = (g) => {
       const d = state.details.get(String(g.id));
@@ -96,6 +103,7 @@
       (!status || g.status === status) &&
       matchesSearch(g) &&
       matchesOwner(g) &&
+      matchesCategory(g) &&
       (!mineOnly || iAmMember(g)));
   }
   function goalStampHtml(g) {
@@ -127,10 +135,13 @@
       right = `<span class="gr-quiet">No tasks yet</span>`;
     }
     const metaHtml = `#${escapeHtml(String(g.id))} · ${escapeHtml(g.version_id || '')}${(achieved || g.status === 'open') ? '' : ' · ' + escapeHtml(g.status)}${goalStampHtml(g)}`;
-    return { r, achieved, ringHtml, goalHref, right, metaHtml };
+    // task 1003276 — the category chip. Computed here with the rest of the facts
+    // so the row and the card (task 1003136) cannot drift on it.
+    const catHtml = categoryChip(g.category);
+    return { r, achieved, ringHtml, goalHref, right, metaHtml, catHtml };
   }
   function goalRowHtml(g) {
-    const { r, achieved, ringHtml, goalHref, right, metaHtml } = goalRenderFacts(g, 44);
+    const { r, achieved, ringHtml, goalHref, right, metaHtml, catHtml } = goalRenderFacts(g, 44);
     // NOTE: a rollup row nests real links (title → goal, Claim → task overlay,
     // drill → goal), so the row itself is a <div>, not an <a> — nested anchors
     // are invalid. Only the explicit links navigate.
@@ -138,20 +149,20 @@
       <div class="gr-ringcol">${ringHtml}</div>
       <div class="gr-main">
         <a class="gr-title" href="${goalHref}"${subtitleAttr(g)}>${escapeHtml(g.title || 'Untitled goal')}</a>
-        <div class="gr-meta">${metaHtml}</div>
+        <div class="gr-meta">${metaHtml}${catHtml}</div>
         ${achieved ? '' : goalRollLine(r)}
       </div>
       <div class="gr-right">${right}</div>
     </div>`;
   }
   function goalCardHtml(g) {
-    const { r, achieved, ringHtml, goalHref, right, metaHtml } = goalRenderFacts(g, 36);
+    const { r, achieved, ringHtml, goalHref, right, metaHtml, catHtml } = goalRenderFacts(g, 36);
     return `<div class="goal-card" data-goal-id="${escapeHtml(String(g.id))}">
       <div class="goal-card__head">
         <div class="gr-ringcol">${ringHtml}</div>
         <a class="goal-card__title gr-title" href="${goalHref}"${subtitleAttr(g)}>${escapeHtml(g.title || 'Untitled goal')}</a>
       </div>
-      <div class="goal-card__meta">${metaHtml}</div>
+      <div class="goal-card__meta">${metaHtml}${catHtml}</div>
       ${achieved ? '' : goalRollLine(r)}
       <div class="goal-card__foot">${right}</div>
     </div>`;
@@ -709,7 +720,10 @@
       // still never re-derives the protected roster.
       const gateSpan = g.scope_protected
         ? '<span class="goal-badge goal-badge--locked" title="Protected module scope — join by request; an Archon admits members">🛡 Archon-mediated</span>' : '';
-      meta.innerHTML = `<span>${escapeHtml(g.version_id || '')}</span> ${statusBadge(g.status)} ${lockSpan} ${gateSpan} ${scope} ${depsSpan}`;
+      // task 1003276 — the human category, beside the machine-readable module
+      // scope so the difference is visible: `scope` is the wall that refuses work
+      // (ADR 0086); the chip is a word for a person and gates nothing (ADR 0192).
+      meta.innerHTML = `<span>${escapeHtml(g.version_id || '')}</span> ${statusBadge(g.status)} ${categoryChip(g.category)} ${lockSpan} ${gateSpan} ${scope} ${depsSpan}`;
     }
 
     // task 1762: the goal's own owner/manager (or an Archon) can invite/manage

package/modules/hall-ui/public/style.css

@@ -2172,3 +2172,12 @@ html.palette-open { overflow: hidden; }
   .palette__panel { margin-top: 6vh; }
   .palette__group { min-width: 56px; }
 }
+/* task 1003276 — the human CATEGORY chip. Quiet by design: it sits beside the
+   meta line, not above the title, because it is a label a person scans, never a
+   status or a permission (ADR 0192). No hover/pointer affordance and no href —
+   a per-category destination would be a navigation tier, which is exactly the
+   second hierarchy this feature must not become. On a TASK the chip is the one
+   inherited from its goal, and says so, so nobody hunts for a per-task editor. */
+.gr-cat { display: inline-flex; align-items: baseline; gap: 5px; margin-left: 8px; padding: 1px 8px; border: 1px solid var(--rule-soft); border-radius: 999px; font-size: 11px; font-weight: 600; letter-spacing: .01em; color: var(--ink-soft); background: var(--surface-2); vertical-align: baseline; white-space: nowrap; }
+.gr-cat--inherited { font-weight: 550; color: var(--ink-faint); }
+.gr-cat__from { font-style: normal; font-weight: 500; font-size: 10px; color: var(--ink-faint); opacity: .85; }

package/modules/hall-ui/public/task.js

@@ -193,7 +193,7 @@
       `Task description:\n${desc}`;
   }
 
-  function renderTask(t, lastClaim, viewer) {
+  function renderTask(t, lastClaim, viewer, goal) {
     document.title = `#${t.id} — ${t.title || 'Task'} — ${document.title.split(' — ').pop()}`;
     const sub = $('#task-sub');
     if (sub) sub.textContent = `Task #${t.id}`;
@@ -222,7 +222,14 @@
     }
 
     if (t.goal_id) {
-      parts.push(`<p class="td-goal">Goal: <a href="/goals#/goal/${encodeURIComponent(t.goal_id)}">Goal #${escapeHtml(String(t.goal_id))}</a></p>`);
+      // task 1003276 — the goal line names the goal and carries the category this
+      // task INHERITS from it. Two legibility fixes in one line: the link used to
+      // read "Goal #1000072", which tells a person nothing they didn't already
+      // know, and the chip answers "what kind of work is this" without opening
+      // the goal. Marked inherited because a task carries no category of its own.
+      const goalName = goal && goal.title ? ` — ${escapeHtml(goal.title)}` : '';
+      const catChip = window.OTB.categoryChip(goal && goal.category, { inherited: true });
+      parts.push(`<p class="td-goal">Goal: <a href="/goals#/goal/${encodeURIComponent(t.goal_id)}">Goal #${escapeHtml(String(t.goal_id))}</a>${goalName}${catChip}</p>`);
     }
 
     // Claim history (task 751 — best-effort: the API surfaces the most recent
@@ -356,7 +363,17 @@
         const me = await getJSON(`${API}/me`, { softAuth: true });
         viewer = (me && me.builder) ? me.builder : null;
       } catch (_) { /* cosmetic — the server enforces regardless */ }
-      renderTask(d.task, d.last_claim || null, viewer);
+      // task 1003276 — the task's goal, for its name and the category the task
+      // inherits. Best-effort and non-blocking on failure: the page has always
+      // rendered without it, and a category is a nicety, never a prerequisite.
+      let goal = null;
+      if (d.task.goal_id != null) {
+        try {
+          const g = await getJSON(`${API}/goals/${encodeURIComponent(d.task.goal_id)}`, { softAuth: true });
+          goal = (g && g.goal) ? g.goal : null;
+        } catch (_) { /* cosmetic — the goal link still resolves without it */ }
+      }
+      renderTask(d.task, d.last_claim || null, viewer, goal);
     } catch (err) {
       if (err && err.code === AUTH_NEEDED) { toAuth(); return; }
       if (err && err.status === 404) { renderNotFound(id); return; }

package/modules/hall-ui/public/work.js

@@ -337,6 +337,12 @@
       // task 1002955: how old is this task? A ready queue reads as equally fresh
       // without it; the exact date rides the tooltip.
       const ageChip = window.OTBKit.ageChipHtml(t.created_at);
+      // task 1003276 — the category this task inherits from its goal, marked as
+      // inherited so nobody looks for a per-task editor that does not exist. It
+      // is a label only: it never filters or orders this board, because nothing
+      // a person may not act on should decide what the queue offers (ADR 0192).
+      const catChip = window.OTB.categoryChip(
+        (taskState.goalCategories || {})[String(t.goal_id)], { inherited: true });
       const selected = selection.claim.has(String(t.id));
       return `
         <div class="task${selected ? ' task--selected' : ''}" data-task-id="${t.id}">
@@ -358,6 +364,7 @@
               <span>${cpmText}</span>
               ${touchesChip}
               ${ageChip}
+              ${catChip}
             </div>
           </div>
           <div class="task__credits">
@@ -1071,9 +1078,17 @@
 
     // task 1755: goal id → title map for the Goal filter (best-effort).
     taskState.goalTitles = {};
+    // task 1003276 — a task INHERITS its goal's category (it stores none of its
+    // own), so the board resolves the label the same way the schema does: through
+    // goal_id. The goals fetch below is already made for the titles, so the chip
+    // costs no extra request and no server change.
+    taskState.goalCategories = {};
     try {
       const gr = await getJSON(`${API}/goals`);
-      (gr.goals || []).forEach((g) => { taskState.goalTitles[g.id] = g.title; });
+      (gr.goals || []).forEach((g) => {
+        taskState.goalTitles[g.id] = g.title;
+        taskState.goalCategories[g.id] = g.category || null;
+      });
     } catch (_) { /* filter labels fall back to 'Goal #id' */ }
 
     // Claimable + active claims in one call. A 403 means the primer gate — show

package/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@bongos/core",
-  "version": "1.19.371",
+  "version": "1.19.372",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@bongos/core",
-      "version": "1.19.371",
+      "version": "1.19.372",
       "license": "AGPL-3.0-or-later",
       "dependencies": {
         "express": "^4.21.2",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bongos/core",
-  "version": "1.19.371",
+  "version": "1.19.372",
   "description": "Cloud Bongos — the AI-first build platform core (GDS + platform surfaces + module system), installed as a versioned dependency (ADR 0108).",
   "license": "AGPL-3.0-or-later",
   "main": "src/platform-server.js",

package/src/module-api.js

@@ -1172,8 +1172,10 @@ const { validateOrRespond, LIMITS, parseId, asyncHandler, corsPublicGet, parsePa
 //         landed since 1.19.369 with no explicit bump. run 32904231221. (task 1002620)
 //   1.19.371 — CI auto-patch (publish-on-merge, ADR 0161): carrier for merges
 //         landed since 1.19.370 with no explicit bump. run 32904582252. (task 1002620)
+//   1.19.372 — CI auto-patch (publish-on-merge, ADR 0161): carrier for merges
+//         landed since 1.19.371 with no explicit bump. run 32905166786. (task 1002620)
 // ---------------------------------------------------------------------------
-const CORE_VERSION = '1.19.371'; // CI auto-patch carrier (ADR 0161); see changelog above
+const CORE_VERSION = '1.19.372'; // CI auto-patch carrier (ADR 0161); see changelog above
 
 // A namespaced logger so a module's log lines are attributable + consistent.
 // Usage: const log = api.logger('dev-box'); log.info('mounted');

package/tests/goal_category_ui.mjs

@@ -0,0 +1,279 @@
+// tests/goal_category_ui.mjs — the hall shows a goal's category and filters by
+// it, and a task shows the one it inherits (task 1003276, goal 1000072,
+// criterion legibility-categories).
+//
+// This EXECUTES the real goals page in a vm under a minimal DOM/kit stub (the
+// tests/goal_criterion_confirm_ui.mjs precedent — there is no jsdom here), boots
+// it against a fake API serving a categorised goal and an uncategorised one, and
+// asserts on the HTML it actually writes and on what the Category control
+// actually narrows. Source pins are used only for the two properties a harness
+// cannot hold: that the chip is not a navigation destination, and that the other
+// two surfaces render it through the SAME shared helper.
+//
+// Run:  node tests/goal_category_ui.mjs
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import path from 'node:path';
+import vm from 'node:vm';
+import { fileURLToPath } from 'node:url';
+import { makeRunner } from './helpers.mjs';
+
+const ROOT = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
+const read = (rel) => fs.readFileSync(path.join(ROOT, rel), 'utf8');
+const SRC = read('modules/hall-ui/public/goals-page.js');
+const TASK_LIB_SRC = read('modules/hall-ui/public/task-lib.js');
+const GOALS_LIB_SRC = read('modules/hall-ui/public/goals-lib.js');
+const GOALS_RENDER_SRC = read('modules/hall-ui/public/goals-render.js');
+const DOM_UTILS_SRC = read('modules/hall-ui/public/dom-utils.js');
+const WORK_SRC = read('modules/hall-ui/public/work.js');
+const TASK_PAGE_SRC = read('modules/hall-ui/public/task.js');
+const STYLE_CSS = read('modules/hall-ui/public/style.css');
+
+const { test, summary } = makeRunner();
+
+const SECURITY = { id: '3', slug: 'security', label: 'Security' };
+const ECONOMICS = { id: '6', slug: 'economics', label: 'Economics' };
+const CATEGORIES = [
+  { id: 3, slug: 'security', label: 'Security', sort_order: 50, active: true },
+  { id: 6, slug: 'economics', label: 'Economics', sort_order: 60, active: true },
+];
+
+const GOALS = [
+  { id: 7, version_id: 'V1', title: 'The walls hold', status: 'open', visibility: 'public', created_by: 9, scope_modules: [], category_id: '3', category: SECURITY },
+  { id: 8, version_id: 'V1', title: 'What a credit means', status: 'open', visibility: 'public', created_by: 9, scope_modules: [], category_id: '6', category: ECONOMICS },
+  { id: 9, version_id: 'V1', title: 'Nobody has placed this yet', status: 'open', visibility: 'public', created_by: 9, scope_modules: [], category_id: null, category: null },
+];
+
+// Boot goals-page.js on the LIST view and hand back the rendered grid plus a
+// handle on the filter bar's onChange, so a filter can actually be exercised
+// rather than asserted about.
+async function renderList() {
+  const calls = { requests: [], appended: [] };
+  const els = new Map();
+  // The page builds TWO filter bars (the goal list, and the goal-detail To-do
+  // list). Keep both and pick by the control we care about, or this harness
+  // silently tests the wrong one.
+  const bars = [];
+
+  const makeEl = (key) => ({
+    _key: key, dataset: {}, style: {}, title: '', textContent: '', hidden: false, disabled: false, value: '',
+    innerHTML: '',
+    classList: { add() {}, remove() {}, toggle() { return false; }, contains() { return false; } },
+    setAttribute() {}, getAttribute() { return null; }, removeAttribute() {},
+    appendChild(child) { calls.appended.push({ into: key, value: child.value, text: child.textContent }); },
+    focus() {}, click() {}, querySelectorAll() { return []; }, addEventListener() {},
+  });
+  const $ = (sel) => {
+    if (!sel) return null;
+    if (!els.has(sel)) els.set(sel, makeEl(sel));
+    return els.get(sel);
+  };
+
+  const api = {
+    request(method, p) {
+      calls.requests.push([method, p]);
+      const reply = (data) => Promise.resolve({ status: 200, ok: true, data });
+      if (method === 'GET' && /\/me$/.test(p)) return reply({ builder: { id: 1, rank: 'archon' }, active_claims: [] });
+      if (method === 'GET' && /\/goals$/.test(p)) return reply({ goals: GOALS });
+      if (method === 'GET' && /\/work-categories$/.test(p)) return reply({ categories: CATEGORIES });
+      if (method === 'GET' && /\/goals\/\d+$/.test(p)) {
+        const id = Number(p.match(/(\d+)$/)[1]);
+        return reply({ goal: GOALS.find((g) => Number(g.id) === id), members: [], criteria: [], dependencies: [] });
+      }
+      if (method === 'GET' && /\/tasks\?/.test(p)) return reply({ tasks: [] });
+      return reply({});
+    },
+  };
+
+  const windowObj = {
+    OTB: null, // filled by dom-utils.js, run for real below
+    OTBKit: {
+      makePager: (prefix) => ({ prefix, page: 1, perPage: 25 }),
+      paginate: (rows) => rows,
+      wirePager() {}, pagerBarHtml: () => '',
+      makeTabs: () => ({ setCount() {}, select() {}, activate() {} }),
+      makeFilterBar(spec) { bars.push(spec); },
+      emptyStateHtml: (m) => `<div class="kit-empty">${m}</div>`,
+      skeletonRows: () => '', ageChipHtml: () => '',
+    },
+    OTBBranding: { currencyLabel: () => 'credits', taskSettled: () => false, taskCreditValue: () => 0 },
+    BongosClient: { createClient: () => api },
+    location: { hash: '', pathname: '/builders/goals', assign() {} },
+    addEventListener() {}, scrollTo() {},
+    matchMedia: () => ({ matches: false, addEventListener() {} }),
+    localStorage: { getItem() { return null; }, setItem() {} },
+  };
+  const documentObj = {
+    body: { dataset: {} },
+    documentElement: { dataset: {}, style: {}, classList: { add() {}, remove() {}, toggle() { return false; }, contains() { return false; } } },
+    getElementById: (id) => $(`#${id}`),
+    querySelector: (sel) => $(sel),
+    querySelectorAll: () => [],
+    createElement: () => makeEl('created'),
+    addEventListener() {},
+  };
+
+  const sandbox = { window: windowObj, document: documentObj, location: windowObj.location, console, setTimeout, clearTimeout, Set, Map, Number, String, Array, Object, JSON, Math, Date, encodeURIComponent, Promise, RegExp };
+  sandbox.globalThis = sandbox;
+  vm.createContext(sandbox);
+  vm.runInContext(DOM_UTILS_SRC, sandbox, { filename: 'dom-utils.js' });
+  // dom-utils builds its own $ over document; the harness's element map is what
+  // the page must actually read, so point OTB.$ at it (the confirm-UI precedent).
+  windowObj.OTB.$ = $;
+  windowObj.OTB.fmtDate = () => '';
+  windowObj.OTB.toast = () => {};
+  vm.runInContext(TASK_LIB_SRC, sandbox, { filename: 'task-lib.js' });
+  vm.runInContext(GOALS_LIB_SRC, sandbox, { filename: 'goals-lib.js' });
+  vm.runInContext(GOALS_RENDER_SRC, sandbox, { filename: 'goals-render.js' });
+  vm.runInContext(SRC, sandbox, { filename: 'goals-page.js' });
+  for (let i = 0; i < 30; i++) await new Promise((r) => setTimeout(r, 0));
+
+  const controlIds = (spec) => [...(spec.primary || []), ...(spec.overflow || [])].map((c) => c.id);
+  const listBar = bars.find((b) => controlIds(b).includes('f-goal-version'));
+  assert.ok(listBar, `the goal-LIST filter bar must exist — saw ${JSON.stringify(bars.map(controlIds))}`);
+
+  const setFilter = async (id, value) => {
+    $(id).value = value;
+    assert.ok(listBar.onChange, 'the list filter bar must declare an onChange');
+    listBar.onChange();
+    for (let i = 0; i < 10; i++) await new Promise((r) => setTimeout(r, 0));
+    return $('#goal-grid').innerHTML;
+  };
+
+  return { calls, bars, listBar, controlIds, grid: () => $('#goal-grid').innerHTML, setFilter, categoryChip: windowObj.OTB.categoryChip };
+}
+
+// =========================================================================
+// The chip
+// =========================================================================
+
+await test('a categorised goal renders its category; an uncategorised one renders no chip', async () => {
+  const { grid } = await renderList();
+  const html = grid();
+  assert.match(html, /gr-cat[^>]*>Security/, 'the Security goal wears its label');
+  assert.match(html, /gr-cat[^>]*>Economics/, 'and so does the Economics one');
+  const chips = html.match(/class="gr-cat/g) || [];
+  assert.equal(chips.length, 2, `two of three goals are categorised — got ${chips.length} chips`);
+  assert.equal(/Uncategorised|Not categorised/i.test(html), false,
+    'an uncategorised goal shows NOTHING, not a grey placeholder pill — most goals will carry one, and a board of placeholders reads worse than a board with gaps');
+});
+
+await test('the same chip renders in the card view, from the same facts', async () => {
+  const { setFilter } = await renderList();
+  const html = await setFilter('#f-goal-view', 'cards');
+  assert.match(html, /goal-card/, 'the card view is what rendered');
+  assert.match(html, /gr-cat[^>]*>Security/, 'and it carries the category too');
+});
+
+// =========================================================================
+// The filter — the half the criterion actually asks for
+// =========================================================================
+
+await test('the Category control is declared on the kit filter bar (no bespoke markup)', async () => {
+  const { listBar, controlIds } = await renderList();
+  const ids = controlIds(listBar);
+  assert.ok(ids.includes('f-goal-category'), `Category must be a kit control — got ${JSON.stringify(ids)}`);
+});
+
+await test('the options come from the project SET, not from the goals on screen', async () => {
+  // "Present in every builders hall on any project" only holds if the vocabulary
+  // travels over the wire. A category nobody has used yet must still be offered.
+  const { calls, appended } = await renderList().then((r) => ({ calls: r.calls, appended: r.calls.appended }));
+  assert.ok(calls.requests.some(([m, p]) => m === 'GET' && /\/work-categories$/.test(p)),
+    'the page must READ the set rather than derive it from state.goals');
+  const into = appended.filter((a) => a.into === '#f-goal-category');
+  assert.deepEqual(into.map((a) => a.value), ['security', 'economics', 'none'],
+    'every category in the set, plus the uncategorised bucket');
+});
+
+await test('choosing a category narrows the board to it', async () => {
+  const { setFilter } = await renderList();
+  const html = await setFilter('#f-goal-category', 'security');
+  assert.match(html, /The walls hold/);
+  assert.equal(/What a credit means/.test(html), false, 'the Economics goal is filtered out');
+  assert.equal(/Nobody has placed this yet/.test(html), false, 'so is the uncategorised one');
+});
+
+await test('"not categorised yet" finds exactly the goals nobody has placed', async () => {
+  // This option is the point of the whole feature: it is the queue of goals the
+  // human still has to name a category for.
+  const { setFilter } = await renderList();
+  const html = await setFilter('#f-goal-category', 'none');
+  assert.match(html, /Nobody has placed this yet/);
+  assert.equal(/The walls hold/.test(html), false);
+});
+
+await test('the filter matches on the SLUG, so re-wording a label cannot break it', async () => {
+  await renderList();
+  const src = GOALS_RENDER_SRC.slice(GOALS_RENDER_SRC.indexOf('function filteredGoals'));
+  assert.match(src.slice(0, 1600), /category\?\.slug === cat/,
+    'match on slug (the stable key), never on the human label');
+});
+
+// =========================================================================
+// The rule: a chip is a label, not a destination
+// =========================================================================
+
+await test('the chip is NOT a link — a per-category page would be a navigation tier', async () => {
+  const { grid } = await renderList();
+  const html = grid();
+  const chip = html.slice(html.indexOf('class="gr-cat'), html.indexOf('class="gr-cat') + 200);
+  assert.equal(/<a\b/.test(chip), false, 'no anchor');
+  assert.equal(/href=/.test(chip), false, 'no href');
+  // And nothing in the CSS gives it a click affordance.
+  const rule = STYLE_CSS.slice(STYLE_CSS.indexOf('.gr-cat {'), STYLE_CSS.indexOf('.gr-cat {') + 400);
+  assert.equal(/cursor:\s*pointer/.test(rule), false,
+    'no pointer cursor — the chip must not even LOOK like a destination (ADR 0192)');
+});
+
+// =========================================================================
+// Inheritance: the task surfaces
+// =========================================================================
+
+await test('categoryChip marks an inherited chip and says where it came from', async () => {
+  const { categoryChip } = await renderList();
+  const own = categoryChip(SECURITY);
+  const inherited = categoryChip(SECURITY, { inherited: true });
+  assert.equal(/gr-cat--inherited/.test(own), false);
+  assert.match(inherited, /gr-cat--inherited/);
+  assert.match(inherited, /via goal/, 'a reader must not go hunting for a per-task editor');
+  assert.match(inherited, /inherited from this task&#39;s goal/, 'and the tooltip says so in full (escaped — it lands in an attribute)');
+  assert.equal(categoryChip(null), '', 'no category, no chip');
+  assert.equal(categoryChip({ label: '   ' }), '', 'a blank label is no label');
+});
+
+await test('categoryChip escapes what it renders', async () => {
+  const { categoryChip } = await renderList();
+  const html = categoryChip({ id: '1', slug: 'x', label: '<img src=x onerror=alert(1)>' });
+  assert.equal(/<img/.test(html), false);
+  assert.match(html, /&lt;img/);
+});
+
+await test('the Tasks board resolves a task\'s category THROUGH its goal', async () => {
+  // Inheritance is literal in the schema (no tasks.category column), so the board
+  // resolves it the same way — through goal_id, from the goals it already loads.
+  assert.match(WORK_SRC, /taskState\.goalCategories\[g\.id\] = g\.category \|\| null;/,
+    'the category rides along with the goal title the board already fetches');
+  assert.match(WORK_SRC, /categoryChip\(\s*\(taskState\.goalCategories \|\| \{\}\)\[String\(t\.goal_id\)\], \{ inherited: true \}\)/,
+    'and renders through the shared helper, marked inherited');
+  assert.equal(/taskState\.goalCategories.*filter|f-category/.test(WORK_SRC), false,
+    'the board must NOT filter or order on a category — nothing a person may not act on should decide what the queue offers');
+});
+
+await test('the task page names its goal and shows the inherited category', async () => {
+  assert.match(TASK_PAGE_SRC, /categoryChip\(goal && goal\.category, \{ inherited: true \}\)/);
+  assert.match(TASK_PAGE_SRC, /const goalName = goal && goal\.title/,
+    'the goal link used to read "Goal #1000072", which tells a person nothing');
+});
+
+await test('one renderer serves all three surfaces, so they cannot drift', () => {
+  // The chip lives in dom-utils.js because that is the only script the Goals
+  // page, the Tasks board and the task page all load.
+  assert.match(DOM_UTILS_SRC, /function categoryChip\(/);
+  for (const [name, src] of [['goals-render', GOALS_RENDER_SRC], ['work', WORK_SRC], ['task page', TASK_PAGE_SRC]]) {
+    assert.match(src, /categoryChip\(/, `${name} must render through the shared helper`);
+    assert.equal(/function categoryChip\(/.test(src), false, `${name} must not hold its own copy`);
+  }
+});
+
+summary();

package/tests/goal_criterion_confirm_ui.mjs

@@ -108,6 +108,12 @@ async function render({ rank = 'metic', goalStatus = 'open', criteria = Object.v
       escapeHtml: (s) => String(s == null ? '' : s).replace(/[&<>"']/g, (ch) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[ch])),
       $, fmtNum: (n) => String(n), fmtDate: () => '', rankLabel: (r) => r,
       toast: (m) => calls.toasts.push(m),
+      // task 1003276 — the goal detail head renders the category chip through
+      // this shared helper. Stubbed to '' because the chip is not this test's
+      // subject (tests/goal_category_ui.mjs runs the real one); it must be
+      // PRESENT, though — an undefined helper throws mid-render and takes the
+      // whole detail view down, which is how this stub first failed.
+      categoryChip: () => '',
     },
     OTBKit: {
       makePager: (prefix) => pager(prefix),