@bongos/core 1.20.10 → 1.20.11

package/modules/hall-ui/public/settings-specialities.js

@@ -26,7 +26,9 @@
 
   // `walk` is the skills walkthrough in progress, or null (task 1004073):
   // { id, data, step, decisions, saving }. See walkHtml below.
-  const state = { rows: [], suggestions: [], openId: null, busy: false, walk: null };
+  // `offerId` / `offerChoices`: the owner's "what it offers" editor that is open,
+  // and its rendered choices once the instance's skills have loaded (task 1004404).
+  const state = { rows: [], suggestions: [], openId: null, busy: false, walk: null, offerId: null, offerChoices: null };
 
   const el = (id) => document.getElementById(id);
   const statusLine = (msg) => { const s = el('specialities-status'); if (s) s.textContent = msg || ''; };
@@ -211,12 +213,112 @@
     focusWalk();
   }
 
+  // ── WHAT A SPECIALITY OFFERS (task 1004404; ADR 0310 §1) ──────────────────
+  //
+  // The OWNER's half: which of this instance's skills the speciality puts on
+  // its menu. Until this, only the API could set it, so nothing made in the hall
+  // offered anything and the walkthrough above never appeared. Each choice shows
+  // the skill's plain description — the same words the walkthrough will show the
+  // people who adopt it — so the owner is choosing what to teach, not ticking
+  // names. Offering turns nothing on for anyone: every adopter still starts with
+  // all of them off and decides one at a time.
+  //
+  // The choices come from GET /specialities/installed-skills, so only skills
+  // this instance has are offered; the server's unknown_skill check on POST/PATCH
+  // stays the rule for anything a stale page sends.
+
+  let installedList = null; // fetched once per page, on first need
+  async function installedSkillList() {
+    if (!installedList) {
+      const data = await call('GET', '/specialities/installed-skills');
+      installedList = (data && data.skills) || [];
+    }
+    return installedList;
+  }
+
+  function offerChoicesHtml(all, chosen) {
+    const picked = new Set(chosen || []);
+    const gone = (chosen || []).filter((n) => !all.some((k) => k.name === n));
+    return `
+      <p class="prow__hint">
+        Offering a skill turns nothing on. Everyone who uses this speciality is shown
+        each one and chooses for themselves — all start off.
+      </p>
+      <label class="speciality-field">
+        <span>Find a skill</span>
+        <input type="search" class="speciality-offer__filter" placeholder="Type to narrow the list" />
+      </label>
+      <ul class="speciality-offer__list">
+        ${all.map((k) => `
+          <li data-find="${escapeHtml(`${k.name} ${k.does || ''}`.toLowerCase())}">
+            <label class="speciality-field speciality-field--check">
+              <input type="checkbox" name="skill" value="${escapeHtml(k.name)}" ${picked.has(k.name) ? 'checked' : ''} />
+              <span>
+                <strong>${escapeHtml(k.name)}</strong> — ${escapeHtml(k.does || 'Its author gave no description.')}
+                <small>${escapeHtml(k.cost || '')}</small>
+              </span>
+            </label>
+          </li>`).join('')}
+      </ul>
+      ${gone.length ? `<p class="prow__hint">No longer on this project, so saving drops it from the offer: ${gone.map((n) => `<code>${escapeHtml(n)}</code>`).join(', ')}.</p>` : ''}`;
+  }
+
+  const chosenSkills = (form) => [...form.querySelectorAll('input[name="skill"]:checked')].map((i) => i.value);
+
+  function narrowOffer(input) {
+    const q = input.value.trim().toLowerCase();
+    const list = input.closest('form') && input.closest('form').querySelector('.speciality-offer__list');
+    if (!list) return;
+    for (const li of list.children) li.hidden = q !== '' && !String(li.dataset.find || '').includes(q);
+  }
+
+  function offerFormHtml(s) {
+    return `
+      <form class="speciality-offer" data-id="${escapeHtml(String(s.id))}">
+        <h4 class="speciality-create__h">What ${escapeHtml(s.name)} offers</h4>
+        <div class="speciality-offer__choices">${state.offerChoices || '<p class="prow__hint">Loading this project’s skills…</p>'}</div>
+        <div class="speciality-actions">
+          <button type="submit" class="btn" ${state.offerChoices ? '' : 'disabled'}>Save what it offers</button>
+        </div>
+      </form>`;
+  }
+
+  async function openOffer(id) {
+    if (String(state.offerId) === String(id)) { state.offerId = null; render(); return; }
+    state.offerId = String(id);
+    state.offerChoices = null;
+    state.openId = null;
+    state.walk = null;
+    render();
+    try {
+      const all = await installedSkillList();
+      const row = state.rows.find((r) => String(r.id) === String(id));
+      if (state.offerId !== String(id) || !row) return;
+      state.offerChoices = offerChoicesHtml(all, row.skills || []);
+      render();
+    } catch (err) { statusLine(`Could not load this project’s skills — ${err.message}`); }
+  }
+
+  // The create form's picker fills the first time it is opened, so a builder
+  // who never offers a skill never pays for the list.
+  async function fillCreateOffer(host) {
+    if (host.dataset.filled) return;
+    host.dataset.filled = '1';
+    try {
+      host.innerHTML = offerChoicesHtml(await installedSkillList(), []);
+    } catch (err) {
+      delete host.dataset.filled;
+      host.innerHTML = `<p class="prow__hint">Could not load this project’s skills — ${escapeHtml(err.message)}</p>`;
+    }
+  }
+
   function cardHtml(s) {
     const trained = Number(s.documentCount || 0);
     const learned = Number(s.learningCount || 0);
     const open = String(state.openId) === String(s.id);
     const offered = Array.isArray(s.skills) ? s.skills.length : 0;
     const walking = state.walk && state.walk.id === String(s.id);
+    const offering = s.mine && String(state.offerId) === String(s.id);
     return `
       <li class="prow speciality-card" data-id="${escapeHtml(String(s.id))}">
         <div class="prow__main">
@@ -237,11 +339,13 @@
         <div class="prow__actions">
           ${s.active && offered && !walking ? `<button type="button" class="btn btn--quiet" data-act="walk" data-id="${escapeHtml(String(s.id))}">Choose its skills</button>` : ''}
           ${s.mine ? `<button type="button" class="btn btn--quiet" data-act="train" data-id="${escapeHtml(String(s.id))}">${open ? 'Close' : 'Train'}</button>` : ''}
+          ${s.mine ? `<button type="button" class="btn btn--quiet" data-act="offer" data-id="${escapeHtml(String(s.id))}" aria-expanded="${offering}">${offering ? 'Close' : 'Offered skills'}</button>` : ''}
           ${s.active
             ? `<button type="button" class="btn btn--quiet" data-act="abandon" data-id="${escapeHtml(String(s.id))}">Stop using</button>`
             : `<button type="button" class="btn" data-act="adopt" data-id="${escapeHtml(String(s.id))}" ${s.adoptable ? '' : 'disabled'}>Use this</button>`}
         </div>
         ${open ? trainHtml(s) : ''}
+        ${offering ? offerFormHtml(s) : ''}
         ${walking ? walkHtml() : ''}
       </li>`;
   }
@@ -388,11 +492,28 @@
         if (!btn) return;
         const { act: action, id } = btn.dataset;
         if (action === 'walk') { openWalk(id); return; }
-        if (action === 'train') { state.openId = String(state.openId) === String(id) ? null : id; state.walk = null; render(); return; }
+        if (action === 'offer') { openOffer(id); return; }
+        if (action === 'train') { state.openId = String(state.openId) === String(id) ? null : id; state.walk = null; state.offerId = null; render(); return; }
         act(action, id);
       });
 
+      host.addEventListener('input', (e) => {
+        if (e.target.matches('.speciality-offer__filter')) narrowOffer(e.target);
+      });
+
       host.addEventListener('submit', async (e) => {
+        const offer = e.target.closest('form.speciality-offer');
+        if (offer) {
+          e.preventDefault();
+          const skills = chosenSkills(offer);
+          try {
+            await call('PATCH', `/specialities/${offer.dataset.id}`, { skills });
+            state.offerId = null;
+            toast(skills.length ? `Saved — it offers ${skills.length} skill${skills.length === 1 ? '' : 's'}.` : 'Saved — it offers no skills.');
+            await load();
+          } catch (err) { statusLine(`Could not save what it offers — ${err.message}`); }
+          return;
+        }
         const form = e.target.closest('form.speciality-train');
         if (!form) return;
         e.preventDefault();
@@ -426,8 +547,10 @@
             contract_md: create.elements.contract_md.value.trim(),
             visibility: create.elements.visibility.value,
             sellable: create.elements.sellable.checked,
+            skills: chosenSkills(create),
           });
           create.reset();
+          for (const li of create.querySelectorAll('.speciality-offer__list > li')) li.hidden = false;
           toast('Speciality created.');
           await load();
         } catch (err) { statusLine(err.message); }
@@ -445,7 +568,21 @@
       };
       vis.addEventListener('change', sync);
       sync();
+
+      // The skills picker (task 1004404): filled on first open, narrowed as you type.
+      const offerBox = el('speciality-create-offer');
+      const offerHost = el('speciality-create-skills');
+      if (offerBox && offerHost) offerBox.addEventListener('toggle', () => { if (offerBox.open) fillCreateOffer(offerHost); });
+      create.addEventListener('input', (e) => {
+        if (e.target.matches('.speciality-offer__filter')) narrowOffer(e.target);
+      });
     }
+
+    // Enter in a "Find a skill" box narrows the list; it must not submit the
+    // form around it half-chosen.
+    document.addEventListener('keydown', (e) => {
+      if (e.key === 'Enter' && e.target && e.target.matches && e.target.matches('.speciality-offer__filter')) e.preventDefault();
+    });
   }
 
   function boot() {

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

@@ -199,6 +199,32 @@ select.voices__select { min-width: 140px; }
 .speciality-field--check { flex-direction: row; align-items: flex-start; gap: 0.5rem; }
 .speciality-field--check input { margin-top: 0.2rem; }
 .speciality-actions { display: flex; gap: 0.5rem; }
+/* What a speciality OFFERS (task 1004404): the owner's pick-list of this
+   instance's skills, each with its plain line. Sixty-odd rows, so the list
+   scrolls inside its own box rather than pushing the form's buttons off-screen;
+   the reading lines keep the measure. */
+.speciality-field input[type='search'] { width: 100%; box-sizing: border-box; }
+.speciality-offer,
+.speciality-offer-box { flex-basis: 100%; display: flex; flex-direction: column; gap: 0.6rem; }
+.speciality-offer { margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--rule); }
+.speciality-offer > *, .speciality-offer-box > * { max-width: var(--measure); }
+.speciality-offer-box > summary { cursor: pointer; font-size: 0.85rem; min-height: 24px; padding-block: 2px; box-sizing: border-box; }
+.speciality-offer-box > summary small { opacity: 0.7; }
+.speciality-offer__choices, #speciality-create-skills { display: flex; flex-direction: column; gap: 0.6rem; }
+.speciality-offer__list {
+  list-style: none;
+  margin: 0;
+  padding: 0 0.25rem 0 0;
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  max-height: 24rem;
+  overflow-y: auto;
+  overflow-x: hidden;
+}
+.speciality-offer__list li[hidden] { display: none; }
+.speciality-offer__list strong { font-family: var(--font-mono); font-weight: 600; }
+.speciality-offer__list .speciality-field--check > span { font-size: 0.85rem; line-height: 1.45; }
 /* The adopted contract, shown in full before "Use this" — another builder's prose
    reaching your sessions is the one thing here that must never be folded away. */
 .speciality-contract { flex-basis: 100%; margin-top: 0.5rem; font-size: 0.85rem; }

