[Makisuo]

Second sidebars, right rails and filter rails had drifted apart: each drew its own dividers, padding and type size, so the layout looked slightly off next to the app sidebar.

What changed

Settings / Account / Integrations rail

• Rows now match the app sidebar beside them: 32px rows, 12px text, the flush 2px active lane and primary active text (nav-shell.ts).
• Below lg this rail opens as a sheet. It was labelled "Open filters" / "Filters"; a new filtersLabel page option makes it "Open settings" / "Settings" (or "Account settings"); the Kubernetes service rail gets "Services".

Right rails

• The page kit's rail owns the left divider and the width. Anomaly, recommendation and dashboard-history rails drew a second border inside it (a 2px divider), and the 320px ones overflowed the 288px rail. They now pass rightPanelWidth instead.
• Host, container, pod, node and workload detail pages put a bordered card flush inside the rail. "Resource attributes" is now a flat detailRailGroup, like the Cloudflare and GCP rails.
• Dropped the partial bg-card/30 tints (the error issue rail's stopped halfway down).
• The right sheet no longer adds padding around rails that pad their own groups. Both sheets leave room for the close button.

Filter rails (all 16 already use filterSidebarFrame / Header / Body)

• Option labels were meant to be 12px but rendered 14px: the label primitive's sm:text-sm/4 beat text-xs at 640px and up. Pinned with sm:text-xs.
• The header and its rule ended 16px further right than the rows, because the body reserved its own scrollbar gutter. The scroller now extends into the rail's right padding, so the scrollbar sits there and every row, count and chevron shares the header's edge.
• The header rule runs edge to edge across the rail.
• New shared filterSidebarDivider and filterSidebarGroupLabel replace hand-rolled group dividers and headings in logs, replays and web analytics, which used three different spacings.
• Kubernetes service lens rail: removed double padding, rows match the other rails, footer rule is full width.

Screenshots

	Before	After
Settings rail
Settings sheet (900px)
Filter rail
Filter rail (2x)

The local dev org has no telemetry, so the filter rail shots render the real filter components with sample facets inside the live /traces page. The infra, anomaly, recommendation and dashboard-history rails were not rendered with data; they are worth a look on the preview.

Verification

• bun run typecheck in apps/web and apps/local-ui (which reuses the rail lift), effect lint on the changed files: no errors.
• Vitest over shell, filters, settings, integrations, infra, errors, anomalies, recommendations, dashboards, logs, replays, analytics, agent sessions, traces, services: 129 files, 887 tests pass; local-ui shell tests pass.
• An independent review pass over the diff; its two findings (local-ui LiftedRail type, unlabelled Kubernetes rail sheet) are fixed here.

---

^{Need help on this PR? Tag @codesmith-bot with what you need.}

Summary by CodeRabbit

• New Features
  • Filter drawers now use contextual labels such as “Settings,” “Account settings,” and “Services,” including matching trigger and dialog names.
• Style
  • Updated filter sidebars with clearer group headings, edge-to-edge dividers, and adjusted spacing.
  • Refined settings navigation with more compact rows and clearer active states.
  • Updated detail panels and resource attributes with a more consistent rail layout.
  • Adjusted filter and sheet spacing, and kept filter labels compact on small screens.

[coderabbitai]

Caution

Review failed

The pull request is closed.

Walkthrough

This change adds optional labels to filter rails and uses them in filter-sheet triggers and dialog content. It updates shared filter-sidebar controls, resource-attribute panels, and other page layouts. Several page-specific filter rails now provide labels.

Changes: Page rail UI

Layer / File(s)	Summary
Filter rail labels and sheet content apps/web/src/page/kit/dashboard-page.ts, apps/web/src/page/{infra/kubernetes/service,integrations,settings,settings/account}/view.ts, apps/web/src/shell/page-rails.ts, apps/local-ui/src/shell/filter-drawer.ts, apps/web/src/shell/{view-page-sheets,view}.ts, apps/web/src/shell/page-sheets.scene.test.ts	Dashboard page options can provide filter rail labels. The shell reads those labels and uses them in filter-sheet trigger names, titles, and descriptions. The scene test checks that a “Settings” rail opens a “Settings” dialog.
Shared filter-sidebar controls apps/web/src/ui/filters/{filter-sidebar,filter-section}.ts, apps/web/src/page/{agent-sessions/list,analytics,logs/list,replays/list}/view-filters.ts	Shared helpers render filter group labels and dividers. Filter views use the helpers, and filter labels retain text-xs sizing at the sm breakpoint.
Resource-attribute panels apps/web/src/page/infra/kit/resource-attributes.ts, apps/web/src/page/infra/{containers/detail,hosts/detail,kubernetes/node,kubernetes/pod,kubernetes/workload}/...	The resource-attribute card and skeleton render in a “Resource attributes” detail-rail group. Infrastructure detail views use the updated helpers without icon arguments.
Panel and navigation layouts apps/web/src/page/{anomalies/detail,dashboards/view,errors/issue,infra/kubernetes/lens,recommendations,settings/kit}/..., packages/ui/src/components/ui/page-layout.styles.ts	Sidebar and history-panel classes, Kubernetes service-row styles, settings navigation rows, and sheet padding are updated. The recommendation sidebar and dashboard history panel receive their width through page configuration.

Estimated code review effort: 3 (Moderate) | ~25 minutes

Change: Other

Sequence Diagram(s)

sequenceDiagram
  participant SettingsPage
  participant dashboardPage
  participant railOf
  participant filterSheetTrigger
  participant FilterSheet
  SettingsPage->>dashboardPage: provide filtersLabel
  dashboardPage->>railOf: render rail with data-rail-label
  railOf->>filterSheetTrigger: pass lifted rail label
  filterSheetTrigger->>FilterSheet: set trigger name, title, and description

Loading

Merge Risk: Minimal · up to 5853d

The rail changes have no identified merge-blocking risk; normal checks remain appropriate.

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[Makisuo]

F1 fixed in 5853d89: page-sheets.scene.test.ts now renders a page with filtersLabel: "Settings", checks "Open filters" is gone, opens "Open settings" and asserts the dialog named "Settings" holds the rail.

[github-actions]

🍁 Maple PR preview

Note

Preview resources were removed when this pull request closed.

Final commit 5853d89 · View workflow run

[maple-review-bot]

Maple review

🟢 Confidence 10/10 · safe to merge. The head only adds a scene test that pins the filtersLabel trigger and sheet names, closing F1; no other file changed since the earlier review.
_{no findings · tests covered · risk low}

This head adds one scene test asserting a filtersLabel rail names both its top-bar trigger and its sheet, and that the old "Filters" button is gone. It closes the open finding and is safe to merge.

• settingsView fixture renders a dashboardPage with filtersLabel: "Settings"
• New scene test checks "Open filters" is absent, clicks "Open settings", asserts the "Settings" dialog holds the rail

Fixed since the last review

• ✅ F1 · Rail label naming the sheet and trigger has no scene test

_{5853d89 · What was checked, coverage and telemetry details are on the Maple / review check. Reply "won't fix" to dismiss a finding, or mention @maple-review-bot to ask about one.}