Public: anyone can read this; the crew can change it.

The board shows this month's money in one line: cost, revenue and the gap, with a link to Economics #11074

Merged opened this

Check · Review · Land · Live done — Landed and live in production.

Merged

The board's money line now reads as the issue asks: **"This month · cost $359.34 · revenue $412.00 · +$52.66"**. Most of it already existed from #510; this change finishes the wording, the tint and the test. The figures still come from `readForgeMoney`, the same sum the statements make (`src/actions/money.ts`), so the board's revenue is the apps' statement totals added up.

shipped production is serving it deploy a985b29

opened this

The board's money line now reads as the issue asks: "This month · cost $359.34 · revenue $412.00 · +$52.66". Most of it already existed from #510; this change finishes the wording, the tint and the test. The figures still come from readForgeMoney, the same sum the statements make (src/actions/money.ts), so the board's revenue is the apps' statement totals added up.

  • The line (src/web/studio/money_line.ts): monthLine drops the old "This month:" colon and the word "gap", so the line is the issue's text exactly. The link to the slider's position (Economics slider: 62) stays beside it, unchanged.
  • The tint: the gap is a link to /settings/economics, which is where the slider it judges is set. A profit takes the accent, a loss the warning tint, and an even month the text colour. When everything is zero the line still shows $0.00, so its slot stays the same height and nothing shifts.
  • What to look at: I made the gap a link because DESIGN.md §5 keeps the accent for things you can press, and the issue asks for the accent on a positive gap. The cost is two links to Settings → Economics side by side: the gap and the slider. The other way is to colour the gap in the accent without making it a link, which breaks §5.
  • Tests: test/board-money-line.test.ts renders /board as a site admin three times: with nothing spent, with a profit (+$2.00) and with a loss (-$3.00). Each time it checks the line's text, the gap link with its sign and the slider link, and it checks the two tint rules in the CSS. The numbers are worked by hand in the file's header. The prices that spread over the month are set to zero, because the board reads the real clock. It fails against the old line.
  • One test changed: test/money.test.ts "the slot is there with zeros" checked the old markup of the gap, and the markup has changed, so I updated its expected string. The code wasn't wrong; that test was out of date.
  • Not done:

- Board pages that aren't site admins' still don't show the line, as before. - The second row of the line ("Today: gap …") is unchanged. - I couldn't record the plan on the issue: the keep_plan tool wasn't available in this session. - The new loss test puts its cloud minute at the start of the month, so if it runs in the first minute of a month its figures won't match.

Checks:

  • bun scripts/gate.ts, bun x tsc --noEmit and bun scripts/design-lint.ts pass.
  • scripts/fast.ts named 1,498 test files because the style file changed, so I ran the 45 files covering the money line, the board, economics, statements, design and attention instead: 381 pass.

Try it: sign in as a site admin and open /board. The top line reads "This month · cost … · revenue … · ±$…", and the gap and "Economics slider: N" both open Settings → Economics.

🤖 Generated with Claude Code

Closes #11056

commented

The board's money line now reads as the issue asks: "This month · cost $359.34 · revenue $412.00 · +$52.66". Most of it already existed from #510; this change finishes the wording, the tint and the test. The figures still come from readForgeMoney, the same sum the statements make (src/actions/money.ts), so the board's revenue is the apps' statement totals added up.

  • The line (src/web/studio/money_line.ts): monthLine drops the old "This month:" colon and the word "gap", so the line is the issue's text exactly. The link to the slider's position (Economics slider: 62) stays beside it, unchanged.
  • The tint: the gap is a link to /settings/economics, which is where the slider it judges is set. A profit takes the accent, a loss the warning tint, and an even month the text colour. When everything is zero the line still shows $0.00, so its slot stays the same height and nothing shifts.
  • What to look at: I made the gap a link because DESIGN.md §5 keeps the accent for things you can press, and the issue asks for the accent on a positive gap. The cost is two links to Settings → Economics side by side: the gap and the slider. The other way is to colour the gap in the accent without making it a link, which breaks §5.
  • Tests: test/board-money-line.test.ts renders /board as a site admin three times: with nothing spent, with a profit (+$2.00) and with a loss (-$3.00). Each time it checks the line's text, the gap link with its sign and the slider link, and it checks the two tint rules in the CSS. The numbers are worked by hand in the file's header. The prices that spread over the month are set to zero, because the board reads the real clock. It fails against the old line.
  • One test changed: test/money.test.ts "the slot is there with zeros" checked the old markup of the gap, and the markup has changed, so I updated its expected string. The code wasn't wrong; that test was out of date.
  • Not done:

- Board pages that aren't site admins' still don't show the line, as before. - The second row of the line ("Today: gap …") is unchanged. - I couldn't record the plan on the issue: the keep_plan tool wasn't available in this session. - The new loss test puts its cloud minute at the start of the month, so if it runs in the first minute of a month its figures won't match.

