Settings › Tokens, Crew, Subscriptions and Usage get the Security page's rewrite, each measurably shorter #9617

Tokens, Crew, Subscriptions and Usage now use rows instead of boxes, with plain words. Visible words are lower on every page I measured, but I did not measure rendered height and I have no light/dark looks at 1440 and 390. This sandbox has no browser, so the "rendered height" and "looks on the pull" boxes in the issue are not done. I also could not call keep_plan, because it isn't available here.

I checked tsc, scripts/gate.ts, scripts/design-lint.ts and the 11 test files covering these pages (54 tests). All pass. The other suites were not run here.

Words before and after (visible text in <main>, seeded fixture with one token, two subscriptions, and many routes on Usage):

• Tokens (proposal-tokens.ts): one status-row per token, with the revoke action on the same row. The intro is one sentence and the card is gone.
• Subscriptions (subscriptions.ts): "Where each is used" is a list of rows. The footnote paragraph, the long hints and the card around "Add one" are cut.
• Crew subscriptions table (grantsSection in subscriptions.ts): the card is gone and the footer is one line. The seeded fixture had no agents on the crew, so its words are not in the settings-page count.
• Crew (crew-settings.ts): this file only holds the form handlers. The crew UI is drawn in src/web/studio/crew.ts, which I left alone, so I shortened the flash messages here instead. A message that told people what to do next, such as "Assign it an issue and it starts", is now one short line.
• Usage (usage.ts): "By role" and "By surface" now list only non-zero counts. That accounts for most of the drop. The intro is one line and the card is gone. usage-tabs.ts is unchanged.

I left three things out: the crew card in studio/crew.ts, the Spend, Capacity and Telemetry tabs, and any change to the CSS.

To try it, sign in as an admin and open /settings/subscriptions and /settings/usage. Open /<owner>/<repo>/settings for the proposal tokens and the crew subscriptions table.

Closes #9583

Tokens, Crew, Subscriptions and Usage now use rows instead of boxes, with plain words. Visible words are lower on every page I measured, but I did not measure rendered height and I have no light/dark looks at 1440 and 390. This sandbox has no browser, so the "rendered height" and "looks on the pull" boxes in the issue are not done. I also could not call keep_plan, because it isn't available here.

I checked tsc, scripts/gate.ts, scripts/design-lint.ts and the 11 test files covering these pages (54 tests). All pass. The other suites were not run here.

Words before and after (visible text in <main>, seeded fixture with one token, two subscriptions, and many routes on Usage):

• Tokens (proposal-tokens.ts): one status-row per token, with the revoke action on the same row. The intro is one sentence and the card is gone.
• Subscriptions (subscriptions.ts): "Where each is used" is a list of rows. The footnote paragraph, the long hints and the card around "Add one" are cut.
• Crew subscriptions table (grantsSection in subscriptions.ts): the card is gone and the footer is one line. The seeded fixture had no agents on the crew, so its words are not in the settings-page count.
• Crew (crew-settings.ts): this file only holds the form handlers. The crew UI is drawn in src/web/studio/crew.ts, which I left alone, so I shortened the flash messages here instead. A message that told people what to do next, such as "Assign it an issue and it starts", is now one short line.
• Usage (usage.ts): "By role" and "By surface" now list only non-zero counts. That accounts for most of the drop. The intro is one line and the card is gone. usage-tabs.ts is unchanged.

I left three things out: the crew card in studio/crew.ts, the Spend, Capacity and Telemetry tabs, and any change to the CSS.

To try it, sign in as an admin and open /settings/subscriptions and /settings/usage. Open /<owner>/<repo>/settings for the proposal tokens and the crew subscriptions table.

The gate failed only because no commit message had a "Try:" line. I added an empty commit that has one and pushed it. I didn't re-run the gate, tsc or the tests locally, because no code changed. The forge's check will run them on this push.

The Try line reads: "open /settings/tokens, /settings/crew, /settings/subscriptions and /settings/usage on the preview".

I first tried to amend the original commit and force-push, but the force-push was denied. That is why the fix is a second commit rather than a reworded one.

Pull description: The Tokens, Crew, Subscriptions and Usage settings pages now use rows instead of boxes, with plainer wording and fewer elements. Try: open /settings/tokens, /settings/crew, /settings/subscriptions and /settings/usage on the preview.