package/modules/hall-ui/public/settings.html

@@ -259,6 +259,10 @@
                     <small>Records your decision only — there is no marketplace yet, and nothing is listed anywhere.</small>
                   </span>
                 </label>
+                <details id="speciality-create-offer" class="speciality-offer-box">
+                  <summary>Skills it offers <small>(optional)</small></summary>
+                  <div id="speciality-create-skills"><p class="prow__hint">Loading this project’s skills…</p></div>
+                </details>
                 <div class="speciality-actions">
                   <button type="submit" class="btn">Create speciality</button>
                 </div>

package/modules/hall-ui/public/settings.states.json

@@ -11,6 +11,7 @@
     "access": { "auth": true, "url": "/settings#access", "actions": [["wait", 900]], "expect": { "visible": ["#cli-reissue-btn", "#sessions-list", "#artkey-card"] } },
     "preferences": { "auth": true, "url": "/settings#preferences", "actions": [["wait", 900]], "expect": { "visible": ["#wander-rows", "#render-rows", "#specialities-rows"] } },
     "skills-walkthrough": { "auth": true, "url": "/settings#preferences", "actions": [["wait", 900], ["click", "#specialities-rows button[data-act=\"adopt\"]"], ["wait", 700]], "expect": { "visible": [".skill-walk", ".skill-walk__facts", "button[data-walk=\"on\"]", "button[data-walk=\"off\"]"] } },
+    "offered-skills": { "auth": true, "url": "/settings#preferences", "actions": [["wait", 900], ["click", "#specialities-rows button[data-act=\"offer\"]"], ["wait", 700]], "expect": { "visible": ["form.speciality-offer", ".speciality-offer__list", ".speciality-offer__filter"] } },
     "sound": { "auth": true, "url": "/settings#sound", "actions": [["wait", 900]], "expect": { "visible": ["#voices-table", "#sound-rows", "#event-sound-rows"] } },
     "update": { "auth": true, "url": "/settings#software-update", "actions": [["wait", 1200]], "expect": { "visible": ["#software-update-h", "#su-body", "#su-update", ".su-versions"] } }
   },

package/modules/hall-ui/records/panel-family.md

@@ -28,3 +28,5 @@ Also fixed here, as the board task handed forward: the two sub-24px links on Hom
 - **Kit:** `settings.states.json` `update`, ALL CLEAN at 1440/390/320 × dark/light against the harness with the fixture `software-update.json` (a live reading for 1.19.1033). Tests: `tests/software_update.mjs`.
 
 **Settings: adopting a speciality walks through its skills (task 1004073, ADR 0310 §3)** — the owner ruled an adopted speciality's skills start OFF "and you should walk through what comes with each". So adopting one that offers skills opens `.skill-walk` inside its card: one skill per step (what it does, when to reach for it, what it costs, what it needs, who can run it), "Leave it off" / "Turn it on" at EQUAL weight (plain `.pbtn`, no accent — the default is off, so the page must not lean toward on), Back, then a recap restating each skill in a line, then ONE `PUT` of the whole set. "Finish later" saves nothing. Focus moves to each new step heading. Two things found on the way: the specialities panel shipped `hidden` and nothing ever revealed it, so adoption was unreachable from the hall; and its contract `<summary>` measured 21px once visible (now 24). **Kit:** `settings.states.json` `skills-walkthrough` + `preferences`, ALL CLEAN at 1440/390/320 × dark/light against the harness, with fixtures `specialities*.json` built from the real skills on disk and canned answers for adopt and save. Tests: `tests/speciality_walkthrough_ui.mjs` (runs the real page script).
