feat: device-code login (headless/CI) + push notification toggle

moshcode login --device: RFC 8628-style device flow — CLI prints a short
XXXX-XXXX code + URL, you approve at app.moshcode.sh/device in ANY browser,
CLI polls until authorized. No browser/loopback on the box, so it works on
servers and CI. Auto-selected when stdin isn't a TTY. (migration 004)

App: /cli/device/code, /cli/device/token (machine, CSRF-exempt), /device
approve page; single-use codes; claimed→expired. Verified E2E.

Dashboard push button is now a toggle: reflects whether THIS device is
subscribed and flips between "Enable push" and "Disable notifications on this
device" (+ /push/unsubscribe).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

Author: ralyodio

apps/pwa/public/push.js

@@ -1,4 +1,5 @@
-/* Enable web-push for approvals. Subscribes this device and stores it server-side. */
+/* Web-push toggle for approvals. Reflects whether THIS device is subscribed:
+   "Enable push on this device" ⇄ "Disable notifications on this device". */
 (function () {
   var btn = document.getElementById("push-btn");
   if (!btn) return;
@@ -8,34 +9,55 @@
     var m = document.cookie.match(/(?:^|; )mc_csrf=([^;]+)/);
     return m ? decodeURIComponent(m[1]) : "";
   }
+  function post(url, body) {
+    return fetch(url, {
+      method: "POST",
+      headers: { "content-type": "application/json", "x-csrf-token": csrf() },
+      body: JSON.stringify(body || {}),
+    });
+  }
   function urlB64ToUint8(base64) {
     var pad = "=".repeat((4 - (base64.length % 4)) % 4);
     var b64 = (base64 + pad).replace(/-/g, "+").replace(/_/g, "/");
-    var raw = atob(b64);
-    var out = new Uint8Array(raw.length);
+    var raw = atob(b64), out = new Uint8Array(raw.length);
     for (var i = 0; i < raw.length; i++) out[i] = raw.charCodeAt(i);
     return out;
   }
+  function setState(on) {
+    btn.dataset.on = on ? "1" : "0";
+    btn.textContent = on ? "🔕 Disable notifications on this device" : "🔔 Enable push on this device";
+    btn.classList.toggle("danger", on);
+  }
+
+  async function enable() {
+    var perm = await Notification.requestPermission();
+    if (perm !== "granted") { btn.textContent = "permission denied"; return; }
+    var reg = await navigator.serviceWorker.ready;
+    var sub = await reg.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey: urlB64ToUint8(VAPID) });
+    var j = sub.toJSON();
+    var r = await post("/push/subscribe", { endpoint: j.endpoint, p256dh: j.keys.p256dh, auth: j.keys.auth });
+    if (r.ok) setState(true); else btn.textContent = "failed — retry";
+  }
+  async function disable() {
+    var reg = await navigator.serviceWorker.ready;
+    var sub = await reg.pushManager.getSubscription();
+    if (sub) { await post("/push/unsubscribe", { endpoint: sub.endpoint }); await sub.unsubscribe(); }
+    setState(false);
+  }
 
   btn.addEventListener("click", async function () {
-    if (!("serviceWorker" in navigator) || !("PushManager" in window)) { btn.textContent = "push unsupported"; return; }
+    if (!("serviceWorker" in navigator) || !("PushManager" in window)) { btn.disabled = true; btn.textContent = "push unsupported"; return; }
     if (!VAPID) { btn.textContent = "push not configured"; return; }
-    btn.disabled = true; btn.textContent = "enabling…";
-    try {
-      var perm = await Notification.requestPermission();
-      if (perm !== "granted") { btn.textContent = "permission denied"; btn.disabled = false; return; }
-      var reg = await navigator.serviceWorker.ready;
-      var sub = await reg.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey: urlB64ToUint8(VAPID) });
-      var json = sub.toJSON();
-      var r = await fetch("/push/subscribe", {
-        method: "POST",
-        headers: { "content-type": "application/json", "x-csrf-token": csrf() },
-        body: JSON.stringify({ endpoint: json.endpoint, p256dh: json.keys.p256dh, auth: json.keys.auth }),
-      });
-      btn.textContent = r.ok ? "✓ push enabled" : "failed — retry";
-      btn.disabled = r.ok;
-    } catch (e) {
-      btn.textContent = "failed — retry"; btn.disabled = false;
-    }
+    btn.disabled = true;
+    try { if (btn.dataset.on === "1") await disable(); else await enable(); }
+    catch (e) { btn.textContent = "failed — retry"; }
+    finally { btn.disabled = false; }
   });
+
+  // reflect current state on load
+  (async function () {
+    if (!("serviceWorker" in navigator) || !("PushManager" in window)) { btn.disabled = true; btn.textContent = "push unsupported here"; return; }
+    try { var reg = await navigator.serviceWorker.ready; setState(!!(await reg.pushManager.getSubscription())); }
+    catch (e) { /* leave default label */ }
+  })();
 })();

apps/pwa/public/sw.js

@@ -1,5 +1,5 @@
 /* moshcode PWA service worker — offline app shell (network-first for docs). */
-const CACHE = "moshcode-v2";
+const CACHE = "moshcode-v3";
 const SHELL = ["/", "/icon.svg", "/manifest.webmanifest", "/passkey.js"];
 
 self.addEventListener("install", (e) => {

apps/pwa/src/lib/session.mjs

@@ -65,7 +65,8 @@ export function takeNext(req, res) {
 export function csrfGuard(req, res, next) {
   if (["GET", "HEAD", "OPTIONS"].includes(req.method)) return next();
   // machine endpoints are Bearer/HMAC/PKCE-authenticated, not cookie sessions
-  if (req.path.startsWith("/api/") || req.path.startsWith("/webhooks/") || req.path === "/cli/token") return next();
+  if (req.path.startsWith("/api/") || req.path.startsWith("/webhooks/") ||
+      req.path === "/cli/token" || req.path.startsWith("/cli/device/")) return next();
   const sent = req.body?._csrf || req.get("x-csrf-token");
   if (!sent || sent !== req.cookies?.[CSRF]) return res.status(403).send("bad csrf token");
   next();

apps/pwa/src/migrations/004_device.sql

@@ -0,0 +1,12 @@
+-- Device-code login (RFC 8628 style) for headless / CI `moshcode login --device`.
+CREATE TABLE IF NOT EXISTS device_codes (
+  device_code TEXT PRIMARY KEY,          -- secret the CLI polls with
+  user_code   TEXT NOT NULL UNIQUE,      -- short human code (XXXX-XXXX)
+  user_id     TEXT REFERENCES users(id) ON DELETE CASCADE, -- set on approval
+  status      TEXT NOT NULL DEFAULT 'pending', -- pending | approved | denied | claimed
+  name        TEXT,
+  interval_s  INTEGER NOT NULL DEFAULT 5,
+  created_at  INTEGER NOT NULL,
+  expires_at  INTEGER NOT NULL
+);
+CREATE INDEX IF NOT EXISTS idx_device_user_code ON device_codes(user_code);

apps/pwa/src/routes/cli.mjs

@@ -11,9 +11,19 @@ import { page, footer, appBar, esc } from "../lib/html.mjs";
 import { requireAuth, csrfInput } from "../lib/session.mjs";
 import { createApiKey, bearer, userForApiKey } from "../lib/apikey.mjs";
 import { balance } from "../lib/credits.mjs";
+import { config } from "../config.mjs";
 
 export const cliRouter = Router();
 
+// Unambiguous alphabet for the short human device code (no 0/O/1/I/L/vowels).
+const CODE_ALPHA = "BCDFGHJKMNPQRSTVWXYZ23456789";
+function makeUserCode() {
+  let s = "";
+  for (let i = 0; i < 8; i++) s += CODE_ALPHA[crypto.randomInt(CODE_ALPHA.length)];
+  return `${s.slice(0, 4)}-${s.slice(4)}`;
+}
+const normCode = (s) => String(s || "").toUpperCase().replace(/[^A-Z0-9]/g, "").replace(/(.{4})(.{4})/, "$1-$2");
+
 // Only loopback redirect URIs are allowed (the CLI listens on 127.0.0.1).
 function loopbackOk(uri) {
   try {
@@ -84,3 +94,71 @@ cliRouter.get("/api/me", async (req, res) => {
   if (!user) return res.status(401).json({ error: "invalid or missing API key" });
   res.json({ id: user.id, email: user.email || null, name: user.display_name, credits: await balance(user.id) });
 });
+
+// ---- device-code flow (headless / CI: `moshcode login --device`) ----
+
+// CLI asks for a code pair.
+cliRouter.post("/cli/device/code", async (req, res) => {
+  const deviceCode = token(32);
+  let userCode = makeUserCode();
+  // avoid the astronomically-unlikely collision on the human code
+  for (let i = 0; i < 3 && await get(`SELECT 1 FROM device_codes WHERE user_code = ?`, [userCode]); i++) userCode = makeUserCode();
+  const now = Date.now();
+  const interval = 5, ttl = 10 * 60 * 1000;
+  await run(
+    `INSERT INTO device_codes (device_code,user_code,status,name,interval_s,created_at,expires_at) VALUES (?,?,?,?,?,?,?)`,
+    [deviceCode, userCode, "pending", String(req.body?.name || "moshcode cli").slice(0, 40), interval, now, now + ttl]
+  );
+  res.json({
+    device_code: deviceCode,
+    user_code: userCode,
+    verification_uri: `${config.origin}/device`,
+    verification_uri_complete: `${config.origin}/device?code=${encodeURIComponent(userCode)}`,
+    expires_in: Math.floor(ttl / 1000),
+    interval,
+  });
+});
+
+// The page a human opens to approve a device.
+cliRouter.get("/device", requireAuth, (req, res) => {
+  const prefill = req.query.code ? normCode(req.query.code) : "";
+  const done = req.query.done;
+  const bad = req.query.bad;
+  const body = `${appBar(req.user, 0)}
+  <main class="wrap" style="max-width:440px;padding-top:8vh">
+    <div class="card"><div class="card-body" style="text-align:center">
+      <div style="font-size:2rem">🔑</div>
+      <h1 style="font-size:1.4rem;margin:10px 0">Connect a device</h1>
+      ${done ? `<div class="notice ok">✓ device connected — return to your terminal 🤘</div>`
+        : `<p class="dim mono" style="font-size:.82rem">Enter the code shown in your terminal to authorize the moshcode CLI as <b>${esc(req.user.email || req.user.display_name)}</b>.</p>
+        ${bad ? `<div class="notice err">that code is invalid or expired — check your terminal.</div>` : ""}
+        <form method="post" action="/device" style="margin-top:14px">${csrfInput(req)}
+          <input name="user_code" value="${esc(prefill)}" placeholder="XXXX-XXXX" autocomplete="off" autocapitalize="characters"
+            style="text-align:center;font-size:1.3rem;letter-spacing:.2em;text-transform:uppercase" required>
+          <button class="btn acid block" type="submit" style="margin-top:12px">Authorize 🤘</button>
+        </form>`}
+    </div></div>
+  </main>${footer}`;
+  res.type("html").send(page({ title: "moshcode ▸ connect device", body }));
+});
+
+cliRouter.post("/device", requireAuth, async (req, res) => {
+  const userCode = normCode(req.body.user_code);
+  const row = await get(`SELECT * FROM device_codes WHERE user_code = ? AND status = 'pending' AND expires_at > ?`, [userCode, Date.now()]);
+  if (!row) return res.redirect(`/device?bad=1${req.body.user_code ? "&code=" + encodeURIComponent(req.body.user_code) : ""}`);
+  await run(`UPDATE device_codes SET status = 'approved', user_id = ? WHERE device_code = ?`, [req.user.id, row.device_code]);
+  res.redirect("/device?done=1");
+});
+
+// CLI polls here until approved.
+cliRouter.post("/cli/device/token", async (req, res) => {
+  const row = await get(`SELECT * FROM device_codes WHERE device_code = ?`, [req.body?.device_code || ""]);
+  if (!row || row.expires_at < Date.now() || row.status === "claimed") return res.status(400).json({ error: "expired_token" });
+  if (row.status === "denied") return res.status(400).json({ error: "access_denied" });
+  if (row.status !== "approved") return res.status(400).json({ error: "authorization_pending" });
+
+  await run(`UPDATE device_codes SET status = 'claimed' WHERE device_code = ?`, [row.device_code]);
+  const user = await get(`SELECT * FROM users WHERE id = ?`, [row.user_id]);
+  const { plaintext } = await createApiKey(user.id, row.name || "moshcode cli");
+  res.json({ access_token: plaintext, token_type: "bearer", user: { id: user.id, email: user.email || null, name: user.display_name } });
+});

apps/pwa/src/routes/pages.mjs

@@ -193,3 +193,8 @@ pagesRouter.post("/push/subscribe", requireAuth, async (req, res) => {
     [id(), req.user.id, endpoint, p256dh, auth, Date.now()]);
   res.json({ ok: true });
 });
+
+pagesRouter.post("/push/unsubscribe", requireAuth, async (req, res) => {
+  if (req.body?.endpoint) await run(`DELETE FROM push_subscriptions WHERE endpoint = ? AND user_id = ?`, [req.body.endpoint, req.user.id]);
+  res.json({ ok: true });
+});

bin/moshcode.mjs

@@ -18,7 +18,7 @@ import { runUpgrade } from "../src/upgrade.mjs";
 import { mcpCommand, skillCommand } from "../src/integrations.mjs";
 import { locate, tilde } from "../src/pwd.mjs";
 import { createPrd, listPrds, authoringPrompt } from "../src/prd.mjs";
-import { login, whoami, logout } from "../src/auth.mjs";
+import { login, loginDevice, whoami, logout } from "../src/auth.mjs";
 import { tui } from "../src/tui.mjs";
 
 const HERE = path.dirname(fileURLToPath(import.meta.url));
@@ -122,8 +122,9 @@ usage:
   moshcode prd [idea]                  publish the next numbered PRD (OpenPRD) to
                                        prd/NNNN-slug.md and hand it to an engine to
                                        author; no arg lists existing PRDs
-  moshcode login                       authenticate this machine with app.moshcode.sh
-                                       (browser OAuth+PKCE) so notify()/ask() reach you
+  moshcode login [--device]            authenticate this machine with app.moshcode.sh
+                                       (browser OAuth+PKCE; --device = headless/CI
+                                       code flow) so notify()/ask() reach you
   moshcode whoami | logout             show / clear the logged-in account
   moshcode pwd                         show the current dir + git repo/branch/origin
   moshcode engines                     list engines + install status
@@ -253,8 +254,11 @@ async function main() {
     return;
   }
   if (cmd === "login") {
-    try { const { email } = await login(); console.log(`✓ logged in${email ? ` as ${email}` : ""} 🤘 — notify()/ask() will reach you now.`); }
-    catch (e) { console.error(String(e.message || e)); process.exitCode = 1; }
+    const device = rest.includes("--device") || rest.includes("-d") || !process.stdin.isTTY;
+    try {
+      const { email } = device ? await loginDevice() : await login();
+      console.log(`✓ logged in${email ? ` as ${email}` : ""} 🤘 — notify()/ask() will reach you now.`);
+    } catch (e) { console.error(String(e.message || e)); process.exitCode = 1; }
     return;
   }
   if (cmd === "whoami") { await whoami(); return; }

src/auth.mjs

@@ -88,6 +88,50 @@ export function login({ timeoutMs = 180000 } = {}) {
   });
 }
 
+/**
+ * Device-code login (headless / CI): no local browser or loopback needed. Prints
+ * a short code + URL; you approve it in ANY browser; the CLI polls until done.
+ */
+export async function loginDevice({ open = true } = {}) {
+  const startRes = await fetch(`${API()}/cli/device/code`, {
+    method: "POST",
+    headers: { "content-type": "application/json" },
+    body: JSON.stringify({ name: `moshcode cli @ ${os.hostname()}` }),
+  });
+  if (!startRes.ok) throw new Error(`couldn't start device login (${startRes.status})`);
+  const d = await startRes.json();
+
+  console.log(`\n🔑 to log in, open:  ${d.verification_uri}`);
+  console.log(`   and enter code:  \x1b[1m\x1b[38;5;154m${d.user_code}\x1b[0m\n`);
+  if (open) openBrowser(d.verification_uri_complete);
+
+  const interval = Math.max(2, d.interval || 5) * 1000;
+  const deadline = Date.now() + (d.expires_in || 600) * 1000;
+  const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
+
+  console.log("   waiting for you to authorize…");
+  for (;;) {
+    if (Date.now() > deadline) throw new Error("code expired — run `moshcode login --device` again");
+    await sleep(interval);
+    let data;
+    try {
+      const r = await fetch(`${API()}/cli/device/token`, {
+        method: "POST",
+        headers: { "content-type": "application/json" },
+        body: JSON.stringify({ device_code: d.device_code }),
+      });
+      data = await r.json();
+    } catch { continue; } // transient network — keep polling
+    if (data.access_token) {
+      saveCreds({ api: API(), token: data.access_token, email: data.user?.email || null, id: data.user?.id });
+      return { email: data.user?.email || null };
+    }
+    if (data.error === "access_denied") throw new Error("authorization denied");
+    if (data.error === "expired_token") throw new Error("code expired — run `moshcode login --device` again");
+    // authorization_pending / slow_down → keep waiting
+  }
+}
+
 /** Print who is logged in (verified against the app). */
 export async function whoami() {
   const creds = loadCreds();

src/tui.mjs

@@ -12,7 +12,7 @@ import { TOOLS, resolveTool, toolStatus, openTool } from "./tools.mjs";
 import { runUpgrade } from "./upgrade.mjs";
 import { locate, tilde } from "./pwd.mjs";
 import { createPrd, listPrds, authoringPrompt } from "./prd.mjs";
-import { login, whoami, logout } from "./auth.mjs";
+import { login, loginDevice, whoami, logout } from "./auth.mjs";
 import { runScript } from "./runtime.mjs";
 import { moshVocabulary } from "./commands.mjs";
 import { mcpCommand, skillCommand } from "./integrations.mjs";
@@ -311,7 +311,8 @@ export async function tui() {
     if (cmd === "help" || cmd === "?" || cmd === "h") { printHelp(); continue; }
     if (cmd === "pwd" || cmd === "where") { printPwd(); continue; }
     if (cmd === "login") {
-      try { const { email } = await login(); console.log(ok(`logged in${email ? ` as ${email}` : ""} 🤘`)); }
+      const device = rest.includes("--device") || rest.includes("device") || rest.includes("-d");
+      try { const { email } = device ? await loginDevice() : await login(); console.log(ok(`logged in${email ? ` as ${email}` : ""} 🤘`)); }
       catch (e) { console.log(err(String(e.message || e))); }
       continue;
     }