mirror of
https://github.com/BerriAI/litellm.git
synced 2026-10-03 02:22:24 +00:00
feat(ui/agents): add AgentList component
antd Table that renders cloud-agent definitions and links each row to
/agents/{agent_id}. Uses Tag for the model and dayjs.fromNow for the
last-activity column. Empty state is the antd Empty placeholder.
This commit is contained in:
parent
1f5c3fd9f2
commit
a9419c514f
1 changed files with 62 additions and 0 deletions
|
|
@ -0,0 +1,62 @@
|
|||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { Card, Table, Tag, Typography, Empty } from "antd";
|
||||
import type { ColumnsType } from "antd/es/table";
|
||||
import dayjs from "dayjs";
|
||||
import type { CloudAgent } from "@/types/cloud-agents";
|
||||
|
||||
const { Text } = Typography;
|
||||
|
||||
interface AgentListProps {
|
||||
agents: CloudAgent[];
|
||||
loading: boolean;
|
||||
}
|
||||
|
||||
export default function AgentList({ agents, loading }: AgentListProps) {
|
||||
const columns: ColumnsType<CloudAgent> = [
|
||||
{
|
||||
title: "Name",
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
render: (_value: unknown, record: CloudAgent) => (
|
||||
<Link href={`/agents/${record.agent_id}`} data-testid={`agent-link-${record.agent_id}`}>
|
||||
<Text strong>{record.name}</Text>
|
||||
</Link>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: "Model",
|
||||
dataIndex: "model",
|
||||
key: "model",
|
||||
render: (value: string) => <Tag color="blue">{value}</Tag>,
|
||||
},
|
||||
{
|
||||
title: "Sessions",
|
||||
dataIndex: "session_count",
|
||||
key: "session_count",
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: "Last activity",
|
||||
dataIndex: "last_activity_at",
|
||||
key: "last_activity_at",
|
||||
render: (value: string | null) => (value ? dayjs(value).fromNow?.() ?? dayjs(value).format("YYYY-MM-DD HH:mm") : "—"),
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<Table<CloudAgent>
|
||||
rowKey="agent_id"
|
||||
dataSource={agents}
|
||||
columns={columns}
|
||||
loading={loading}
|
||||
locale={{
|
||||
emptyText: <Empty description="No cloud agents yet — create your first one." />,
|
||||
}}
|
||||
data-testid="agents-table"
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue