Recapture live-door screenshots after IAM and portal login.

Catalog cards and UI-REVIEW.pdf now show signed-in fleet, CS, sales,
accounting, staff, IAM people, and the customer dashboard — not login forms.

packages/ui-docs/scripts/build-review-pdf.py

@@ -88,8 +88,8 @@ PAGES = [
      "https://staff.zapier.georgelambert.org/ — IAM login, then CS/sales/accounting door."),
     ("live/iam.png", "Live — staff IAM",
      "https://iam.zapier.georgelambert.org/ — named users, roles, sessions. Seed admin / admin-dev-key."),
-    ("live/login.png", "Live — staff session",
+    ("live/login.png", "Live — staff session (after IAM)",
-     "https://login.zapier.georgelambert.org/ — shared staff cookie; proxies IAM."),
+     "https://login.zapier.georgelambert.org/ redirects to IAM when signed in. People, roles, audit."),
     ("live/cs.png", "Live — customer service",
      "https://cs.zapier.georgelambert.org/ — review prepaid and credit in USD after IAM."),
     ("live/sales.png", "Live — sales",

packages/ui-docs/scripts/capture-live.mjs

@@ -1,5 +1,5 @@
 #!/usr/bin/env node
-/** Screenshot every public HTTPS door on zapier.georgelambert.org. */
+/** Screenshot public HTTPS doors after signing in (staff IAM + customer portal). */
 import fs from 'node:fs';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
@@ -13,22 +13,7 @@ const CHROME =
 
 fs.mkdirSync(SHOTS, { recursive: true });
 
-const DOORS = [
+const wait = (ms) => new Promise((r) => setTimeout(r, ms));
-  { file: 'portal.png', url: 'https://portal.zapier.georgelambert.org/portal/' },
-  { file: 'api.png', url: 'https://api.zapier.georgelambert.org/health' },
-  { file: 'leaf.png', url: 'https://leaf.zapier.georgelambert.org/health' },
-  { file: 'zap.png', url: 'https://zap.zapier.georgelambert.org/health' },
-  { file: 'staff.png', url: 'https://staff.zapier.georgelambert.org/' },
-  { file: 'iam.png', url: 'https://iam.zapier.georgelambert.org/' },
-  { file: 'login.png', url: 'https://login.zapier.georgelambert.org/' },
-  { file: 'cs.png', url: 'https://cs.zapier.georgelambert.org/' },
-  { file: 'sales.png', url: 'https://sales.zapier.georgelambert.org/' },
-  { file: 'acct.png', url: 'https://acct.zapier.georgelambert.org/' },
-  { file: 'mw.png', url: 'https://mw.zapier.georgelambert.org/health' },
-  { file: 'fleet.png', url: 'https://fleet.zapier.georgelambert.org/' },
-  { file: 'docs.png', url: 'https://zapier.georgelambert.org/' },
-  { file: 'git.png', url: 'https://git.georgelambert.org/' },
-];
 
 const browser = await puppeteer.launch({
   executablePath: CHROME,
@@ -37,20 +22,81 @@ const browser = await puppeteer.launch({
   defaultViewport: { width: 1280, height: 800 },
 });
 
-try {
+async function goto(page, url) {
-  for (const d of DOORS) {
+  try {
-    const page = await browser.newPage();
+    await page.goto(url, { waitUntil: 'networkidle2', timeout: 25000 });
-    try {
+  } catch {
-      await page.goto(d.url, { waitUntil: 'networkidle2', timeout: 25000 });
+    await page.goto(url, { waitUntil: 'domcontentloaded', timeout: 15000 }).catch(() => {});
-    } catch {
-      await page.goto(d.url, { waitUntil: 'domcontentloaded', timeout: 15000 }).catch(() => {});
-    }
-    await new Promise((r) => setTimeout(r, 600));
-    const dest = path.join(SHOTS, d.file);
-    await page.screenshot({ path: dest, fullPage: false });
-    process.stdout.write(`wrote ${dest}\n`);
-    await page.close();
   }
+  await wait(700);
+}
+
+async function shot(page, file) {
+  const dest = path.join(SHOTS, file);
+  await page.screenshot({ path: dest, fullPage: false });
+  process.stdout.write(`wrote ${dest}\n`);
+}
+
+try {
+  const page = await browser.newPage();
+
+  await goto(page, 'https://iam.zapier.georgelambert.org/login');
+  await page.waitForSelector('#username', { timeout: 15000 });
+  await page.type('#username', 'admin');
+  await page.type('#password', 'admin-dev-key');
+  await Promise.all([
+    page.waitForNavigation({ waitUntil: 'networkidle2', timeout: 20000 }).catch(() => {}),
+    page.click('button[type="submit"]'),
+  ]);
+  await wait(1200);
+  await shot(page, 'iam.png');
+
+  for (const [file, url] of [
+    ['fleet.png', 'https://fleet.zapier.georgelambert.org/'],
+    ['cs.png', 'https://cs.zapier.georgelambert.org/'],
+    ['sales.png', 'https://sales.zapier.georgelambert.org/'],
+    ['acct.png', 'https://acct.zapier.georgelambert.org/'],
+    ['staff.png', 'https://staff.zapier.georgelambert.org/'],
+    ['login.png', 'https://login.zapier.georgelambert.org/'],
+  ]) {
+    await goto(page, url);
+    await wait(800);
+    await shot(page, file);
+  }
+
+  for (const [file, url] of [
+    ['api.png', 'https://api.zapier.georgelambert.org/health'],
+    ['leaf.png', 'https://leaf.zapier.georgelambert.org/health'],
+    ['zap.png', 'https://zap.zapier.georgelambert.org/health'],
+    ['mw.png', 'https://mw.zapier.georgelambert.org/health'],
+    ['git.png', 'https://git.georgelambert.org/'],
+  ]) {
+    await goto(page, url);
+    await shot(page, file);
+  }
+
+  await goto(page, 'https://portal.zapier.georgelambert.org/portal/');
+  const toggle = await page.$('#auth-toggle');
+  if (toggle) await toggle.click();
+  await wait(300);
+  const name = await page.$('#auth-name');
+  if (name) {
+    const email = `docs-capture-${Date.now()}@example.com`;
+    await page.type('#auth-name', 'Docs Capture');
+    await page.type('#auth-email', email);
+    await page.type('#auth-password', 'DocsCapture-dev-1!');
+    await page.click('#auth-submit');
+    await page.waitForSelector('#shell.on', { timeout: 20000 }).catch(() => {});
+    await wait(1200);
+  }
+  await shot(page, 'portal.png');
+
+  await goto(page, 'https://zapier.georgelambert.org/');
+  await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight));
+  await wait(400);
+  await shot(page, 'docs.png');
+
+  await page.close();
 } finally {
   await browser.close();
 }