GeezerVison is showing github.com — feat(site/src/pages/AIBridgePage): add column controls to the AI sessions list by tracyjohnsonux · Pull Request #31054 · coder/coder
Conversation
Adds a Columns menu to the AI sessions list so users can choose which columns show, reorder them, and switch between preset views.
- Views: General, Security, and Cost apply a preset column set in one click. Changing any column clears the checkmark; picking the view again resets to it.
- Show/hide: a switch per column. Turning a column on appends it; turning it off moves it to the top of "Not shown". The last shown column cannot be turned off; a tooltip explains why.
- Reorder: drag handle with pointer or keyboard (Space, arrows, Space), using
@dnd-kit/react like the chat sidebar.
- Responsive: the table hides shown columns from the end when they do not fit and the menu lists them under "Hidden at this width". Last prompt keeps at least 320px. The chevron is now its own fixed column.
- New columns: Model (never shown by default) and Cost. Cost uses placeholder data derived from token counts until the sessions API reports cost (TODO in
ListSessionsRow.tsx).
- Initial prompt: the prompt column is renamed "Initial prompt". It still shows the last prompt as placeholder data because the sessions API only returns that (TODO in
ListSessionsRow.tsx). The backend should return, in order of preference:
- For Coder Agents sessions, the chat summary. The session ID is the root chat ID (
X-Coder-Chat-Id), so it joins to chats.
- The first user prompt that is not a shared system prompt. A prompt is shared when its opening matches prompts from five or more other sessions. On dogfood, 49 of the latest 100 sessions end on one templated prompt that opens with "You produce a short sidebar status summarizing".
- The first user prompt.
- Settings persist in local storage, keyed by user ID.
Header text now uses the menu labels, so "In/Out Tokens" becomes sentence case.
Depends on #30733 (stacked on its branch). Also merges in #31040 (sessions search filter) so the Columns menu sits beside the new search; its files show in this diff until #31040 merges.
Design decisions
- View definitions (
sessionColumns.ts), from the design:
- General: Last prompt, User, Client, In/Out tokens, Cost, Last active
- Security: Last prompt, User, Network, Threads, Last active
- Cost: Last prompt, User, Client, Cost, In/Out tokens, Threads
- Active view is derived by comparing the shown columns with each view, not stored, so customizing back to a view's exact columns shows its checkmark again.
- Width fitting: each column has a fixed width in
sessionColumns; the table uses table-fixed, and a ResizeObserver on the table wrapper drives countFittingColumns. Those widths are inline style because the fit calculation also uses them.
- Storage: frontend-only by request; key
aiGateway.sessions.columns.<userId>. Unknown saved columns are dropped and columns added later start hidden.
- Locked switch uses
aria-disabled instead of disabled so keyboard users can focus it and read the tooltip.
- Keyboard drag focus: dnd-kit moves the dragged row's element, which drops focus; the handle is refocused on drag over, matching
refocusKeyboardPinDrag in the chat sidebar. Escape during a keyboard drag cancels the drag without closing the menu.
🤖 This PR was generated by Coder Agents on behalf of @tracyjohnsonux.
Sorry, something went wrong.
Uh oh!
There was an error while loading. Please reload this page.
Replace the sessions list search box and User, Provider, Client, and
Model dropdowns with the FilterCombobox search filter used on the
Workspaces page. Each former dropdown becomes a filter category. The
date range keeps its own picker; its bounds are kept out of the search
input and merged back into the query on change.
…ions list
Add a Columns menu to the AI sessions list with three one-click views
(General, Security, Cost), a switch per column, and drag-handle
reordering with pointer or keyboard. At least one column stays shown.
Customizing the columns clears the view checkmark; picking a view again
resets to it. Settings persist per user in local storage.
The table hides shown columns from the end when they do not fit its
width and the menu lists them under "Hidden at this width". The chevron
is now its own fixed column. A Model column is available but never shown
by default, and a Cost column shows placeholder data derived from token
counts until the sessions API reports cost.
Places the Columns menu beside the new search filter and updates the
view test for the filter's new props and auth requirement.
…f drags
Render "Hidden at this width" as its own list item instead of inside the
first hidden row, so it no longer moves with that row during a drag.
Save a selected view by ID rather than by its columns, so a later change
to a view's columns still applies and the view stays checked. The storage
key is renamed so values saved by earlier previews start from General.
linear-code
Bot
commented
Oct 21, 2026
•
edited
Loading
Uh oh!
There was an error while loading. Please reload this page.
Sorry, something went wrong.
Uh oh!
There was an error while loading. Please reload this page.
…l prompt
The column now reads from one placeholder that documents the intended
initial prompt: the Coder Agents chat summary, else the first user prompt
that is not a shared system prompt, else the first prompt. The sessions
API returns only the last prompt today, so the placeholder shows that.
…lter
# Conflicts:
# site/src/api/queries/aiBridge.ts
…sessions list
The sessions search API does not filter by organization yet, so the
token defaults to the default organization, shows as a chip, and is left
out of the request.
…ai-sessions-column-controls
# Conflicts:
# site/src/components/InfoTooltip/InfoTooltip.tsx
# site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsPage.tsx
# site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsPageView.stories.tsx
# site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsPageView.tsx
# site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsRow.tsx
# site/src/pages/AIBridgePage/utils.test.ts
# site/src/pages/AIBridgePage/utils.ts
…ai-sessions-column-controls
This branch has not been deployed
No deployments
Uh oh!
There was an error while loading. Please reload this page.
Labels
experimental
Changes that might not necessarily be merged, until its approved to proceed with.
Milestone
No milestone
Development
Successfully merging this pull request may close these issues.
Uh oh!
There was an error while loading. Please reload this page.
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.
|