The Flow card shows its run queued, in its flow or done, and a question's picks, images and answer files #200

Merged
agra merged 2 commits from task/3763-s5-flow-card-and-question-s2-v2-s6-v2 into master 2026-10-31 05:33:37 +02:00
Owner

Tracker: #3763

Step 5 of #3672's planspec: the task page's Flow card as S2-V2, and a step's question as S6-V2.

What it delivers

S2-V2, the Flow card.

  • Three stages across the card: Queued, In its flow, Done, each lit in its state's colour once the flow run reached it.
  • The lit stage's line says where the run stands. Queued: what it is behind (behind #3669), what it follows (after #3670) or what blocks it (blocked by sx #3656, in the blocked tone). In its flow: the step and run it is at (Review · run 4127), or what it asks (the Implementer asks a question). Done: the PR it merged and when. A stage not reached says what comes: starts at Implement, merges into master.
  • "Queued 2nd" links to the Queue page with the run selected (/queue?run=<id>). Step 6 builds that page.
  • Each run line reads state · stream · runner · duration. The stream opens the stream. The runner opens the Runners page with that runner selected (/runners?runner=<id>: the card is marked and scrolled into view). What the run left (its PR, push, gates and summary) sits on the line under it.
  • Stop stays in the card's ⋯ menu, and stops a queued run too.

S6-V2, the question.

  • A step's options show as picks, with the recommended one marked. Its images show inline.
  • The picked option rides in the answer box as a chip, beside your words and the images or clips you attach (chosen, dropped or pasted, then uploaded to the task).
  • The button is Submit | Suggest. Submit sends answer, option and files. Suggest opens a dialog that picks the model of the agent that suggests an answer, and sends /propose with it. The answer you drafted stays.
  • A proposal's option arrives picked.

The design system's StageTrack takes a linked name and a line with links. SplitButton can hold its action while its second mode stays open. tokens.json gains size-answer-file, and height-shot also sizes a question's image.

Goldens

New, in Chromium, light and dark at 1280×800 and 390×844 (web/e2e/work-the-flows.spec.ts-snapshots/):

  • flow-queued-behind: queued 2nd, behind the run ahead
  • flow-queued-blocked: queued 3rd, blocked by another task
  • flow-at-step: in its flow at Review and its run
  • needs-you-question (re-recorded): waiting with a question
  • flow-done: done, the PR merged
  • question-picks: the S6-V2 question with a recommended pick, an inline image and an attached image

Re-recorded because they show the Flow card:

  • work-the-flows.spec.ts, Chromium: dispatch-task-menu, dispatch-dialog, dispatch-roles, dispatch-roles-cut, flow-blocked, flow-named, flow-refused, flow-resumed, flow-stopped, flow-unmet, needs-you-proposal, needs-you-proposed-stop, needs-you-run-limit, needs-you-stop-proposed
  • work-the-flows.spec.ts, WebKit: dispatch-dialog, from a full run of playwright.webkit.config.ts
  • surfaces.spec.ts: task-asks, task-blocked, task-run-strip

Every Chromium golden came from one full run of playwright.config.ts (789 passed).

Tests

  • flow-runs.test.ts: the stages for queued behind, queued next, queued blocked over followed, at a step and at the Orchestrator's run, waiting with a question, done by a merged PR, and stopped while queued. Also the run line's runner link and ordinal.
  • StageTrack.test.ts, SplitButton.test.ts, router.test.ts: a linked stage name and line, a split button holding only its action, and /runners?runner=.
  • work-the-flows.spec.ts:
    • Submit's request body carries answer, option and files, and the answered event records all three.
    • Suggest's dialog sends /propose with the picked model and keeps the drafted answer.
    • A proposal's option arrives picked.
    • "Queued 2nd" leads to /queue?run=<id>, and the runner to /runners?runner=<id> with that runner selected.
    • Stop of a queued run moves the run behind it up.

Gates