The failing test was checking text I had removed, so I changed the test, not the page. I pushed the fix. test/tokens.test.ts now passes (13 of 13) and tsc is clean. I did not re-run the rest of the suite locally.

The Subscriptions page used to say "counted by Claude's tokenizer" in a paragraph. I cut that paragraph in the rewrite. Each token count already carries a tooltip saying "as counted by Claude's tokenizer", so the information is still on the page. The test now asserts the tooltip text instead. I matched only as counted by Claude because the apostrophe is HTML-escaped in the rendered page.

Pull description: The Tokens, Crew, Subscriptions and Usage settings now use rows instead of boxes, with plainer wording and fewer elements. The Subscriptions page no longer has a prose note about the tokenizer. Each token count's tooltip says it, and test/tokens.test.ts asserts that. Try: open /settings/subscriptions on the preview and hover a window's token count.

I fixed items 3, 4 and 5 and pushed. I did not do items 1 and 2: the pull description has no before/after heights or word counts, and there are no looks.

Fixed

• Item 4 (grant wording): the grants form now reads "Nothing ticked uses the wider grant: …" (src/web/pages/subscriptions.ts).
• Item 5 (~ legend): each subscription's window line now has a tooltip: "A figure marked ~ is inferred from what the crew's runs spent; the rest the provider said." I chose a tooltip over a footnote to keep the page short.
• Item 3 (Routes table): I wrapped it in table-scroll (src/web/pages/usage.ts) so it scrolls instead of overflowing at 390. I did not convert it to rows, because the table has five columns (pattern, count, role, surface, last use) that read as a table.

- The crew grants matrix stays a table because it is a subscription-by-agent matrix.

Not done

• Item 1 (height and word counts): I can't measure rendered height here, since there is no browser in the sandbox. I also have no recorded "before" figures for Crew or Tokens. Crew is the page the reviewer says doesn't meet "measurably shorter": src/web/studio/crew.ts is untouched, so only its flash messages changed. I'm not going to claim a figure I haven't measured.
• Item 2 (looks at 1440 and 390, light and dark): I can't take screenshots from this sandbox.

Both need a person with a browser on the preview.

Checks: tsc and design-lint are clean. bun test over the tokens, crew-settings, usage and subscription tests passes (56 tests, 0 failures). I couldn't use scripts/fast.ts to pick tests, because it named 1263 files, about 109 minutes. The forge runs the full check on this push.

Pull description: The Tokens, Crew, Subscriptions and Usage settings now use rows instead of boxes, with plainer wording and fewer elements. Subscription window lines explain ~ in a tooltip. The grants form says "Nothing ticked uses the wider grant: …". The Routes table scrolls at 390. Left out: before/after height and word counts, and looks at 1440 and 390 in light and dark. I couldn't measure them in the sandbox, and the Crew page's gain is mostly wording, because the crew UI in src/web/studio/crew.ts is untouched. Try: open /settings/subscriptions, hover a window line, and open /settings/routes at 390 wide on the preview.

Tokens, Crew, Subscriptions and Usage in Settings now follow the Security page's rewrite: rows instead of boxes, and fewer, plainer words. This push rewrites the Crew section itself (src/web/studio/crew.ts). The earlier commits on this pull had only shortened the Crew flash messages.

Crew. The settings page drew every crew member twice: once under its seat in "Your team", and again in a separate "Crew" card that added the model and brief. That second card is gone. Each member row under Planners, Builders and Reviewers now shows the model and brief itself. An empty crew gets one line in the team card ("Nobody yet." and what to do), not a separate empty-state box. The auto-mode intro is shorter.

Measured with the same seed before (main) and after (this branch): an admin, a repository, two agents on the crew, two subscriptions and one proposal token. Counts come from the server-rendered HTML, parsed with happy-dom (already a dev dependency), ignoring scripts, sr-only and hidden text, and <option> text.

What's still missing. The table has no rendered heights, and there are no looks at 1440 and 390 in light and dark, so review item 2 is still not met. The sandbox refuses unix sockets, and headless Chromium stops at startup without one (process_singleton_posix.cc: socket() failed: Operation not permitted). Card and row counts stand in for height here. The forge's own looks also can't fill the gap: they are taken at 390 and 1280, as the owner, and only of the pages forge.json lists, which don't include these. Someone with a browser needs to open the preview and take these looks before this is merged.

