@nanocollective/roster 0.1.0-alpha.6 → 0.1.0-alpha.8

package/templates/portal/js/views/staff.js

@@ -10,13 +10,16 @@
  */
 
 import { post } from "../api.js";
+import { askYes } from "../dialog.js";
 import { ago, el, esc } from "../dom.js";
 import { icon } from "../icons.js";
 import { refreshAll } from "../refresh.js";
 import { S } from "../state.js";
 import { appPanel } from "./app.js";
+import { credentialPanel } from "./credential.js";
 import { cronText } from "./health.js";
 import { paste } from "./paste.js";
+import { runOnce } from "./runonce.js";
 
 export function viewStaff(m) {
   m.append(el("h1", { textContent: "Staff" }));
@@ -88,23 +91,48 @@ export function viewStaff(m) {
       pane.scrollIntoView?.({ behavior: "smooth", block: "start" });
     };
 
-    d.append(el("div", { className: "row", style: "margin-top:10px" }, [write, app, go, status]));
+    /* The credential is once for the org, but the moment somebody looks for it is while setting
+       up one staff member, so it is reachable from each card. */
+    const cred = el("button", { className: "ghbtn", textContent: "Agent credential" });
+    cred.onclick = () => {
+      pane.replaceChildren(el("div", { className: "card" }, [credentialPanel()]));
+      pane.scrollIntoView?.({ behavior: "smooth", block: "start" });
+    };
+
+    const run = el("button", { className: "ghbtn", textContent: "Run once now" });
+    run.onclick = () => {
+      pane.replaceChildren(
+        el("div", { className: "card" }, [
+          runOnce({ staff: s.handle, name: s.name, onDone: (ok) => ok && refreshAll(true) }),
+        ]),
+      );
+      pane.scrollIntoView?.({ behavior: "smooth", block: "start" });
+    };
+
+    d.append(
+      el("div", { className: "row", style: "margin-top:10px" }, [write, app, cred, run, go, status]),
+    );
     return d;
   }
 
   /* ------------------------------- hiring -------------------------------- */
 
   function hireForm(host) {
+    /* App names are copied from whoever is already here. The first hire has nobody to copy
+       from, and the CLI asks for --app and --public-app at that point; these are those two. */
+    const first = !S.data.staff.length;
     const box = el("div", { className: "card" });
     box.append(
       el("h3", { textContent: "Hire someone" }),
       el("p", {
         className: "sub",
         style: "margin-bottom:14px",
-        textContent:
-          "Only the handle is required. Everything else is copied from whoever is already " +
-          "here, because app slugs carry a house naming scheme and the public identity is " +
-          "genuinely shared.",
+        textContent: first
+          ? "Only the handle is required. This is the first hire, so there is nobody to copy " +
+            "App names from: name them here, and later hires follow the pattern."
+          : "Only the handle is required. Everything else is copied from whoever is already " +
+            "here, because app slugs carry a house naming scheme and the public identity is " +
+            "genuinely shared.",
       }),
     );
 
@@ -112,7 +140,17 @@ export function viewStaff(m) {
     const name = field("name", "Chief Financial Officer", "defaults to the handle, uppercased");
     const dir = field("dir", "finance", "directory and repo name; defaults to the handle");
     const schedule = scheduleField();
-    for (const f of [handle, name, dir, schedule]) box.append(f.row);
+    const fields = [handle, name, dir, schedule];
+    const apps = [];
+    if (first) {
+      const org = S.data.org;
+      apps.push(
+        ["app", field("app", org + "-cfo", "this staff member's GitHub App. Names are unique across GitHub, so prefix it")],
+        ["publicApp", field("public app", org + "-robot", "the shared identity for public product repos. Optional when they are all private")],
+      );
+      fields.push(...apps.map(([, f]) => f));
+    }
+    for (const f of fields) box.append(f.row);
 
     const status = el("span", { className: "meta" });
     const plan = el("button", { className: "ghbtn primary", textContent: "Show the plan" });
@@ -134,7 +172,7 @@ export function viewStaff(m) {
       status.className = "meta";
       out.replaceChildren();
       const params = new URLSearchParams({ handle: handle.input.value.trim() });
-      for (const [key, f] of [["name", name], ["dir", dir], ["schedule", schedule]]) {
+      for (const [key, f] of [["name", name], ["dir", dir], ["schedule", schedule], ...apps]) {
         const value = (f.value ? f.value() : f.input.value).trim();
         if (value) params.set(key, value);
       }
@@ -163,18 +201,33 @@ export function viewStaff(m) {
       line("ok", "runs at " + s.schedule + ", on " + s.model),
     );
     for (const p of plan.peers) {
-      box.append(line("ok", p.dir + "/staff.yaml gains a peer entry and a " + p.label + " label"));
+      box.append(line("ok", p.brain + " gains a " + p.label + " label"));
     }
-    box.append(line("ok", "org.yaml gains a staff entry and a repo entry"));
+    /* Commits into repos that already exist, as you. Listed because they are writes to
+       somebody else's repo, and a plan that hid them would be the silent kind. */
+    box.append(el("div", { className: "planhead", textContent: "Commits and pushes, as you" }));
+    for (const c of plan.commits ?? []) box.append(line("ok", c.repo + ": " + c.file + ", " + c.why));
 
-    if (plan.secrets?.length) {
-      box.append(el("div", { className: "planhead", textContent: "You will still have to" }));
-      box.append(
-        line("todo", "create the GitHub App: roster app " + s.handle),
-        line("todo", "put " + plan.secrets.join(", ") + " on the new repo"),
-      );
-    }
-    for (const w of plan.warnings ?? []) box.append(line("warn", w));
+    const cred = s.agentSecret ?? "the agent credential";
+    box.append(
+      plan.orgSecret?.visibility === "selected"
+        ? line("ok", s.brain + " is added to the repos that can read the org secret " + cred)
+        : plan.orgSecret
+          ? line("ok", "the org secret " + cred + " already reaches " + plan.orgSecret.visibility + " repos")
+          : line("warn", "no org secret " + cred + " yet: store it once with Agent credential, after this"),
+    );
+
+    box.append(el("div", { className: "planhead", textContent: "Then, on the new card" }));
+    box.append(
+      line(
+        "todo",
+        "GitHub App, or roster app " + s.handle + " --apply: creates it, sets its secrets, and " +
+          "opens the install page with the repos already ticked",
+      ),
+      line("todo", "Write the charter"),
+      line("todo", "Run once now, or roster run " + s.handle + " --apply: the run that proves the wiring"),
+    );
+    for (const w of plan.warnings ?? []) box.append(line("warn", S.data.staff.length ? w : portalWords(w)));
 
     const status = el("span", { className: "meta" });
     const go = el("button", { className: "ghbtn primary", textContent: "Hire " + s.handle });
@@ -185,7 +238,7 @@ export function viewStaff(m) {
           handle: s.handle,
           flags: Object.fromEntries(params),
         },
-        "Create " + s.brain + " and wire it up?\n\nThis creates a repository on GitHub.",
+        { title: "Create " + s.brain + " and wire it up?", hint: "This creates a repository on GitHub.", confirm: "Hire " + s.handle },
         go,
         status,
         box,
@@ -240,7 +293,7 @@ export function viewStaff(m) {
     go.onclick = () =>
       apply(
         { action: "retire", handle: plan.handle },
-        "Retire " + plan.name + "?\n\n" + (plan.brain ?? plan.dir) + " is not touched.",
+        { title: "Retire " + plan.name + "?", hint: (plan.brain ?? plan.dir) + " is not touched.", confirm: "Retire " + plan.handle },
         go,
         status,
         box,
@@ -252,7 +305,7 @@ export function viewStaff(m) {
   /* -------------------------------- apply -------------------------------- */
 
   async function apply(payload, ask, btn, status, box) {
-    if (!confirm(ask)) return;
+    if (!(await askYes(ask))) return;
     btn.disabled = true;
     status.textContent = "working…";
     status.className = "meta";
@@ -271,6 +324,14 @@ export function viewStaff(m) {
   }
 }
 
+/* The plan's warnings are the CLI's, and name its flags. Here the same two options are fields
+   on the form above, and a flag the page has no box for reads as a dead end. */
+function portalWords(warning) {
+  return warning
+    .replace(/pass --public-app\b/, "fill in public app above")
+    .replace(/pass --app\b/, "fill in app above");
+}
+
 function field(label, placeholder, hint) {
   const input = el("input", { type: "search", placeholder, value: "", style: "width:100%" });
   input.dataset.field = label;