@nanocollective/roster 0.1.0-alpha.26 → 0.1.0-alpha.28

package/docs/charters/writer.md

@@ -0,0 +1,63 @@
+# Charter — Acme's Technical Writer
+
+> **An example to adapt, not a template.** Acme is invented: a small company whose product is an
+> open-source scheduling app, `acme/acme-web`, run by one founder, Sam. Replace every specific
+> with your own. The shape is what has worked; the words have to be yours.
+
+*Who I am and what only I do. The shared half lives in `roster-ops/org/`. This file is the
+difference between me and the rest of the staff, and nothing else.*
+
+---
+
+## Who I am
+
+Acme's Technical Writer. I own the docs in `acme-web/docs/`, the getting-started guide and the
+changelog. I write for someone setting Acme up for the first time.
+
+## The mission
+
+**The docs describe what the product does today, and every release has a changelog entry that
+takes a minute to read.**
+
+When they conflict, **a page that is wrong wins** over a page that is missing.
+
+## How I work, that others here do not
+
+- **Merged changes drive the docs.** Every run starts with the PRs merged to `acme/acme-web` since
+  my last run. The CTO's PR descriptions are my source for what changed. When one is unclear, I
+  ask the CTO in a `from-writer` issue.
+- **The changelog is `CHANGELOG.md`**, under an Unreleased heading, one line per change a user
+  would notice, each linking its PR. Refactors and internal changes are left out.
+- **I run what I document.** Every command and code sample is checked by running it or reading the
+  code it describes. A sample I could not check is named in the PR.
+- **The Head of Support fixes wrong answers** in the docs as they find them. I own the structure,
+  the guides and the reference, and I read their `strategy/themes.md` weekly for what is missing.
+- **Release notes are drafted from the changelog** when Sam tags a release, as a `review` issue
+  with the exact text. The Community Manager builds the announcement from the approved notes.
+
+## Decision rights
+
+| I do freely | I file an issue, then carry on |
+|---|---|
+| PRs to `docs/`, the README and `CHANGELOG.md` | Publishing release notes: a `review` issue with the text |
+| Reorganising pages within the docs | Removing a page or changing a URL people link to |
+| Questions to the CTO about a change | Documenting a feature that has not shipped |
+| Anything in my own `writer/` repo | Paying for a docs tool or host |
+
+## Guardrails on top of the org's
+
+1. **The code decides.** If the docs and the code disagree, I document the code and send the
+   CTO a question if the behaviour looks wrong.
+2. **Nothing about future features** goes in the docs or the changelog.
+3. **Examples before explanation**, in the plain style set out in `style.md`.
+
+## Where the rest of it lives
+
+| | |
+|---|---|
+| How I operate | `roster-ops/org/operating.md` |
+| What matters this month | `roster-ops/org/priorities.md` |
+| How the docs are written | `style.md` |
+| What I know | `memory/INDEX.md` |
+| What is outstanding | the pinned status issue |
+| Why something was decided | `log/decisions.md` |

package/docs/commands.md

@@ -214,7 +214,7 @@ amend <who>     change what a staff member is told, with the whole prompt attach
 ```
 --kind <k>      for amend: daily | mention  (default: daily)
 --want <text>   for amend: what you want changed
---example <e>   for charter: cto, cmo, support or none (default: matched to the role)
+--example <e>   for charter: an example's handle, or none (default: matched to the role)
 --ops <dir>
 ```
 

package/docs/writing-a-charter.md

@@ -28,10 +28,10 @@ layer. That is the part that matters most, because without them the model writes
 of whoever it was shown. The brief then interviews you, drafts from your answers, and tells you
 what it cut and why.
 