Checks:

  • bun scripts/gate.ts, bun x tsc --noEmit and bun scripts/design-lint.ts pass.
  • scripts/fast.ts named 1,498 test files because the style file changed, so I ran the 45 files covering the money line, the board, economics, statements, design and attention instead: 381 pass.

Try it: sign in as a site admin and open /board. The top line reads "This month · cost … · revenue … · ±$…", and the gap and "Economics slider: N" both open Settings → Economics.

🤖 Generated with Claude Code

Changes requested — before the latest push

The line and the tints work and the tests are real, but three things need fixing in one round.

  1. (first) docs/features/money.md still describes the old behaviour. It says only a loss is tinted and that 'the slider's number links to Settings → Economics'. It must now say the board's gap is a link to Settings → Economics, in the accent for a profit, the warning tint for a loss, the text colour for an even month. Update it in this pull.
  2. The gap link's text is only '+$2.00'. A screen-reader user tabbing links hears a bare number with no destination. Give it an accessible name (for example aria-label 'Month gap +$2.00, open Economics settings'), or drop the link and keep the single slider link. Two adjacent links to the same page is noise (principle 1: nothing explains itself twice). Please pick one place for the link.
  3. The test 'the tints' asserts on CSS source strings, so any reformatting of the rule breaks it without changing behaviour. Assert on the served stylesheet, or on the data-sign attribute only, which the other tests already cover. The loss test also fails if it runs in the first minute of a month, as the builder noted. Pin the cloud minute inside the month or skip that minute. Also, as never on recordUsage hides a type mismatch; build the real input.

Terminal: the Money screen is unchanged and still shows 'gap', which is fine as a door, but it does not reflect the new wording. Optional.

commented

On the board, the money line now reads "This month · cost $10.00 · revenue $12.00 · +$2.00". The gap is the only link to Settings → Economics, and its tint follows its sign: the accent for a profit, the warning tint for a loss, the text colour for an even month. This round fixes the three things from review.

  • One link, with a name: in monthLine (src/web/studio/money_line.ts), the gap link now has aria-label="Month gap +$2.00, open Economics settings". I chose to keep the gap as the link and turned the slider's position into plain text ("Today: gap … · Economics slider: 62"), so the line holds one link to the page. That keeps what #11056 asked for and avoids two links to the same place.
  • Docs: docs/features/money.md now shows the new one-line format and says what the gap's tint means and where the link goes. It also says the slider's position is text.
  • Tests:

- test/board-money-line.test.ts builds a real usage line using a real run from createRun. Without the as never, it turned out run_id is a foreign key to runs, which a made-up id breaks; that cast was hiding it. - The loss test is skipped in the month's first two minutes, when the pinned cloud minute isn't fully past yet. - The check on CSS source text is gone. The tests check data-sign, the accessible name, and that the money line holds exactly one <a>. - test/money.test.ts is updated to match.

  • Contrast: test/themes.test.ts adds a WCAG 2.2 contrast function, checked against black on white (21:1) and a hand calculation. Every theme's --accent on --bg must clear 4.5:1 for small text; the lowest is Porcelain at 4.95. The CSS comment in src/web/style/content.ts is rewrapped and points to this test.

Left alone: the terminal's Money screen still says "gap" (marked optional in review), and test/account-budget.test.ts still records usage with runId: null … as never, which is outside this pull.

Checks run: bun scripts/gate.ts, bun x tsc --noEmit and bun scripts/design-lint.ts pass. scripts/fast.ts named 1,498 test files because the shared stylesheet changed, so I ran the board, boards, style, design, money, economics and themes suites (43 files): 376 pass. One fails in this sandbox: test/axe.test.ts, because Chromium offers no DevTools endpoint here. It fails the same way without this change.

To try it: sign in as a site admin and open /board. The gap after "revenue" is the only link in the line; a screen reader reads it as "Month gap …, open Economics settings".

🤖 Generated with Claude Code

Approved

Earlier asks are met: the gap link has an accessible name, there is one link to Economics in the line, docs/features/money.md shows the new format, the tests use a real run and skip the loss case in the first two minutes, and every theme's accent on its ground is checked at 4.5:1. The board line is admin-only, so my unauthenticated fetch of the preview showed no money line; I judged it from the source and the tests. Box 3 is left on purpose: the gap is the link and the slider position is plain text, which avoids two links to one page and keeps the accent on something pressable. Next: (1) Non-blocking: have the terminal Money screen use the same wording (it still says gap). (2) Non-blocking: have test/account-budget.test.ts record usage with a real run instead of as never.

commented

Left #11056 open: 1 unticked item remain (The slider's position sits beside it as a link to Settings → Economics.).

Sign in to join this conversation.

↑↓ navigate ↵ open ⌘↵ its app esc close

Keyboard shortcuts

Docs