You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
feat(web): alerts sections move to a left rail - #2361
The alerts hub has eight sections now, and the tab strip under the title was running out of room. The sections move to a left rail, using the same pattern Security and Settings already use.
Counts and links: the counts are unchanged (Inbox unacknowledged in red; Rules, Uptime, SLOs, On-call muted). Rows keep the same search params as the old tabs: Inbox keeps the anomaly filters and the other sections drop them.
Title and breadcrumbs: the page title and breadcrumbs name the open section, e.g. Alerts › Rules.
Small screens: below lg the rail folds into the "Alerts" sheet from the top bar, like Security.
Shared kit:navShell moves from settings/kit to page/kit, since settings, security, integrations and alerts all use it now. Its rows gain an optional trailing count.
Labs: the alerts labs now use the hub's breadcrumbs.
Verification
bun run typecheck (web) and oxlint -c .oxlintrc.effect.json on the changed files are clean, and so is ui:patterns:check.
The alerts, settings, security, shell and lab vitest suites pass: 100 files, 880 tests. A new scene test checks that the open section is aria-current, titles the page and fills the breadcrumbs.
Screenshots come from /lab/alerts-hub fixtures, before (main) and after.
The alerts hub outgrew its tab strip (eight sections). It now uses the
section rail Security and Settings use: grouped as Triage, Monitors,
Quiet and Response, with the same counts, folding into a sheet below lg.
The page title and breadcrumbs name the open section.
navShell moves from settings/kit to page/kit (now shared by settings,
security, integrations and alerts) and gains an optional trailing count.
File: No configuration file from this repository applied
Commit: Unavailable
Layers: defaults
Review profile: CHILL
Plan: Advanced
Run ID: 26a9c775-647d-4dcf-9250-cdb6fbebdb1a
Commits
Reviewing files that changed from the base of the PR and between 41b94fa and 0c556b1.
Files selected for processing: 18
apps/web/src/lab/alerts-hub-lab.ts
apps/web/src/lab/anomaly-alerts-lab.ts
apps/web/src/lab/escalation-lab.ts
apps/web/src/lab/maintenance-lab.ts
apps/web/src/lab/oncall-lab.ts
apps/web/src/lab/slos-lab.ts
apps/web/src/page/alerts/hub/hub.scene.test.ts
apps/web/src/page/alerts/hub/index.ts
apps/web/src/page/alerts/hub/view.ts
apps/web/src/page/integrations/view.ts
apps/web/src/page/kit/nav-shell.ts
apps/web/src/page/security/kit/layout.ts
apps/web/src/page/settings/account/nav.ts
apps/web/src/page/settings/account/view.ts
apps/web/src/page/settings/nav.ts
apps/web/src/page/settings/view.ts
packages/views/src/ui/INDEX.md
packages/views/src/ui/nav-rail-row.ts
No actionable comments were generated in the recent review.
Walkthrough
The Alerts hub replaces its horizontal tab strip with a grouped section rail. It displays selected counts, updates the page title and breadcrumbs for the active tab, and applies tab-specific filter handling. Alerts labs now use the hub’s breadcrumbs for hub states.
The shared rail accepts optional row counts and renders them with configurable muted or error tones. Related page imports and UI descriptions now reference the shared rail.
Alerts hub rail and breadcrumbs apps/web/src/page/alerts/hub/view.ts, apps/web/src/page/alerts/hub/index.ts, apps/web/src/page/alerts/hub/hub.scene.test.ts
The hub groups tabs into Triage, Monitors, Quiet, and Response sections. It displays positive counts, preserves Inbox filters while clearing specified filters for other tabs, and uses the active tab for the page title and breadcrumbs. The page registration and scene test use or verify these changes.
MapleTechLabs/maple#2298: Adds the SLOs tab and data used by the hub rail’s SLO entry and count.
MapleTechLabs/maple#2307: Adds the On-call tab and schedule data used by the hub rail’s Response entry and count.
MapleTechLabs/maple#2320: Changes Inbox filter state that the hub rail also handles when switching sections.
Merge Risk: Minimal · previous review 41b94
The Alerts sections remain accessible on narrow screens, and no actionable merge-blocking issue was established. The change is ready for normal merge checks.
Pre-merge checks: 5
Check name
Status
Explanation
Description Check
Check skipped - CodeRabbit’s high-level summary is enabled.
Title check
The title "feat(web): alerts sections move to a left rail" matches the main change. The PR moves the Alerts hub sections from a horizontal tab strip into a grouped left rail (Triage, Monitors, Quiet, …
Docstring Coverage
No eligible functions found in the changed files. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff with cyclomatic complexity of at least 2. Documentat…
Linked Issues check
Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check
Check skipped because no linked issues were found for this pull request.
Full details: Title check
Explanation
The title "feat(web): alerts sections move to a left rail" matches the main change. The PR moves the Alerts hub sections from a horizontal tab strip into a grouped left rail (Triage, Monitors, Quiet, Response). The title is specific, short, and in conventional-commit form. It names the web app scope and the key UI change. The rail is supported by the navShell move and the breadcrumb/title updates shown in the summaries.
Full details: Docstring Coverage
Explanation
No eligible functions found in the changed files. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff with cyclomatic complexity of at least 2. Documentation-only edits and deletions within surviving functions are included; unchanged diff context and fully deleted functions are excluded. Analyzed 0 functions across 17 files. (1 skipped: 1 unsupported.)
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.
File: No configuration file from this repository applied
Commit: Unavailable
Layers: defaults
Review profile: CHILL
Plan: Advanced
Run ID: 2841f01e-8cf2-4b63-a2be-f0dd53c39db1
Commits
Reviewing files that changed from the base of the PR and between 0b7885d and 41b94fa.
Files selected for processing: 18
apps/web/src/lab/alerts-hub-lab.ts
apps/web/src/lab/anomaly-alerts-lab.ts
apps/web/src/lab/escalation-lab.ts
apps/web/src/lab/maintenance-lab.ts
apps/web/src/lab/oncall-lab.ts
apps/web/src/lab/slos-lab.ts
apps/web/src/page/alerts/hub/hub.scene.test.ts
apps/web/src/page/alerts/hub/index.ts
apps/web/src/page/alerts/hub/view.ts
apps/web/src/page/integrations/view.ts
apps/web/src/page/kit/nav-shell.ts
apps/web/src/page/security/kit/layout.ts
apps/web/src/page/settings/account/nav.ts
apps/web/src/page/settings/account/view.ts
apps/web/src/page/settings/nav.ts
apps/web/src/page/settings/view.ts
packages/views/src/ui/INDEX.md
packages/views/src/ui/nav-rail-row.ts
Included review availability: This review used your included allowance. Your plan provides up to 4 included reviews per hour; 1 remain after this review.
A separate agent signed in as the preview reviewer and drove the preview with Playwright.
Passed
Rail: the groups and their order are right. All 8 rows link to /alerts?tab=<section> and navigate when clicked. Exactly one row is aria-current="page".
Title and breadcrumbs: the <h1> follows the section, and bare /alerts or ?tab=bogus gives "Inbox". The breadcrumbs read Alerts › <section>, with Alerts linking to /alerts.
Search params: from ?tab=inbox&signal=error_rate&anomalyStatus=open&window=24h&serviceName=api, Inbox keeps all four params and the other 7 rows keep only serviceName.
Header actions: Silences shows "New silence" and Routing shows "New destination". "New rule" (the split button) shows everywhere.
Mobile, 390px: there is no inline rail. "Open alerts" opens the grouped rail as a sheet, and picking a row navigates.
Other rails: Settings and Security still render their rails (no counts there) and their mobile sheets. Light mode is fine.
Console: no errors and no horizontal overflow at 1440 or 390.
Not exercised: the Preview org has no rules, incidents, monitors, SLOs or schedules, so no counts appear, which matches "zero is hidden". The scene tests and the lab screenshots above cover positive counts.
Follow-up (shell behaviour that predates this PR): on mobile, the rail sheet stays open after picking a row whenever only ?tab= changes. /settings has the same behaviour today. The shell deliberately keeps rail sheets open across search changes so filter sheets survive picking a facet. Closing nav-rail sheets on navigation belongs in its own change.
Traces: this PR only changes how the client renders the page. It adds no API, query or worker code, so there are no new spans to compare.
🟢 Confidence 10/10 · safe to merge. Contained UI change: the rail, its aria-current, href search-param handling and breadcrumbs are pinned by a new scene test, and every navShell importer was moved. no findings · tests covered · risk medium
Moves the alerts hub's eight sections from a tab strip into the shared left rail (navShell, relocated to page/kit with an optional trailing count), names the page and breadcrumbs after the open section, and folds the rail into the top bar's "Alerts" sheet below lg. Faithful to the old tabs.
navShell moves to page/kit and rows gain an optional count with muted/error tone
/alerts renders its sections in the filter rail, titled Alerts › <section>
Rail rows rebuild the same search params the old tabs produced
Alerts labs take their breadcrumbs from hubBreadcrumbs
0c556b1 · 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.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
previewDeploy a full PR preview stack (Cloudflare + AWS ingest); removing it tears it down
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Makisuo
added
the
preview
![maple-review-bot[bot]](https://avatars.githubusercontent.com/in/4108169?s=60&v=4){kind=small}
The alerts hub has eight sections now, and the tab strip under the title was running out of room. The sections move to a left rail, using the same pattern Security and Settings already use.
Alerts › Rules.lgthe rail folds into the "Alerts" sheet from the top bar, like Security.navShellmoves fromsettings/kittopage/kit, since settings, security, integrations and alerts all use it now. Its rows gain an optional trailing count.Verification
bun run typecheck(web) andoxlint -c .oxlintrc.effect.jsonon the changed files are clean, and so isui:patterns:check.aria-current, titles the page and fills the breadcrumbs./lab/alerts-hubfixtures, before (main) and after.Mobile, 390px: top bar and the rail sheet.
🤖 Generated with Claude Code
Open in [code]smith · Need help on this PR? Tag
@codesmith-botwith what you need.Summary by CodeRabbit