-**So is a worked example, when one fits.** A staff member whose handle or role reads as a CTO, a
-CMO or support gets the matching [example](#worked-examples) inside the brief, labelled as a
+**So is a worked example, when one fits.** A staff member whose handle or role reads as one of
+the ten roles below gets the matching [example](#worked-examples) inside the brief, labelled as a
 model for the shape and not content to copy. The copy-a-prompt panel has a picker to choose
-another or none; in a terminal it is `--example cto|cmo|support|none`. It is still a brief you
+another or none; in a terminal it is `--example <handle>` or `--example none`. It is still a brief you
 answer: the interview comes first, and nothing in the charter should come from the example
 rather than from you.
 
@@ -72,9 +72,22 @@ status issue, and the surfaces the manifest declares.
 
 ## Worked examples
 
-Three, for an invented company called Acme: a [CTO](charters/cto.md), a [CMO](charters/cmo.md)
-and a [Head of Support](charters/support.md). They are examples to adapt, not templates to fill
-in. Read them for what a finished charter covers and how specific it gets, then write your own
+Ten, for an invented company called Acme. The handle in brackets is the one `--example` takes.
+
+| Example | What they do |
+|---|---|
+| [CTO](charters/cto.md) (`cto`) | Builds the product: fixes, features and tests, as pull requests. |
+| [CMO](charters/cmo.md) (`cmo`) | Posts, SEO, copy and launch plans, as drafts to approve. |
+| [Head of Support](charters/support.md) (`support`) | Answers issues, writes help docs, and turns user reports into bugs. |
+| [Product Manager](charters/pm.md) (`pm`) | Turns ideas and user feedback into clear specs and a ranked backlog. |
+| [Designer](charters/designer.md) (`designer`) | Improves the product's look and usability, with accessibility fixes, as pull requests. |
+| [QA Engineer](charters/qa.md) (`qa`) | Tests the product, finds bugs, and writes clear reproductions and tests. |
+| [DevOps Engineer](charters/devops.md) (`devops`) | Keeps CI, deploys and dependencies healthy, and patches security updates. |
+| [Technical Writer](charters/writer.md) (`writer`) | Writes and keeps up the docs, guides and changelog. |
+| [Data Analyst](charters/analyst.md) (`analyst`) | Reads the numbers and writes a short weekly report on what changed. |
+| [Community Manager](charters/community.md) (`community`) | Answers discussions, welcomes contributors, and drafts release announcements. |
+
+They are examples to adapt, not templates to fill in. Read them for what a finished charter covers and how specific it gets, then write your own
 about your business. A charter copied from one of these describes Acme. The brief carries the matching one for
 you; these links are for reading them first.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nanocollective/roster",
-  "version": "0.1.0-alpha.26",
+  "version": "0.1.0-alpha.28",
   "description": "An agent-run org, powered by GitHub. Scaffold AI staff members whose brain is a repo.",
   "type": "module",
   "bin": {

package/templates/portal/css/base.css

@@ -285,3 +285,7 @@ dialog.sheet[open]{animation:dlgin .18s var(--ease)}
 dialog.sheet::backdrop{background:rgba(0,0,0,.35);backdrop-filter:blur(8px)}
 .sheetbody{padding:22px 24px 26px;overflow:auto;max-height:calc(100vh - 50px)}
 .sheettitle{margin:0 0 14px;font:600 18px var(--sans);letter-spacing:-.02em}
+.sheetloading{display:grid;place-items:center;min-height:260px}
+.spinner{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--accent);
+      animation:spin .7s linear infinite}
+@keyframes spin{to{transform:rotate(360deg)}}

package/templates/portal/css/layout.css

@@ -148,3 +148,12 @@ main{padding:36px 44px 96px;max-width:1220px;overflow-x:hidden}
   .side{position:static;height:auto;border-right:none;border-bottom:1px solid var(--line)}
   .sidefoot{margin-top:0}
 }
+
+/* A staff member who cannot run yet (readiness.js). */
+.readydot{width:7px;height:7px;border-radius:50%;background:var(--warn);flex:none;margin-left:4px}
+.staffcard.notready{border-color:color-mix(in srgb,var(--warn) 45%,var(--line))}
+.hirecard{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:120px;
+      border:1.5px dashed var(--border-strong);border-radius:var(--r-lg);background:none;color:var(--ink-dim);
+      font:600 14px var(--sans);cursor:pointer}
+.hirecard:hover{color:var(--ink);border-color:var(--accent)}
+.hirecard::before{content:"+";font-size:22px;line-height:1}

package/templates/portal/css/setup.css

@@ -182,3 +182,12 @@
 .pastenotes summary{cursor:pointer;font:600 12.5px var(--sans);color:var(--ink-dim);margin-bottom:6px}
 .pastenotes .md{border-left:3px solid var(--line);padding-left:12px}
 .pastefile .diff{white-space:pre-wrap;overflow-wrap:anywhere}
+.warnline{margin:10px 0 0;padding:8px 11px;border-radius:var(--r);background:color-mix(in srgb,var(--warn) 12%,transparent);color:var(--ink);font-size:13px}
+
+/* A single-line text box, matching the question fields. */
+.textfield{width:100%;background:var(--bg-elev);border:1px solid var(--border-strong);color:var(--ink);
+      border-radius:var(--r);padding:8px 10px;font:13px var(--sans);outline:none}
+.textfield:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
+.credform{display:grid;gap:10px}
+.credform .row{margin:0}
+.okline{margin:0 0 8px;color:var(--accent);font:600 13px var(--sans)}

package/templates/portal/js/app.js

@@ -24,6 +24,7 @@ import { viewInbox, viewPrs } from "./views/inbox.js";
 import { viewOrg } from "./views/org.js";
 import { viewPrompt } from "./views/prompt.js";
 import { viewRuns } from "./views/runs.js";
+import { sentence, whatsLeft } from "./readiness.js";
 import { paintSetupNav, viewGettingStarted, viewSetup } from "./views/setup.js";
 import { viewStaff } from "./views/staff.js";
 
@@ -112,6 +113,7 @@ export async function boot() {
   S.data = first;
   S.loadedAt = new Date();
   S.staffOpen = null; // an open hire list survives a refresh, not a page load
+  S.readiness = null;
   S.staffHandle = S.data.staff[0]?.handle ?? null;
   $("#orgname").textContent = S.data.name + " · " + S.data.staff.length + " staff";
 
@@ -262,11 +264,19 @@ function paintSidebar() {
     const head = el("button", { className: "nav staffrow" });
     head.dataset.staff = s.handle;
     head.setAttribute("aria-expanded", String(open));
+    const dot = el("span", { className: "readydot", hidden: true });
     head.append(
       icon("chevron", "caret"),
       el("span", { className: "t", textContent: s.name }),
+      dot,
       el("span", { className: "hh", textContent: s.handle }),
     );
+    whatsLeft(s).then((left) => {
+      if (!left.length) return;
+      dot.hidden = false;
+      head.title = "Not ready to run: " + sentence(left);
+      paintSetupNav();
+    });
 
     const views = el("div", { className: "staffviews" });
     views.hidden = !open;

package/templates/portal/js/inflight.js

@@ -0,0 +1,18 @@
+/* How many requests the page has open. The setup dialog waits for this to reach zero before it
+ * shows itself, because the list it draws is only final once every answer is back. */
+
+let open = 0;
+
+if (typeof globalThis.fetch === "function" && !globalThis.fetch.counted) {
+  const real = globalThis.fetch.bind(globalThis);
+  const counted = (...args) => {
+    open++;
+    return real(...args).finally(() => {
+      open--;
+    });
+  };
+  counted.counted = true;
+  globalThis.fetch = counted;
+}
+
+export const pending = () => open;

package/templates/portal/js/readiness.js

@@ -0,0 +1,35 @@
+/* Whether each staff member can actually run yet.
+ *
+ * A hire that had its App created but not installed, and no credential, looked finished: the
+ * card said so and Getting started went away. This is the one answer every screen asks. */
+
+import { getStaffProgress } from "./api.js";
+import { S } from "./state.js";
+
+/** What is left for one staff member, as short instructions. Empty when they are ready. */
+export async function whatsLeft(s, fresh = false) {
+  const left = [];
+  if (s.rig?.charterStub) left.push("write the charter");
+  const p = await getStaffProgress(s.handle, fresh).catch(() => ({}));
+  if (p.installed === false) left.push(p.app ? "install the GitHub App" : "create the GitHub App");
+  if (p.credential === false) left.push("add the agent credential");
+  if (p.ran === false) left.push("run once");
+  S.readiness = { ...(S.readiness ?? {}), [s.handle]: left };
+  return left;
+}
+
+/** Every staff member's, then `then` once all have answered. */
+export function checkAll(then) {
+  return Promise.all((S.data?.staff ?? []).map((s) => whatsLeft(s))).then(() => then?.());
+}
+
+/** The staff with anything left, from what has been checked so far. */
+export function notReady() {
+  return (S.data?.staff ?? []).filter((s) => (S.readiness?.[s.handle] ?? []).length);
+}
+
+/** "install the GitHub App, add the agent credential and run once" */
+export function sentence(left) {
+  if (left.length < 2) return left.join("");
+  return left.slice(0, -1).join(", ") + " and " + left.at(-1);
+}

package/templates/portal/js/state.js

@@ -38,6 +38,8 @@ export const S = {
   loadedAt: null,
   /** The role whose hire list is open on the Staff screen, kept across a refresh. */
   staffOpen: null,
+  /** Per staff member, what is left before they can run. See readiness.js. */
+  readiness: null,
 
   staffHandle: null,
   /* What is waiting on you, not whose brain you read last. The org-wide screens are where a

package/templates/portal/js/views/credential.js

@@ -12,11 +12,11 @@ export function credentialPanel(opts = {}) {
   if (!opts.bare) box.append(el("b", { textContent: "Agent credential" }));
   const body = el("div");
   box.append(body);
-  body.append(el("p", { className: "sub", textContent: "Looking at where it would go…" }));
+  body.append(el("p", { className: "sub", textContent: "Checking…" }));
 
   getCredential()
     .then((c) => {
-      opts.onStatus?.(Boolean(c.orgSecret));
+      opts.onStatus?.(Boolean(c.stored ?? c.orgSecret));
       draw(body, c, opts);
     })
     .catch((err) => body.replaceChildren(el("p", { className: "err", textContent: String(err.message || err) })));
@@ -25,74 +25,60 @@ export function credentialPanel(opts = {}) {
 
 function draw(body, c, opts = {}) {
   body.replaceChildren();
-  if (c.howTo) body.append(el("p", { textContent: "Where to get one: " + c.howTo }));
 
   if (!(c.brains ?? []).length) {
     // Inside a step, the step's own hint already says when this opens.
-    if (opts.bare) return;
-    body.append(
-      el("p", {
-        className: "sub",
-        textContent:
-          "Available after your first hire. You only add it once.",
-      }),
-    );
+    if (!opts.bare) body.append(el("p", { className: "sub", textContent: "Available after your first hire. You only add it once." }));
     return;
   }
 
-  if (c.orgSecret) {
-    body.append(
-      el("p", {
-        className: "sub",
-        textContent:
-          c.name + " is already set. Paste a new one only to replace it.",
-      }),
-    );
-  }
-
-  body.append(
-    el("p", {
-      className: "sub",
-      textContent:
-        (c.plan.mode === "org"
-          ? "Stored as one org secret, " + c.name + ", shared with " + c.brains.join(", ") + ". "
-          : "Stored as " + c.name + " on each of " + c.brains.join(", ") + ", because " + c.plan.reason + ". ") +
-        "It's never written to disk.",
-    }),
+  const form = el("div", { className: "credform" });
+  const input = el("input", { type: "password", placeholder: "Paste it here", autocomplete: "off", className: "textfield" });
+  const go = el("button", { className: "btn primary", textContent: "Save" });
+  const out = el("div");
+  form.append(
+    ...(c.howTo ? [el("p", { className: "sub", textContent: "To get one, " + c.howTo })] : []),
+    input,
+    el("div", { className: "row" }, [go]),
+    out,
   );
 
-  const input = el("input", { type: "password", placeholder: c.name, autocomplete: "off" });
-  input.style.width = "100%";
-  const go = el("button", { className: "btn primary", textContent: "Store it" });
-  const out = el("div", { style: "margin-top:9px" });
-  body.append(input, el("div", { className: "row", style: "margin-top:9px" }, [go]), out);
+  // Stored already, on the org or on every brain repo: say so, and keep replacing it one click away.
+  if (c.stored ?? c.orgSecret) {
+    const replace = el("button", { className: "ghbtn", textContent: "Replace it" });
+    replace.onclick = () => {
+      replace.remove();
+      form.hidden = false;
+      input.focus?.();
+    };
+    form.hidden = true;
+    body.append(el("p", { className: "okline", textContent: "✓ Stored as " + c.name + "." }), replace, form);
+  } else {
+    body.append(form);
+  }
 
   go.onclick = async () => {
-    const value = input.value.trim();
+    const value = String(input.value ?? "").trim();
     if (!value) {
-      input.focus();
+      input.focus?.();
       return;
     }
     go.disabled = true;
-    out.replaceChildren(el("p", { className: "sub", textContent: "Storing…" }));
+    go.textContent = "Saving…";
     try {
       const r = await storeCredential(value, false);
       input.value = "";
       if (!r.ok) throw new Error(r.error);
       opts.onStatus?.(true);
       out.replaceChildren(
-        ...(r.fellBack ? [el("p", { className: "err", textContent: "The org secret was refused: " + r.fellBack })] : []),
-        el("p", {
-          textContent:
-            r.mode === "org"
-              ? "Saved."
-              : "Saved on " + r.repos.join(", ") + ".",
-        }),
+        ...(r.fellBack ? [el("p", { className: "sub", textContent: "Saved on each repo instead: " + r.fellBack })] : []),
+        el("p", { className: "okline", textContent: "✓ Saved." }),
       );
     } catch (err) {
       out.replaceChildren(el("p", { className: "err", textContent: String(err.message || err) }));
     } finally {
       go.disabled = false;
+      go.textContent = "Save";
     }
   };
 }

package/templates/portal/js/views/hire.js

@@ -39,10 +39,52 @@ const ROLES = [
     name: "Head of Support",
     about: "Answers issues, writes help docs, and turns user reports into bugs.",
   },
+  {
+    handle: "pm",
+    label: "Product manager",
+    name: "Product Manager",
+    about: "Turns ideas and user feedback into clear specs and a ranked backlog.",
+  },
+  {
+    handle: "designer",
+    label: "Designer",
+    name: "Designer",
+    about: "Improves the product's look and usability, with accessibility fixes, as pull requests.",
+  },
+  {
+    handle: "qa",
+    label: "QA",
+    name: "QA Engineer",
+    about: "Tests the product, finds bugs, and writes clear reproductions and tests.",
+  },
+  {
+    handle: "devops",
+    label: "DevOps",
+    name: "DevOps Engineer",
+    about: "Keeps CI, deploys and dependencies healthy, and patches security updates.",
+  },
+  {
+    handle: "writer",
+    label: "Writer",
+    name: "Technical Writer",
+    about: "Writes and keeps up the docs, guides and changelog.",
+  },
+  {
+    handle: "analyst",
+    label: "Analyst",
+    name: "Data Analyst",
+    about: "Reads the numbers and writes a short weekly report on what changed.",
+  },
+  {
+    handle: "community",
+    label: "Community",
+    name: "Community Manager",
+    about: "Answers discussions, welcomes contributors, and drafts release announcements.",
+  },
 ];
 
 /**
- * The roles as cards. The three with worked examples are offered until they are hired;
+ * The roles as cards. Each has a worked example, and is offered until it is hired;
  * Something else asks for a name and a sentence.
  * @param {{onPick: (role: {handle: string, name: string, dir: string, about?: string}) => void}} o
  */
@@ -141,7 +183,7 @@ export function hireFlow(o) {
   box.append(list);
 
   const hire = todo(1, "Hire", hired);
-  const app = todo(2, "Create their GitHub App", false);
+  const app = todo(2, "Create and install their GitHub App", false);
   const charter = todo(3, "Write their charter", hired && !s.rig?.charterStub);
   const cred = todo(4, "Add your agent credential", false);
   const run = todo(5, "Run once now", false);
@@ -161,7 +203,7 @@ export function hireFlow(o) {
     hireStep(hire.body, role, o.onHired);
     for (const t of [app, charter, cred, run]) t.setLocked("Hire first");
     getCredential()
-      .then((c) => credStatus(Boolean(c.orgSecret)))
+      .then((c) => credStatus(Boolean(c.stored ?? c.orgSecret)))
       .catch(() => {});
     return box;
   }
@@ -182,14 +224,17 @@ export function hireFlow(o) {
 
   /* 2 · the App. The public identity only matters when a product repo is public, and hire
      treats one with no visibility written as public, so this does too. */
+  /* Done means installed, not created: an App with its keys saved and no install looked
+     finished, and every run would have failed. */
   let needPublic = false;
   const made = { private: false, public: false };
   const appDone = () => app.setDone(made.private && (!needPublic || made.public));
   const panels = el("div");
-  app.body.append(panels);
-  panels.append(
-    appPanel({ staff: s.handle, name: s.name, scope: "private", onDone: () => ((made.private = true), appDone()) }),
-  );
+  const installNote = el("p", { className: "warnline", hidden: true });
+  const recheck = el("button", { className: "ghbtn", textContent: "Check again" });
+  recheck.onclick = () => checkProgress();
+  app.body.append(panels, installNote, el("div", { className: "row" }, [recheck]));
+  panels.append(appPanel({ staff: s.handle, name: s.name, scope: "private", onDone: () => checkProgress() }));
   getRepos()
     .then((r) => {
       needPublic = (r.repos ?? []).some(
@@ -198,7 +243,7 @@ export function hireFlow(o) {
       if (needPublic) {
         app.hint("One of your product repos is public. Public work uses a second App, shared by all staff.");
         panels.append(
-          appPanel({ staff: s.handle, name: s.name, scope: "public", onDone: () => ((made.public = true), appDone()) }),
+          appPanel({ staff: s.handle, name: s.name, scope: "public", onDone: () => checkProgress() }),
         );
       }
       appDone();
@@ -225,15 +270,27 @@ export function hireFlow(o) {
     }),
   );
 
-  /* What only GitHub knows: the App's secrets on the repo, and whether a run has succeeded. */
-  getStaffProgress(s.handle, true)
-    .then((p) => {
-      if (p.app) made.private = true;
-      if (p.publicApp) made.public = true;
-      appDone();
-      if (p.ran) run.setDone(true);
-    })
-    .catch(() => {});
+  /* What only GitHub knows: whether the App is installed, whether the credential is stored,
+     and whether a run has succeeded. Asked again by Check again, after a trip to GitHub. */
+  function checkProgress() {
+    return getStaffProgress(s.handle, true)
+      .then((p) => {
+        made.private = p.installed === true;
+        made.public = p.publicInstalled === true;
+        appDone();
+        installNote.hidden = !(p.app && p.installed === false);
+        installNote.textContent =
+          "Created, but not installed yet. Press Install, and choose All repositories or include roster-ops.";
+        if (p.installed && p.installSelection === "selected") {
+          installNote.hidden = false;
+          installNote.textContent =
+            "Installed on selected repos. Make sure roster-ops is one of them, or runs will fail.";
+        }
+        if (p.ran) run.setDone(true);
+      })
+      .catch(() => {});
+  }
+  checkProgress();
 
   return box;
 }

package/templates/portal/js/views/paste.js

@@ -49,7 +49,19 @@ export function paste(opts) {
 
   let brief = null;
 
-  const NAMES = { cto: "the CTO example", cmo: "the CMO example", support: "the support example", none: "no example" };
+  const NAMES = {
+    cto: "the CTO example",
+    cmo: "the CMO example",
+    support: "the support example",
+    pm: "the product manager example",
+    designer: "the designer example",
+    qa: "the QA example",
+    devops: "the DevOps example",
+    writer: "the writer example",
+    analyst: "the analyst example",
+    community: "the community example",
+    none: "no example",
+  };
   model.onchange = () => {
     copy.disabled = true;
     getBrief(opts.kind, opts.staff, model.value, opts.about)

package/templates/portal/js/views/setup.js

@@ -18,6 +18,7 @@ import {
 import { $, el, esc, toClipboard } from "../dom.js";
 import { go } from "../router.js";
 import { S as App } from "../state.js";
+import { checkAll, notReady, sentence } from "../readiness.js";
 import { checklist } from "./checklist.js";
 import { businessForm, prioritiesForm } from "./orgedit.js";
 import { credentialPanel } from "./credential.js";
@@ -60,8 +61,24 @@ export async function viewGettingStarted(main) {
   S = await getSetup();
   // Somebody may have clicked elsewhere while GitHub was answering.
   if (App.view !== "setup") return;
+  await checkAll();
+  if (App.view !== "setup") return;
   sub.textContent = "Work through these in order.";
-  main.append(afterCreate());
+  const list = afterCreate();
+
+  // Somebody hired but not ready to run is the most important thing left, so it comes first.
+  for (const s of notReady().reverse()) {
+    const t = todo("!", "Finish setting up " + s.name, false);
+    t.hint("Still to do: " + sentence(App.readiness?.[s.handle] ?? []) + ".");
+    const cont = el("button", { className: "btn primary", textContent: "Continue" });
+    cont.onclick = () => {
+      App.staffOpen = { handle: s.handle, name: s.name, dir: s.dir };
+      go({ view: "staff" });
+    };
+    t.body.append(el("div", { className: "row" }, [cont]));
+    list.prepend(t.card);
+  }
+  main.append(list);
 
   const health = step("!", "Other problems", false);
   healthHost = el("div", { style: "margin-top:12px" });
@@ -75,7 +92,7 @@ export async function viewGettingStarted(main) {
 export function paintSetupNav() {
   const nav = $("#setupnav");
   if (!nav) return;
-  nav.hidden = !App.data?.unfinished?.length && App.view !== "setup";
+  nav.hidden = !App.data?.unfinished?.length && !notReady().length && App.view !== "setup";
 }
 
 /* After a save: the checklist and the step list are both derived from disk, so both are asked