Skip to content

feat(web): design pass 8: provider tabs under the header, GCP lab header, even KPI tiles - #1830

Merged
Makisuo merged 4 commits into
ui-pass-7from
ui-pass-8
Oct 25, 2026
Merged

Makisuo merged 4 commits into
ui-pass-7from
ui-pass-8

Conversation

@Makisuo

@Makisuo Makisuo commented Oct 25, 2026 •

Copy link
Copy Markdown
Collaborator

Design pass 8, stacked on #1829 (pass 7). Two independent agents checked it blind: one scored a rubric, the other hunted regressions and found none. Icons and data colours are untouched.

Judges

Category Before After
Typography 7.0 7.0
Hierarchy 7.0 7.5
Spacing & density 6.5 7.0
Color & contrast 7.5 7.5
Iconography 7.5 7.5
Consistency & polish 6.5 7.0
Clarity 7.0 7.5
Overall 7.0 7.3

Changes

Provider tabs under the header. AWS, GCP and Cloudflare now pass their resource tabs to dashboardPage's tabs slot, so they sit right under the header like every other tabbed page. The body no longer adds about 40px above them.

GCP header. The route and the lab share titleRow (time range and Reload). With the tabs out of the body, the projects strip had collapsed to 2px on the real route too; it is wrapped and fixed. The lab header shows its 12h fixture span as a preset, as the route's default does.

Even KPI tiles. Captions fit one line ("worst signal per zone", "worst signal per service"), so the tile heights match.

Labs: a floating lab switcher no longer covers the last row; the scroll area pads for it.

A worker also added a click handler to the AWS tabs to keep the lab in place. That would have blocked Cmd-click on the real AWS page, so it was reverted before this PR.

Before After

Verification

  • bun run --cwd apps/web typecheck passes, and oxlint is clean.
  • Targeted Vitest: 223 tests across infra integrations, labs, analytics and logs. The GCP lab test now pins that Reload spins, ignores a stale stop, and sends no reads.

🤖 Generated with Claude Code

…der, even KPI tiles

- AWS, GCP and Cloudflare pass their resource tabs to dashboardPage's tabs slot, so they sit right
  under the header like every other tabbed page (the body no longer adds ~40px above them).
- GCP: the route and lab share titleRow (time range, Reload); the projects strip no longer
  collapses to 2px once the tabs left the body. The lab header shows its 12h span as a preset.
- KPI captions fit one line ("worst signal per zone" / "per service"), so tile heights match.
- Labs with a floating switcher pad their scroll area so the bar never covers the last row.
@maple-review-bot

maple-review-bot Bot commented Oct 25, 2026 •

Copy link
Copy Markdown

Maple review

🟢 Confidence 9/10 · safe to merge
Tabs move between the body and the header slot only; the one behaviour change, the lab's versioned Reload spin, has its own test.
no findings · tests partial −1 · risk low

Design pass 8 moves the AWS, Cloudflare and GCP view tabs into the page header's tabs slot, gives the GCP lab the shared title row with a time picker and a versioned Reload spin, and shortens the band captions. Contained to the web app and consistent with every caller; safe to merge.

  • titleRow in the Cloudflare and GCP list views now returns the header's tabs.
  • GCP lab gains a TimeRangePicker and a version-guarded Reload spin in its own update.
  • fleetView and listBody stop drawing the kind/view tabs; headerTabs and viewTabs do.
  • Band captions shortened to "worst signal per …".
What was checked
  • Every caller of the moved tabs passes the header slot: both labs spread titleRow (cloudflare-lab/view.ts:31, gcp-infra-lab/view.ts:64), both routes spread it too (cloudflare/list/view.ts:495, …
  • Dropped linkTabStrip false argument now yields bleed default true, matching its header-slot doc (infra/kit/view-tabs.ts:24).
  • AsyncData.getOrElse/hasData used by headerTabs are existing foldkit APIs, in use elsewhere in the app.

062700a · Updated on every push. Reply "won't fix" to dismiss a finding, or mention @maple-review-bot to ask about one.

@coderabbitai

coderabbitai Bot commented Oct 25, 2026 •

Copy link
Copy Markdown

Review in Change Stack →

Caution

Review failed

The pull request is closed.

Finishing Touches
📝 Generate docstrings
  • Commit to this branch
  • Create a new PR
🧪 Generate unit tests (beta)
  • Commit to this branch
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@Makisuo Makisuo changed the title ui pass 8 feat(web): design pass 8: provider tabs under the header, GCP lab header, even KPI tiles Oct 25, 2026

@devin-ai-integration devin-ai-integration Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✅ Devin Review: No Issues Found

Devin Review analyzed this PR and found no bugs or issues to report.

Devin Review

@maple-review-bot

maple-review-bot Bot commented Oct 25, 2026 •

Copy link
Copy Markdown

Maple review

🟢 Confidence 9/10 · safe to merge
Contained view-only change; the one behavioral rewire (titleRow now carrying tabs) is supplied by every caller I traced.
no findings · tests partial −1 · risk medium

Moves the AWS, GCP and Cloudflare view tabs into dashboardPage's tabs slot, gives the GCP route and lab one shared titleRow, and shortens band captions. The rewire is consistent across every caller and safe to merge.

  • Cloudflare and GCP titleRow now return tabs, spread into dashboardPage by route and lab
  • listBody and gcpListPageParts stop drawing their own tab strip
  • GCP lab gains Reload spin and a time picker in the shared title row
  • Band captions shortened to one line so KPI tiles match height
What was checked
  • Dropped linkTabStrip false relies on bleed = true (page/infra/kit/view-tabs.ts:25), correct for the header slot
  • No caller doubles or loses tabs: Cloudflare route spreads row at cloudflare/list/view.ts:492, lab spreads titleRow at cloudflare-lab/view.ts:31
  • GCP lab's discarded picker outMessage/empty hrefFor matches gcp-workload-lab/update.ts:167-174; ClickedResetTimeRange can't render without a custom range

1d25a5d · Updated on every push. Reply "won't fix" to dismiss a finding, or mention @maple-review-bot to ask about one.

@Makisuo
Makisuo added this pull request to stack #1834 October 25, 2026 16:43
@Makisuo
Makisuo merged commit 48a4c26 into main Oct 25, 2026
21 of 22 checks passed
@Makisuo
Makisuo deleted the ui-pass-8 branch October 25, 2026 16:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant