UX: dashboard IA — lead with Today / Overdue / Follow-ups due / At-risk, demote intake counters

[alexeygrigorev]

Dashboard IA: lead with Today / Overdue / Follow-ups due / At-risk; demote intake counters

Status: pending
Tags: enhancement, frontend, design, P1
Depends on: #103
Blocks: None

Groomed from the same live UX audit. #4: the dashboard opens on intake counters,
not the four core questions. The first thing on the dashboard is three intake
tiles ("Untriaged intake / Blocked intake / Assistant-ready", all showing 0).
The JTBD four core questions are only partially served by the "Daily Queue":
there are Overdue and At-risk group headers, but no labelled "Today" bucket
(today's non-risk task was filed under "At risk") and no "Follow-ups due"
section as a top-level structure. Evidence:
.tmp/screenshots/ux-audit/03-home-1280.png, 15-dashboard-populated.png.

Scope

Restructure the dashboard information architecture so the operator's four core
questions lead the page, per JTBD 1 and the "Dashboard" screen spec ("Shows
today, overdue, follow-up due, and active workflow risk sections"). Work lives in
backend/src/public/app.js:

• renderDashboard (~lines 1406-1533): demote the intake-risk counters
  (dashboard-intake-risk / loadDashboardIntakeRisk, ~lines 1409-1413) from the
  top of the page to a small secondary strip and/or the Inbox tab. The four core
  buckets (Today / Overdue / Follow-ups due / At-risk workflows) should be the
  primary top-level structure.
• Queue grouping (taskPrimaryQueueGroup / dashboardQueueLabels,
  ~lines 677-705) and the group headers emitted by renderDashboardTaskTable
  (~lines 2221-2267): ensure Today, Overdue, Follow-ups due, and At-risk are all
  present as explicit, labelled sections. Today's genuinely-due-today work must
  appear under "Today", not be swallowed into "At risk" solely because of missing
  evidence at creation time.

Named sections must match the spec vocabulary: Today, Overdue, Follow-ups due,
At-risk workflows.

Presentation/IA change only — no task/bundle API or DynamoDB change. The
assigned-to-me toggle, user picker, and all-team switch must keep working.

Acceptance Criteria

• The dashboard leads with the four core sections — Today, Overdue,
  Follow-ups due, and At-risk (active workflows at risk) — as explicit,
  labelled top-level structure, above intake counters.
• The intake counters (Untriaged intake / Blocked intake / Assistant-ready)
  are demoted to a small secondary strip and/or moved to the Inbox tab; they
  no longer occupy the top of the dashboard.
• A task that is genuinely due today and not at risk appears under "Today",
  not under "At risk".
• "Follow-ups due" is a labelled section that appears (and shows an empty
  state such as "No follow-ups due" when empty), per JTBD 1 acceptance
  ("Empty states tell the operator what is clear").
• Each section keeps the existing per-row behavior from UX: dashboard Daily Queue should surface next-action button, not embed the completion editor #103 (status + one
  next-action button); this issue changes ordering/section structure, not row
  internals.
• Assigned-to-me default, the operator picker, and the all-team switch still
  work and re-group correctly.
• Empty core sections render clear empty states rather than disappearing
  confusingly.

Test Scenarios

Scenario: Four core questions lead the page

Given: Grace opens the dashboard with seeded data
When: the page renders
Then: Today / Overdue / Follow-ups due / At-risk are the first, labelled
sections, and the intake counters are a small strip (or in Inbox), not the top.

Scenario: Today work is under Today

Given: a task due today that is not overdue and not missing required proof
When: the dashboard groups tasks
Then: it appears under "Today", not "At risk".

Scenario: Empty follow-ups is explicit

Given: no follow-ups are due
When: the dashboard renders
Then: the "Follow-ups due" section shows a clear empty state ("No follow-ups
due").

Out of Scope

• Row internals / next-action button and inline-editor removal — covered by UX: dashboard Daily Queue should surface next-action button, not embed the completion editor #103
  (do that first).
• The all-red-at-t=0 problem and how "At risk" classifies freshly-started
  template tasks — covered by UX: freshly-started workflows show all-red at t=0 — add scheduled/not-started state + richer bundle cards #106; this issue only ensures the sections exist and
  Today is not swallowed by pre-existing at-risk logic.
• Workflow-detail checklist (UX: collapse task rows — every task renders a full always-expanded form #102) and template start consolidation (UX: consolidate workflow-start into the Templates library (add Start action; remove scattered launcher forms) #104).
• Task/bundle API and DynamoDB changes.
• Source repos ../dtc-operations, ../datatasks, ../podcast-assistant.

Dependencies

• Depends on UX: dashboard Daily Queue should surface next-action button, not embed the completion editor #103: both edit renderDashboard / renderDashboardTaskTable.
  Sequencing UX: dashboard Daily Queue should surface next-action button, not embed the completion editor #103 first avoids conflicting rework in the same app.js region.
  Do not run UX: dashboard Daily Queue should surface next-action button, not embed the completion editor #103 and UX: dashboard IA — lead with Today / Overdue / Follow-ups due / At-risk, demote intake counters #105 in parallel in the same worktree.
• Feeds UX: freshly-started workflows show all-red at t=0 — add scheduled/not-started state + richer bundle cards #106: UX: freshly-started workflows show all-red at t=0 — add scheduled/not-started state + richer bundle cards #106 refines the at-risk classification these sections rely on.

Verification

• From backend/: npm run typecheck.
• From backend/: npm run test:e2e — at minimum home-dashboard.spec.js; add
  a spec asserting the four core sections render in order and Today is not
  swallowed by At risk.
• Playwright screenshot of the dashboard at 1280px (seed data, login
  grace@datatalks.club / 111) saved under .tmp/screenshots/ux-audit/ and read
  to confirm section order, demoted intake strip, and clear empty states.

[alexeygrigorev]

Software Engineer handoff — #105 dashboard IA

Restructured the dashboard so the operator's four core questions lead the page and demoted the intake counters. Builds directly on #103 (single next-action buttons / renderDashboardNextAction preserved).

Approach

• taskPrimaryQueueGroup (backend/src/public/app.js): renamed the at-risk bucket to At-risk workflows (spec vocabulary) and reordered priority so genuinely due-today work resolves to Today before At-risk workflows (Overdue and Follow-ups due still take precedence). At-risk classification itself is untouched — that's UX: freshly-started workflows show all-red at t=0 — add scheduled/not-started state + richer bundle cards #106.
• renderDashboardTaskTable: refactored from an implicit "header appears when a group has rows" model into explicit buckets. The four core sections — Today, Overdue, Follow-ups due, At-risk workflows — now always render, in that priority order, each with a clear empty state (Nothing due today / No overdue tasks / No follow-ups due / No at-risk workflows). Overflow groups (Waiting, Other) render only when populated, after the core four. Row internals unchanged from UX: dashboard Daily Queue should surface next-action button, not embed the completion editor #103; extracted the per-task and intake rows into helpers.
• Intake follow-ups (dueIntake) now render inside the Follow-ups due section instead of a separate top block.
• renderDashboard: moved the intake counters (dashboard-intake-risk) from the top of the page to a demoted secondary dashboard-intake-strip below the queue. The Inbox tab remains the primary intake surface; the strip keeps the data-testid="dashboard-intake-risk" and its #/inbox links.
• loadDashboardTasks: dropped the aggregate "No queue tasks" early-return so the four sections (with per-section empty states) always render.
• CSS (backend/src/pages/index.html): .dashboard-queue-empty row styling (muted italic, responsive) + .dashboard-intake-strip compact strip styling (desktop + <=760px stacking).

Files changed

• backend/src/public/app.js
• backend/src/pages/index.html
• backend/tests/home-dashboard.test.ts (asset-marker unit test updated to the new section structure)
• backend/e2e/home-dashboard.spec.js (section order/vocabulary updated; 3 new tests)

Tests

• npm run typecheck — pass (exit 0).
• npm test — pass, 1110/1110 unit tests, 0 fail.
• npx playwright test home-dashboard follow-up-actions — 41 passed (home-dashboard incl. 3 new UX: dashboard IA — lead with Today / Overdue / Follow-ups due / At-risk, demote intake counters #105 specs) + follow-up-actions 1 passed (run also confirmed separately).
• npx playwright test intake-inbox — 3 passed (confirms intake follow-up rows still work inside the new Follow-ups due section, and the demoted strip still exposes dashboard-intake-risk).

New/updated E2E coverage:

• Dashboard leads with the four core sections in order and demotes intake counters (#105) — asserts header order ['Today','Overdue','Follow-ups due','At-risk workflows'] and that .dashboard-intake-strip sits after .dashboard-layout in the DOM.
• A due-today, not-at-risk task appears under Today, not At-risk workflows (#105) — walks back to the section header and asserts Today.
• empty queue still leads with the four core sections and clear empty states (#105) — asserts the four empty-state strings.
• Updated the existing overdue/follow-up ordering test and the dense-layout section-visibility loop to the new order/vocabulary.

Screenshots (.tmp/screenshots/issue-105/)

• dashboard-1280.png — populated desktop: sections lead in order Today → Overdue → Follow-ups due → At-risk workflows; due-today task under Today, follow-up-due task under Follow-ups due, missing-evidence task under At-risk workflows; intake counters demoted to the INTAKE strip at the bottom.
• dashboard-390.png — mobile: four labelled sections stack cleanly in order, no overflow, intake strip stacked at the bottom.
• dashboard-empty-1280.png — empty state: all four core sections render with Nothing due today / No overdue tasks / No follow-ups due / No at-risk workflows.

Acceptance criteria

• Leads with the four core sections above intake counters — verified (screenshots + order test).
• Intake counters demoted to a small strip / Inbox — verified (strip below queue, DOM-order test).
• Due-today, not-at-risk task appears under Today — verified (new UX: dashboard IA — lead with Today / Overdue / Follow-ups due / At-risk, demote intake counters #105 spec + Today-before-At-risk priority).
• Follow-ups due labelled section with No follow-ups due empty state — verified (empty-queue spec + screenshot).
• Per-row UX: dashboard Daily Queue should surface next-action button, not embed the completion editor #103 behavior preserved — verified (all UX: dashboard Daily Queue should surface next-action button, not embed the completion editor #103 dashboard specs still pass).
• Assigned-to-me default, operator picker, all-team switch still work — verified (existing toggle/picker specs pass).
• Empty core sections render clear empty states — verified (empty screenshot + spec).

No commit/push per process — ready for Tester and PM acceptance.