Test change. The role-change test in test/studio-shipping.test.ts was wrong, so I changed it. It checked toContain("reviews"), and the duplicate card made that true even when nothing changed. Keeper only declares the builder role, so the change to reviewer is refused and keeper stays a builder. The test now checks that keeper appears exactly once, under the seat it actually holds, and that there is no "Crew" card. It fails against the old crew.ts and passes now.

Found, not fixed. When crewRoleUpdate asks for a role the agent doesn't declare, setCrewRole refuses it, but the route still says "keeper is a reviewer here." That deserves its own issue.

Checks run: scripts/gate.ts, tsc --noEmit and scripts/design-lint.ts pass, and 168 tests pass in 16 files (studio-shipping, web-apps, crew-settings-doors, crew-seats, hosted-child-crew, settings, studio and others). scripts/fast.ts named 1270 files, too many to run here, so I picked the files that cover these pages; the full suite was not run.

To try it, sign in to the preview as an admin. Open /<owner>/<repo>/settings#crew and check that each agent appears once, under its seat, with its model. Then open /settings/subscriptions and /settings/usage.

🤖 Generated with Claude Code

Tokens, Crew, Subscriptions and Usage in Settings now follow the Security page's rewrite: rows instead of boxes, and fewer, plainer words. This push merges main, which had changed the same Crew section in #9615.

The merge. #9615 changed the separate "Crew" card from listCard to a plain <ul class="list setting-list"> and added a data-crew-settings hook on #crew, so long names wrap on a 390 px phone. This branch deletes that card, so its body stays deleted. The hook stays on #crew, and main's CSS rule now applies to the team lists. Main's new test/crew-settings-fit.test.ts passes against the merged code. Its two browser tests skipped here because Chromium can't start in this sandbox.

Crew. The settings page drew every crew member twice: once under its seat in "Your team", and again in a separate "Crew" card that added the model and brief. That second card is gone. Each member row under Planners, Builders and Reviewers now shows the model and brief itself. An empty crew gets one line in the team card ("Nobody yet." and what to do), not a separate empty-state box. The auto-mode intro is shorter.

Measured with the same seed before (main) and after (this branch): an admin, a repository, two agents on the crew, two subscriptions and one proposal token. Counts come from the server-rendered HTML, parsed with happy-dom (already a dev dependency), ignoring scripts, sr-only and hidden text, and <option> text. These figures were taken before this merge; the merge changes no visible text.

What's still missing. The table has no rendered heights, and there are no looks at 1440 and 390 in light and dark, so review item 2 is still not met. The sandbox refuses unix sockets, and headless Chromium stops at startup without one (socket() failed: Operation not permitted). Card and row counts stand in for height here. The forge's own looks also can't fill the gap: they are taken at 390 and 1280, as the owner, and only of the pages forge.json lists, which don't include these. Someone with a browser needs to open the preview and take these looks before this is merged.

Test change. The role-change test in test/studio-shipping.test.ts was wrong, so I changed it. It checked toContain("reviews"), and the duplicate card made that true even when nothing changed. Keeper only declares the builder role, so the change to reviewer is refused and keeper stays a builder. The test now checks that keeper appears exactly once, under the seat it actually holds, and that there is no "Crew" card. It fails against the old crew.ts and passes now.

Found, not fixed. When crewRoleUpdate asks for a role the agent doesn't declare, setCrewRole refuses it, but the route still says "keeper is a reviewer here." That deserves its own issue.

Checks after the merge: scripts/gate.ts, tsc --noEmit and scripts/design-lint.ts pass. The 10 test files covering these pages give 128 passed, 2 skipped (the browser tests above) and 0 failed; they include crew-settings-fit, crew-settings-doors, crew-seats, studio-shipping, web-apps and settings. The full suite was not run here.

To try it, sign in to the preview as an admin. Open /<owner>/<repo>/settings#crew and check that each agent appears once, under its seat, with its model. Then open /settings/subscriptions and /settings/usage.

🤖 Generated with Claude Code

Left #9583 open: 2 unticked items remain (The pull states each page's rendered height and word count before and after, all four lower.; Existing tests still pass; looks at 1440 and 390, light and dark, are on the pull.).