Public: anyone can read this; the crew can change it.
Settings › Confirms, what the forge's agent waits for your yes on, speaks the home page's language #9986
Check · Review · Land · Live done — Landed and live in production.
mason/forge:mason/9951-settings-confirms-what-the-forge-s-agent → main 2 commits fork 1 thread · 1 unresolved
2 files
changed +98
−27
src/web/pages/confirms.ts +25 −27
| @@ -15,7 +15,7 @@ import { settingsLayout, signInFirst, forbiddenPage } from "../chrome.ts"; | ||
| 15 | 15 | import { readForm } from "../form.ts"; |
| 16 | 16 | import { html, type Html } from "../html.ts"; |
| 17 | 17 | import { flashTo, page } from "../layout.ts"; |
| 18 | import { btn, card, empty, icon, listCard, messageText, row, time } from "../ui.ts"; | |
| 18 | import { btn, icon, messageText, row, time } from "../ui.ts"; | |
| 19 | 19 | import { accountSections } from "./origins.ts"; |
| 20 | 20 | |
| 21 | 21 | const BACK = "/settings/confirms"; |
| @@ -29,27 +29,25 @@ function confirmsPage(ctx: Ctx, shown?: Html): Response { | ||
| 29 | 29 | ten minutes at most. A yes does it once, as you. |
| 30 | 30 | </p> |
| 31 | 31 | ${shown ?? null} |
| 32 | ${waiting.length === 0 | |
| 33 | ? empty({ icon: "check", title: "Nothing waiting", note: "When the agent asks before acting, it shows here." }) | |
| 34 | : listCard( | |
| 35 | waiting.map((w) => | |
| 36 | row({ | |
| 37 | lead: icon("chevronRight"), | |
| 38 | title: w.does, | |
| 39 | meta: html`asked ${time(w.createdAt)} · until ${time(w.expiresAt)} · full arguments`, | |
| 40 | // The row folds open on every argument as the call will run; the yes sits beside it. | |
| 41 | fold: { | |
| 42 | id: `confirm-${w.id}`, | |
| 43 | open: false, | |
| 44 | body: html`<div class="card-body">${messageText(w.arguments)}</div>`, | |
| 45 | }, | |
| 46 | after: html`<form class="row-actions" method="post" action="${BACK}/${w.id}"> | |
| 47 | ${btn("Yes", { variant: "primary", size: "sm", icon: "check", label: `Yes: ${w.tool}` })} | |
| 48 | </form>`, | |
| 49 | }), | |
| 50 | ), | |
| 51 | { head: html`${icon("lock")}<h2>Waiting for your yes</h2>` }, | |
| 52 | )}`; | |
| 32 | <section class="settings-block" id="waiting"> | |
| 33 | <h2>Waiting for your yes</h2> | |
| 34 | ${waiting.length === 0 | |
| 35 | ? html`<p class="muted">Nothing waiting: when the agent asks before acting, it shows here.</p>` | |
| 36 | : html`<ul class="list setting-list" id="confirms-list"> | |
| 37 | ${waiting.map((w) => | |
| 38 | row({ | |
| 39 | lead: icon("chevronRight"), | |
| 40 | title: w.does, | |
| 41 | meta: html`asked ${time(w.createdAt)} · until ${time(w.expiresAt)} · full arguments`, | |
| 42 | // The row folds open on every argument as the call will run; the yes sits beside it. | |
| 43 | fold: { id: `confirm-${w.id}`, open: false, body: html`<div class="confirm-args">${messageText(w.arguments)}</div>` }, | |
| 44 | after: html`<form class="row-actions" method="post" action="${BACK}/${w.id}"> | |
| 45 | ${btn("Yes", { variant: "primary", size: "sm", icon: "check", label: `Yes: ${w.tool}` })} | |
| 46 | </form>`, | |
| 47 | }), | |
| 48 | )} | |
| 49 | </ul>`} | |
| 50 | </section>`; | |
| 53 | 51 | return page({ |
| 54 | 52 | ctx, |
| 55 | 53 | title: "Confirms", |
| @@ -82,10 +80,10 @@ export async function confirmYes(ctx: Ctx): Promise<Response> { | ||
| 82 | 80 | if (ASKING[tool]?.once === undefined) return flashTo(ctx, BACK, { tone: "success", message: `Done: ${tool}.${undo}` }); |
| 83 | 81 | return confirmsPage( |
| 84 | 82 | ctx, |
| 85 | card( | |
| 86 | html`<p class="muted small">Shown this once; copy it now. It is not kept in the conversation.</p> | |
| 87 | <pre class="mono">${JSON.stringify(yes.result, null, 2)}</pre>`, | |
| 88 | { head: html`${icon("check")}<h2>Done: ${tool}</h2>` }, | |
| 89 | ), | |
| 83 | html`<section class="settings-block" id="done"> | |
| 84 | <h2>Done: ${tool}</h2> | |
| 85 | <p class="muted small">Shown this once; copy it now. It is not kept in the conversation.</p> | |
| 86 | <pre class="mono">${JSON.stringify(yes.result, null, 2)}</pre> | |
| 87 | </section>`, | |
| 90 | 88 | ); |
| 91 | 89 | } |
test/confirms-language.test.ts added +73
| @@ -0,0 +1,73 @@ | ||
| 1 | /** Settings › Confirms speaks the home page's language: a block of rows, not a card (#9951). */ | |
| 2 | import { afterAll, beforeAll, expect, test } from "bun:test"; | |
| 3 | import { mkdtemp, rm } from "node:fs/promises"; | |
| 4 | import { tmpdir } from "node:os"; | |
| 5 | import { join } from "node:path"; | |
| 6 | import { createApp, type App } from "../src/app.ts"; | |
| 7 | import { createRepo } from "../src/actions/repos.ts"; | |
| 8 | import { createUser, getUserByName } from "../src/core/users.ts"; | |
| 9 | import { createSession } from "../src/core/sessions.ts"; | |
| 10 | import { mintViaToken } from "../src/core/via_token.ts"; | |
| 11 | import { serve, type Servers } from "../src/http/server.ts"; | |
| 12 | import { seedAdmin } from "./helpers/admin.ts"; | |
| 13 | ||
| 14 | let dataDir = ""; | |
| 15 | let app: App, servers: Servers; | |
| 16 | let admin = "", plain = "", repo = "", token = ""; | |
| 17 | ||
| 18 | const main = (page: string) => page.slice(page.indexOf("<main"), page.indexOf("</main>")); | |
| 19 | const get = (path: string, cookie: string) => fetch(`${servers.url}${path}`, { headers: { cookie } }); | |
| 20 | ||
| 21 | beforeAll(async () => { | |
| 22 | dataDir = await mkdtemp(join(tmpdir(), "forge-confirms-lang-")); | |
| 23 | app = createApp({ dataDir, port: 0 }); | |
| 24 | servers = await serve(app); | |
| 25 | const a = await seedAdmin(app, { username: "alice", email: "[email protected]", password: "correct-horse-battery" }); | |
| 26 | if (!a.ok) throw new Error(a.error); | |
| 27 | const b = await createUser(app.db, { origin: "seed", trusted: true, username: "bobby", email: "[email protected]", password: "correct-horse-battery" }); | |
| 28 | if (!b.ok) throw new Error(b.error); | |
| 29 | const alice = getUserByName(app.db, "alice")!; | |
| 30 | admin = `forge_session=${createSession(app.db, alice.id).token}`; | |
| 31 | plain = `forge_session=${createSession(app.db, getUserByName(app.db, "bobby")!.id).token}`; | |
| 32 | const made = await createRepo(app, alice, { name: "r1", visibility: "public" }); | |
| 33 | if (!made.ok) throw new Error(String(made.error)); | |
| 34 | repo = "alice/r1"; | |
| 35 | const minted = mintViaToken(app.db, alice.id, "conversation:k1", "", new Date(Date.now() + 10 * 60_000).toISOString()); | |
| 36 | if (!minted.ok) throw new Error(minted.error); | |
| 37 | token = minted.value.token; | |
| 38 | }); | |
| 39 | afterAll(async () => { | |
| 40 | servers.stop(); | |
| 41 | app.close(); | |
| 42 | await rm(dataDir, { recursive: true, force: true }); | |
| 43 | }); | |
| 44 | ||
| 45 | test("an empty queue says so in one line, no card", async () => { | |
| 46 | const m = main(await (await get("/settings/confirms", admin)).text()); | |
| 47 | expect(m).not.toContain('class="card'); | |
| 48 | expect(m).toMatch(/<section class="settings-block" id="waiting">\s*<h2>Waiting for your yes<\/h2>/); | |
| 49 | expect(m).toContain("Nothing waiting"); | |
| 50 | expect(m).not.toContain('<ul class="list'); | |
| 51 | }); | |
| 52 | ||
| 53 | test("a waiting ask is a row in a .list with its same-origin Yes form", async () => { | |
| 54 | const res = await fetch(`${servers.url}/mcp`, { | |
| 55 | method: "POST", | |
| 56 | headers: { "content-type": "application/json", accept: "application/json, text/event-stream", authorization: `Bearer ${token}` }, | |
| 57 | body: JSON.stringify({ jsonrpc: "2.0", id: 1, method: "tools/call", params: { name: "archive", arguments: { repo, archived: true, dryRun: false } } }), | |
| 58 | }); | |
| 59 | const asked = JSON.parse(((await res.json()) as any).result.content[0].text); | |
| 60 | const m = main(await (await get("/settings/confirms", admin)).text()); | |
| 61 | expect(m).not.toContain('class="card'); | |
| 62 | expect(m).toMatch(/<section class="settings-block" id="waiting">\s*<h2>Waiting for your yes<\/h2>/); | |
| 63 | expect(m).toMatch(/<ul class="list[^"]*" id="confirms-list">/); | |
| 64 | expect(m).toContain("archive or wake a repository"); | |
| 65 | expect(m).toMatch(new RegExp(`<form class="row-actions" method="post" action="/settings/confirms/${asked.needs_confirm}">`)); | |
| 66 | expect(m).not.toContain("Nothing waiting"); | |
| 67 | // another person's page lists none of it | |
| 68 | expect(main(await (await get("/settings/confirms", plain)).text())).not.toContain(asked.needs_confirm); | |
| 69 | }); | |
| 70 | ||
| 71 | test("a non-admin gets the one 404 on the admin pages", async () => { | |
| 72 | expect((await get("/settings/accounts", plain)).status).toBe(404); | |
| 73 | }); |
Principle 6/7: .confirm-args has no CSS anywhere; give it a rule or reuse an existing fold-body class, and list it in docs/design/areas/.