+
+**Settings: a speciality's owner chooses what it offers (task 1004404, ADR 0310 §1)** — until this only the API could set an offer, so the walkthrough above never appeared for a speciality made in the hall. The create form gains a `<details>` "Skills it offers" picker (filled on first open, so a builder who never offers one never pays for the list), and an owned card gains "Offered skills", an inline `form.speciality-offer` like Train. Both list `GET /specialities/installed-skills` — only what this instance has — each row a checkbox with the skill's plain line and cost, the words adopters will see, under a line saying offering turns nothing on. A "Find a skill" box narrows the sixty-odd rows (Enter never submits), the list scrolls in its own box, an offered skill removed since is named and dropped on save rather than silently kept, and saving is ONE `PATCH { skills }`. **The checkboxes take the shared 24px rule in `panel.css`** (the `.chip-ctl input` / `.craft-pref` block, one selector added) rather than a fourth copy of the `::before` box; without it 128 targets measured 13px. **Kit:** `settings.states.json` `offered-skills` + `preferences`, ALL CLEAN at 1440/390/320 × dark/light, with fixtures `specialities__installed-skills.json` (the real 64 skills, explained) and an owned speciality in `specialities.json`, plus canned POST/PATCH answers. Tests: `tests/speciality_offer_ui.mjs` (runs the real page script).

package/modules/specialities/routes/specialities.js

@@ -285,6 +285,22 @@ module.exports = function buildSpecialitiesRouter() {
     res.json({ suggestions });
   }));
 
+  // GET /specialities/installed-skills — every skill THIS instance has, each
+  // explained the way the adoption walkthrough explains it, so a speciality's
+  // owner can choose what it offers from the hall (task 1004404). The CHOICES
+  // only: the POST/PATCH `skills` check (unknown_skill) is still the rule, so a
+  // stale page that sends a name removed since is refused, not trusted. Nothing
+  // here is per-builder and the list is public knowledge of the install — every
+  // name is already materialised into each checkout's .claude/skills/.
+  // Mounted before '/specialities/:id' would capture it as an id. Read-only;
+  // rank: any builder.
+  router.get('/specialities/installed-skills', api.requireBuilder, asyncHandler('GET /specialities/installed-skills', async (_req, res) => {
+    const skills = [...installedSkills()]
+      .map(([name, entry]) => skillsLib.explainSkill({ name, ...entry }))
+      .sort((a, b) => a.name.localeCompare(b.name));
+    res.json({ skills });
+  }));
+
   router.get('/specialities/:id', api.requireBuilder, asyncHandler('GET /specialities/:id', async (req, res) => {
     const id = parseId(req, res, { code: 'bad_id' });
     if (id === null) return;

package/package-lock.json

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bongos/core",
-  "version": "1.20.10",
+  "version": "1.20.11",
   "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/release-notes.json

@@ -8112,5 +8112,11 @@
       "id": "1004403",
       "text": "When you adopt a speciality, each skill it offers is now explained in plain words: what it does, when you would use it, and what it costs, including which ones spend money. Before, those explanations were guessed from technica"
     }
+  ],
+  "1.20.11": [
+    {
+      "id": "1004404",
+      "text": "You can now choose which skills your speciality offers from Settings, not just through the API. You can do it when you create the speciality or later from its card. Each skill is listed with a plain description and what it cos"
+    }
   ]
 }

package/scripts/hall-preview/server.js

@@ -164,6 +164,10 @@ const CANNED_WRITES = [
   // opens the skills walkthrough and its recap can save in the harness.
   ['POST', /^specialities\/\d+\/adopt$/, 'specialities__9__adopt.post'],
   ['PUT', /^specialities\/\d+\/skills$/, 'specialities__9__skills.put'],
+  // the owner choosing what a speciality offers (task 1004404): on create, and
+  // afterwards from the card's "Offered skills" editor.
+  ['POST', /^specialities$/, 'specialities.post'],
+  ['PATCH', /^specialities\/\d+$/, 'specialities__12.patch'],
 ];
 
 // A DATE THAT ROTS CANNOT DEMO AN AGE SIGNAL (task 1004041). The help-request

package/src/module-api.js

