fix(frontend): restore the sessions toolbar layout, dropping the filters rail

[mmabrouk]

What

The sessions page had grown a filters rail: a second sidebar inside the page, next to the app's own sidebar. This returns the page to the original toolbar design: one filter row above the session list.

This is a rewrite of the shell, not a git revert. All of the newer capabilities survive and keep binding to the same shared filter atoms in @agenta/sessions:

• Search stays as the first control in the row (debounced, as before).
• Agent picker stays app-injected (antd Select), hidden on the agent-scoped page as before.
• Live / Waiting on you / All becomes a Segmented control; the waiting count rides in the label since a toolbar has no room for a separate badge.
• Show automation runs and include archived keep their switches with their tooltips.

Code shape

• SessionFiltersRail is deleted; a small SessionFiltersBar replaces it as the page-owned shell.
• SessionStatusListControl (a vertical nav list, only usable in a rail) becomes SessionStatusControl, sized for a toolbar row. No remaining consumers of the old export (grep-verified).
• No data, state, or API changes. UI only.

Verification

• 21/21 unit tests pass in @agenta/sessions.
• No remaining imports of the deleted rail or the old control name anywhere in web/.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
agenta-documentation	Ready	Preview	Aug 9, 2026 7:19pm

[coderabbitai]

📝 Walkthrough

Summary by CodeRabbit

• New Features

  • Added a top toolbar for searching and filtering sessions by status, mode, agent, and archived state.
  • Added segmented status filters for All, Live, and Waiting sessions, including the waiting-session count.
  • Expanded the session list to use the available page width with improved scrolling.

• Style

  • Refined session group header spacing and toolbar presentation.

Walkthrough

The sessions page replaces the side filter rail with a top SessionFiltersBar. Shared controls now use a segmented status selector, optional search styling, and the renamed SessionStatusControl export.

Changes

Session filter toolbar

Layer / File(s)	Summary
Update shared filter controls web/packages/agenta-sessions-ui/src/controls/SessionFilterControls.tsx, web/packages/agenta-sessions-ui/src/index.ts	Search accepts an optional class name. Status selection uses All, Live, and Waiting segments. The public export is renamed to SessionStatusControl.
Integrate the toolbar into the sessions page web/oss/src/components/pages/sessions/SessionsPage.tsx, web/oss/src/components/pages/sessions/components/SessionFiltersBar.tsx, web/packages/agenta-sessions-ui/src/SessionListStates.tsx	The page renders the toolbar above the session list. The toolbar supports search, status, mode, archived, and optional agent filters. Rail-specific spacing is removed.

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

Sequence Diagram(s)

sequenceDiagram
  participant SessionsPage
  participant SessionFiltersBar
  participant SessionFilterControls
  participant SessionList
  SessionsPage->>SessionFiltersBar: render toolbar
  SessionFiltersBar->>SessionFilterControls: render search and status controls
  SessionFilterControls->>SessionFiltersBar: return filter selections
  SessionFiltersBar->>SessionList: apply session filters

Loading

Possibly related PRs

• Agenta-AI/agenta#5306: Replaces the session filter rail and status control in related sessions UI work.
• Agenta-AI/agenta#5691: Modifies related session-list filtering and toolbar controls.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely describes replacing the filters rail with the sessions toolbar layout.
Description check	✅ Passed	The description accurately explains the toolbar redesign, retained filter capabilities, renamed controls, and reported verification.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/sessions-page-design-revert

---

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.}

[mmabrouk]

@coderabbitai review

[mmabrouk]

@coderabbitai review

[coderabbitai]

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[github-actions]

Railway Preview Environment

Status	Destroyed (PR closed)

Updated at 2026-08-09T20:47:35.510Z

[coderabbitai]

Actionable comments posted: 1

🧹 Nitpick comments (1)

web/oss/src/components/pages/sessions/components/SessionFiltersBar.tsx (1)

40-43: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick win

Memoize the Select options.

This mapping creates a new object array whenever filter state rerenders the toolbar. Memoize the array with agents as its dependency before passing it to Select.

As per coding guidelines, “Memoize inline arrays containing objects or JSX when passing them as props to avoid unnecessary rerenders.”

Proposed refactor

+import {useMemo} from "react"
+
 const SessionFiltersBar = ({waitingCount, hideAgentFilter}: Props) => {
     const {agentId, setAgentId} = useSessionFilters()
     const agents = useAtomValue(agentsWorkflowsAtom)
+    const agentOptions = useMemo(
+        () =>
+            agents.map((agent) => ({
+                value: agent.workflowId,
+                label: agent.name,
+            })),
+        [agents],
+    )

@@
-                    options={agents.map((agent) => ({
-                        value: agent.workflowId,
-                        label: agent.name,
-                    }))}
+                    options={agentOptions}

Source: Coding guidelines

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: bd7ba4a6-f165-4bd9-a5bd-bfe97b3af7bd

📥 Commits

Reviewing files that changed from the base of the PR and between 1188fb8 and c1b7e45.

📒 Files selected for processing (6)

• web/oss/src/components/pages/sessions/SessionsPage.tsx
• web/oss/src/components/pages/sessions/components/SessionFiltersBar.tsx
• web/oss/src/components/pages/sessions/components/SessionFiltersRail.tsx
• web/packages/agenta-sessions-ui/src/SessionListStates.tsx
• web/packages/agenta-sessions-ui/src/controls/SessionFilterControls.tsx
• web/packages/agenta-sessions-ui/src/index.ts

💤 Files with no reviewable changes (1)

• web/oss/src/components/pages/sessions/components/SessionFiltersRail.tsx