At head 68b1b195:

  • sak-gate full, gate run 2: passed. That covers the sx build and tests, the release and its test, the deploy contract, npm run build (svelte-check, vitest with #3682's design check, vite), and Playwright: 789 passed in playwright.config.ts and 10 in playwright.runner.config.ts.
  • npm run design-check: 0 findings.
  • playwright.webkit.config.ts, which no gate runs: 1 passed, after re-recording dispatch-dialog.
Tracker: [#3763](https://sak.swipelab.com/tasks/3763) Step 5 of [#3672](https://sak.swipelab.com/tasks/3672)'s planspec: the task page's Flow card as S2-V2, and a step's question as S6-V2. ## What it delivers **S2-V2, the Flow card.** - Three stages across the card: Queued, In its flow, Done, each lit in its state's colour once the flow run reached it. - The lit stage's line says where the run stands. Queued: what it is behind (`behind #3669`), what it follows (`after #3670`) or what blocks it (`blocked by sx #3656`, in the blocked tone). In its flow: the step and run it is at (`Review · run 4127`), or what it asks (`the Implementer asks a question`). Done: the PR it merged and when. A stage not reached says what comes: `starts at Implement`, `merges into master`. - "Queued 2nd" links to the Queue page with the run selected (`/queue?run=<id>`). Step 6 builds that page. - Each run line reads state · stream · runner · duration. The stream opens the stream. The runner opens the Runners page with that runner selected (`/runners?runner=<id>`: the card is marked and scrolled into view). What the run left (its PR, push, gates and summary) sits on the line under it. - Stop stays in the card's ⋯ menu, and stops a queued run too. **S6-V2, the question.** - A step's options show as picks, with the recommended one marked. Its images show inline. - The picked option rides in the answer box as a chip, beside your words and the images or clips you attach (chosen, dropped or pasted, then uploaded to the task). - The button is Submit | Suggest. Submit sends `answer`, `option` and `files`. Suggest opens a dialog that picks the model of the agent that suggests an answer, and sends `/propose` with it. The answer you drafted stays. - A proposal's option arrives picked. The design system's StageTrack takes a linked name and a line with links. SplitButton can hold its action while its second mode stays open. tokens.json gains `size-answer-file`, and `height-shot` also sizes a question's image. ## Goldens New, in Chromium, light and dark at 1280×800 and 390×844 (`web/e2e/work-the-flows.spec.ts-snapshots/`): - `flow-queued-behind`: queued 2nd, behind the run ahead - `flow-queued-blocked`: queued 3rd, blocked by another task - `flow-at-step`: in its flow at Review and its run - `needs-you-question` (re-recorded): waiting with a question - `flow-done`: done, the PR merged - `question-picks`: the S6-V2 question with a recommended pick, an inline image and an attached image Re-recorded because they show the Flow card: - `work-the-flows.spec.ts`, Chromium: `dispatch-task-menu`, `dispatch-dialog`, `dispatch-roles`, `dispatch-roles-cut`, `flow-blocked`, `flow-named`, `flow-refused`, `flow-resumed`, `flow-stopped`, `flow-unmet`, `needs-you-proposal`, `needs-you-proposed-stop`, `needs-you-run-limit`, `needs-you-stop-proposed` - `work-the-flows.spec.ts`, WebKit: `dispatch-dialog`, from a full run of `playwright.webkit.config.ts` - `surfaces.spec.ts`: `task-asks`, `task-blocked`, `task-run-strip` Every Chromium golden came from one full run of `playwright.config.ts` (789 passed). ## Tests - `flow-runs.test.ts`: the stages for queued behind, queued next, queued blocked over followed, at a step and at the Orchestrator's run, waiting with a question, done by a merged PR, and stopped while queued. Also the run line's runner link and `ordinal`. - `StageTrack.test.ts`, `SplitButton.test.ts`, `router.test.ts`: a linked stage name and line, a split button holding only its action, and `/runners?runner=`. - `work-the-flows.spec.ts`: - Submit's request body carries `answer`, `option` and `files`, and the `answered` event records all three. - Suggest's dialog sends `/propose` with the picked model and keeps the drafted answer. - A proposal's option arrives picked. - "Queued 2nd" leads to `/queue?run=<id>`, and the runner to `/runners?runner=<id>` with that runner selected. - Stop of a queued run moves the run behind it up. ## Gates At head `68b1b195`: - `sak-gate full`, gate run 2: passed. That covers the sx build and tests, the release and its test, the deploy contract, `npm run build` (svelte-check, vitest with #3682's design check, vite), and Playwright: 789 passed in `playwright.config.ts` and 10 in `playwright.runner.config.ts`. - `npm run design-check`: 0 findings. - `playwright.webkit.config.ts`, which no gate runs: 1 passed, after re-recording `dispatch-dialog`.
StageTrack takes an href for a stage whose name leads somewhere, and a
snippet for a line that names tasks as links. SplitButton takes
modeDisabled, so its action can wait on what it sends while its second
mode stays open.
S2-V2: the card's three stages, Queued, In its flow and Done, light the
one the flow run reached. Its line says what the run is behind, follows
or is blocked by, the step and run it is at, what it asks, or the PR it
merged. "Queued 2nd" leads to the Queue page with the run selected. A run
line reads state · stream · runner · duration, the runner leading to the
Runners page with that runner selected, and what the run left on the
line under it.

S6-V2: a question's options are picks with the recommended one marked,
and its images show inline. The picked option rides in the answer box as
a chip beside the words and the images or clips attached. Submit sends
answer, option and files; Suggest opens a dialog that picks the
Proposer's model and sends /propose, keeping the answer drafted. A
proposal's option arrives picked.

Goldens added in Chromium, light and dark at 1280x800 and 390x844:
flow-queued-behind, flow-queued-blocked, flow-at-step, flow-done and
question-picks. Re-recorded because they show the card: dispatch-task-menu,
dispatch-dialog (Chromium and WebKit), dispatch-roles, dispatch-roles-cut,
flow-blocked, flow-named, flow-refused, flow-resumed, flow-stopped,
flow-unmet and the needs-you scenes in work-the-flows.spec.ts, and
task-asks, task-blocked and task-run-strip in surfaces.spec.ts.
agra merged commit 5250bed8f6 into master 2026-10-31 05:33:37 +02:00
Sign in to join this conversation.
No reviewers
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
sx/sak!200
No description provided.