phoenix/litellm
1
0
Fork 0
forked from phoenix/litellm-mirror
Code Pull requests Activity

build(ui/litellm-dashboard): initial commit of litellm dashboard

Browse source
This commit is contained in:
Krrish Dholakia 2024-01-27 12:12:48 -08:00
parent 8d4749b94a
commit af8b35d556
20 changed files with 7710 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

81
ui/litellm-dashboard/src/components/view_key_table.tsx Normal file
View file

@ -0,0 +1,81 @@
'use client';
import { StatusOnlineIcon } from "@heroicons/react/outline";
import {
Badge,
Card,
Table,
TableBody,
TableCell,
TableHead,
TableHeaderCell,
TableRow,
Text,
Title,
} from "@tremor/react";
const data = [
{
key_alias: "my test key",
key_name: "sk-...hd74",
spend: 23.0,
expires: "active",
token: "23902dwojd90"
},
{
key_alias: "my test key",
key_name: "sk-...hd74",
spend: 23.0,
expires: "active",
token: "23902dwojd90"
},
{
key_alias: "my test key",
key_name: "sk-...hd74",
spend: 23.0,
expires: "active",
token: "23902dwojd90"
},
{
key_alias: "my test key",
key_name: "sk-...hd74",
spend: 23.0,
expires: "active",
token: "23902dwojd90"
},
];
export default function ViewKeyTable() {
return (
<Card className="flex-auto overflow-y-auto max-h-[50vh] mb-4">
<Title>API Keys</Title>
<Table className="mt-5">
<TableHead>
<TableRow>
<TableHeaderCell>Alias</TableHeaderCell>
<TableHeaderCell>Secret Key</TableHeaderCell>
<TableHeaderCell>Spend</TableHeaderCell>
<TableHeaderCell>Status</TableHeaderCell>
</TableRow>
</TableHead>
<TableBody>
{data.map((item) => (
<TableRow key={item.token}>
<TableCell>{item.key_alias}</TableCell>
<TableCell>
<Text>{item.key_name}</Text>
</TableCell>
<TableCell>
<Text>{item.spend}</Text>
</TableCell>
<TableCell>
<Badge color="emerald" icon={StatusOnlineIcon}>
{item.expires}
</Badge>
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</Card>
)};