@@ -75,7 +75,7 @@ const { responsibilityFor, ROLE_RESPONSIBILITIES } = require('./role-responsibil
 // MAJOR (see allowBoxScope below): passes the request through untouched.
 function deprecatedNoopMiddleware(_req, _res, next) { next(); }
 
-const CORE_VERSION = '1.20.10'; // CI auto-patch carrier (ADR 0161); changelog: docs/module-api-changelog.md
+const CORE_VERSION = '1.20.11'; // CI auto-patch carrier (ADR 0161); changelog: docs/module-api-changelog.md
 
 // A namespaced logger so a module's log lines are attributable + consistent.
 // Usage: const log = api.logger('discord'); log.info('mounted');

package/tests/speciality_offer_ui.mjs

@@ -0,0 +1,185 @@
+// tests/speciality_offer_ui.mjs — a speciality's OWNER chooses what it offers,
+// from the hall (task 1004404; ADR 0310 §1).
+//
+// Before this only the API could set a speciality's offered skills, so nothing
+// made in the hall offered any and the adoption walkthrough never appeared. These
+// pin that the owner can choose on create AND afterwards, that each choice shows
+// the skill's plain description, that only installed skills are choices, and that
+// a skill removed since is named rather than silently kept.
+//
+// Like tests/speciality_walkthrough_ui.mjs this EXECUTES the real
+// modules/hall-ui/public/settings-specialities.js in a vm under a minimal DOM
+// stub against a fake API, and drives the delegated handlers the page wires.
+//
+// Run:  node tests/speciality_offer_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 SRC = fs.readFileSync(path.join(ROOT, 'modules/hall-ui/public/settings-specialities.js'), 'utf8');
+const HTML = fs.readFileSync(path.join(ROOT, 'modules/hall-ui/public/settings.html'), 'utf8');
+const { test, summary } = makeRunner();
+
+const INSTALLED = [
+  { name: 'builder-cost', does: 'Records money spent on the project.', cost: 'Free. It only adds an entry.' },
+  { name: 'recall', does: 'Searches everything the project already knows.', cost: 'Free, and it changes nothing.' },
+  { name: 'status', does: 'Shows how far along a version is.', cost: 'Free, and it changes nothing.' },
+];
+
+const mine = (over = {}) => ({ id: 12, name: 'Pricing', discipline: 'engineer', summary: '', contract_md: '', visibility: 'private', adoptable: true, mine: true, skills: ['recall', 'retired-skill'], ...over });
+const theirs = (over = {}) => ({ id: 9, name: 'Economics', discipline: 'ideator', summary: '', contract_md: '', visibility: 'public', adoptable: true, mine: false, skills: ['recall'], ...over });
+
+// The checked boxes a form would submit, read off the rendered markup.
+const checkedIn = (html) => [...html.matchAll(/<input type="checkbox" name="skill" value="([^"]+)" checked/g)].map((m) => m[1]);
+const fakeForm = (dataset, values) => ({
+  dataset,
+  querySelectorAll: (sel) => (sel === 'input[name="skill"]:checked' ? values.map((value) => ({ value })) : []),
+});
+
+async function boot({ catalog = [mine(), theirs()] } = {}) {
+  const requests = [];
+  const toasts = [];
+  const els = new Map();
+  const handlers = new Map();
+  const makeEl = (id) => ({
+    id, hidden: id === 'specialities-scroll', innerHTML: '', textContent: '', elements: {}, dataset: {}, open: false,
+    addEventListener(type, fn) { handlers.set(`${id}:${type}`, fn); },
+  });
+  for (const id of ['specialities-scroll', 'specialities-rows', 'speciality-suggestions', 'specialities-status', 'speciality-create', 'speciality-create-offer', 'speciality-create-skills']) els.set(id, makeEl(id));
+  // The create form's fields, as settings.html declares them.
+  const create = els.get('speciality-create');
+  const field = (value) => ({ value, addEventListener() {} });
+  create.elements = { name: field(''), discipline: field(''), summary: field(''), contract_md: field(''), visibility: field('private'), sellable: { checked: false, disabled: false, addEventListener() {} } };
+  create.reset = () => { create.elements.name.value = ''; };
+  create.querySelectorAll = () => [];
+
+  const fetch = async (url, opts = {}) => {
+    const method = opts.method || 'GET';
+    const p = url.replace('/api/bongos', '');
+    requests.push({ method, path: p, body: opts.body ? JSON.parse(opts.body) : undefined });
+    let body = {};
+    if (method === 'GET' && p === '/specialities') body = { specialities: catalog };
+    else if (method === 'GET' && p === '/me/specialities') body = { adoptions: [] };
+    else if (method === 'GET' && p === '/specialities/offered') body = { suggestions: [] };
+    else if (method === 'GET' && p === '/specialities/installed-skills') body = { skills: INSTALLED };
+    else if (method === 'PATCH') body = { speciality: { id: 12 } };
+    else if (method === 'POST' && p === '/specialities') body = { speciality: { id: 13 } };
+    return { ok: true, status: 200, json: async () => body };
+  };
+
+  const document = { readyState: 'complete', getElementById: (id) => els.get(id) || null, addEventListener() {}, querySelector: () => null };
+  const window = {
+    OTB: {
+      escapeHtml: (s) => String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;'),
+      $: () => null, toast: (m) => toasts.push(m), roleAxisLabel: () => 'Role',
+    },
+    location: { assign() {} },
+  };
+  vm.runInNewContext(SRC, { window, document, fetch, JSON, Promise, Map, Set, String, Number, Array, Object, Math, RegExp, console });
+  const settle = async () => { for (let i = 0; i < 8; i++) await new Promise((r) => setTimeout(r, 0)); };
+  await settle();
+
+  const rows = els.get('specialities-rows');
+  async function click(act, id) {
+    const btn = { dataset: { act, id: String(id) } };
+    handlers.get('specialities-rows:click')({ target: { closest: (sel) => (sel === 'button[data-act]' ? btn : null) } });
+    await settle();
+  }
+  async function submitOffer(id, values) {
+    const form = fakeForm({ id: String(id) }, values);
+    handlers.get('specialities-rows:submit')({ target: { closest: (sel) => (sel === 'form.speciality-offer' ? form : null) }, preventDefault() {} });
+    await settle();
+  }
+  return { els, rows, requests, toasts, click, submitOffer, handlers, create, settle };
+}
+
+const writes = (h) => h.requests.filter((r) => r.method !== 'GET');
+const installedReads = (h) => h.requests.filter((r) => r.path === '/specialities/installed-skills').length;
+
+await test('only a speciality you own has an "Offered skills" control', async () => {
+  const h = await boot();
+  const buttons = [...h.rows.innerHTML.matchAll(/data-act="offer" data-id="(\d+)"/g)].map((m) => m[1]);
+  assert.deepEqual(buttons, ['12']);
+});
+
+await test('opening it lists every installed skill with its plain description and cost, the current offer ticked', async () => {
+  const h = await boot();
+  assert.equal(installedReads(h), 0, 'nothing is fetched until the owner asks');
+  await h.click('offer', 12);
+  assert.equal(installedReads(h), 1);
+  const html = h.rows.innerHTML;
+  for (const k of INSTALLED) {
+    assert.ok(html.includes(`value="${k.name}"`), `${k.name} is a choice`);
+    assert.ok(html.includes(k.does), `${k.name} shows what it does`);
+    assert.ok(html.includes(k.cost), `${k.name} shows what it costs`);
+  }
+  assert.deepEqual(checkedIn(html), ['recall'], 'what it offers today is ticked');
+  assert.match(html, /Offering a skill turns nothing on/);
+});
+
+await test('a skill it offers that the instance no longer has is named, not offered as a choice', async () => {
+  const h = await boot();
+  await h.click('offer', 12);
+  assert.ok(!h.rows.innerHTML.includes('value="retired-skill"'), 'not a checkbox');
+  assert.match(h.rows.innerHTML, /No longer on this project, so saving drops it from the offer: <code>retired-skill<\/code>/);
+});
+
+await test('saving sends exactly the ticked skills as one PATCH, and nothing is written before', async () => {
+  const h = await boot();
+  await h.click('offer', 12);
+  assert.equal(writes(h).length, 0);
+  await h.submitOffer(12, ['recall', 'status']);
+  const w = writes(h);
+  assert.equal(w.length, 1);
+  assert.equal(w[0].method, 'PATCH');
+  assert.equal(w[0].path, '/specialities/12');
+  assert.deepEqual(w[0].body, { skills: ['recall', 'status'] });
+  assert.ok(h.toasts.some((m) => /offers 2 skills/.test(m)));
+  assert.ok(!/class="speciality-offer"/.test(h.rows.innerHTML), 'the editor closes on save');
+});
+
+await test('offering nothing is a choice too', async () => {
+  const h = await boot();
+  await h.click('offer', 12);
+  await h.submitOffer(12, []);
+  assert.deepEqual(writes(h)[0].body, { skills: [] });
+});
+
+await test('the installed list is read once per page, however often the editor opens', async () => {
+  const h = await boot();
+  await h.click('offer', 12);
+  await h.click('offer', 12); // close
+  await h.click('offer', 12); // open again
+  assert.equal(installedReads(h), 1);
+});
+
+await test('the create form offers the same choices, filled on first open, and sends them with the new speciality', async () => {
+  const h = await boot();
+  const box = h.els.get('speciality-create-offer');
+  const host = h.els.get('speciality-create-skills');
+  box.open = true;
+  h.handlers.get('speciality-create-offer:toggle')();
+  await h.settle();
+  for (const k of INSTALLED) assert.ok(host.innerHTML.includes(`value="${k.name}"`) && host.innerHTML.includes(k.does));
+  assert.deepEqual(checkedIn(host.innerHTML), [], 'a new speciality starts offering nothing');
+  h.create.elements.name.value = 'New one';
+  h.create.elements.discipline.value = 'engineer';
+  h.create.querySelectorAll = (sel) => (sel === 'input[name="skill"]:checked' ? [{ value: 'status' }] : []);
+  h.handlers.get('speciality-create:submit')({ preventDefault() {} });
+  await h.settle();
+  const post = writes(h).find((r) => r.method === 'POST' && r.path === '/specialities');
+  assert.ok(post, 'created');
+  assert.deepEqual(post.body.skills, ['status']);
+});
+
+await test('settings.html carries the create form\'s picker inside the form it submits with', () => {
+  const form = HTML.slice(HTML.indexOf('<form id="speciality-create"'), HTML.indexOf('</form>', HTML.indexOf('<form id="speciality-create"')));
+  assert.match(form, /<details id="speciality-create-offer"/);
+  assert.match(form, /id="speciality-create-skills"/);
+});
+
+summary();

package/tests/speciality_skills.mjs

@@ -304,6 +304,15 @@ try {
     store.speciality = saved;
   });
 
+  await test('GET /specialities/installed-skills lists every installed skill, explained, for the owner\'s picker (task 1004404)', async () => {
+    const r = await call('GET', '/specialities/installed-skills');
+    assert.equal(r.status, 200, `not captured by /specialities/:id: ${JSON.stringify(r.body)}`);
+    assert.deepEqual(r.body.skills.map((s) => s.name), ['costing', 'recall', 'status'], 'every installed skill, by name — the choices are what the instance has');
+    const recall = r.body.skills.find((s) => s.name === 'recall');
+    assert.equal(recall.does, 'Search what the project knows. Read-only.', 'the same explanation the walkthrough shows');
+    assert.match(recall.cost, /^Read-only/);
+  });
+
   await test('PUT /specialities/:id/skills needs an active adoption', async () => {
     store.adoption = null;
     const r = await call('PUT', '/specialities/9/skills', { enabled_skills: ['recall'] });