mirror of
https://github.com/coder/coder.git
synced 2026-09-24 15:04:27 +08:00
fix(site): show condensed count for multi-provider in sessions list (#25705)
The Provider column in the AI sessions list now shows: - **Multiple providers**: condensed count badge (e.g. `2 providers`) - **Single provider**: icon + display name badge (e.g. `OpenAI`) (existing behavior) - **Empty**: nothing rendered ## Changes | File | Change | |------|--------| | `ListSessionsRow.tsx` | Conditional rendering for the provider cell based on `providers.length` | | `ListSessionsRow.stories.tsx` | Added stories: `SingleProvider`, `MultipleProviders`, `EmptyProviders` | | `ListSessionsPageView.stories.tsx` | `MultipleSessions` story alternates single/multi provider rows | > Generated by Coder Agents on behalf of @tracyjohnsonux
This commit is contained in:
@@ -92,6 +92,7 @@ export const MultipleSessions: Story = {
|
||||
...MockSession,
|
||||
id: `session-${i}`,
|
||||
threads: i + 1,
|
||||
providers: i % 2 === 0 ? ["anthropic", "openai"] : ["anthropic"],
|
||||
last_prompt: [
|
||||
"But *can* I really fix it?",
|
||||
"Can you refactor the entire authentication module to use JWT tokens instead of session cookies?",
|
||||
|
||||
@@ -30,6 +30,33 @@ export const Default: Story = {
|
||||
},
|
||||
};
|
||||
|
||||
export const SingleProvider: Story = {
|
||||
args: {
|
||||
session: {
|
||||
...MockSession,
|
||||
providers: ["anthropic"],
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export const MultipleProviders: Story = {
|
||||
args: {
|
||||
session: {
|
||||
...MockSession,
|
||||
providers: ["anthropic", "openai", "copilot"],
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export const EmptyProviders: Story = {
|
||||
args: {
|
||||
session: {
|
||||
...MockSession,
|
||||
providers: [],
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export const NullClient: Story = {
|
||||
args: {
|
||||
session: { ...MockSession, client: null },
|
||||
|
||||
@@ -63,17 +63,23 @@ export const ListSessionsRow: FC<ListSessionsRowProps> = ({
|
||||
</TableCell>
|
||||
<TableCell className="w-40 max-w-40">
|
||||
<div className="min-w-0 overflow-hidden">
|
||||
<Badge className="gap-1.5 max-w-full">
|
||||
<div className="flex-shrink-0 flex items-center">
|
||||
<AIBridgeProviderIcon
|
||||
provider={getProviderIconName(session.providers[0])}
|
||||
className="size-icon-xs"
|
||||
/>
|
||||
</div>
|
||||
<span className="truncate min-w-0">
|
||||
{getProviderDisplayName(session.providers[0])}
|
||||
</span>
|
||||
</Badge>
|
||||
{session.providers.length > 1 ? (
|
||||
<Badge className="max-w-full">
|
||||
{session.providers.length} providers
|
||||
</Badge>
|
||||
) : session.providers.length === 1 ? (
|
||||
<Badge className="gap-1.5 max-w-full">
|
||||
<div className="flex-shrink-0 flex items-center">
|
||||
<AIBridgeProviderIcon
|
||||
provider={getProviderIconName(session.providers[0])}
|
||||
className="size-icon-xs"
|
||||
/>
|
||||
</div>
|
||||
<span className="truncate min-w-0">
|
||||
{getProviderDisplayName(session.providers[0])}
|
||||
</span>
|
||||
</Badge>
|
||||
) : null}
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell className="w-40 max-w-40">
|
||||
|
||||
Reference in New Issue
Block a user