Merge pull request #3306 from BerriAI/ui_fix_end_users_tab

[UI] fix end users tab
This commit is contained in:
Ishaan Jaff 2024-04-25 13:06:32 -07:00 committed by GitHub
commit cff83c720d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 12 additions and 7 deletions

View file

@ -425,7 +425,7 @@ const ViewKeyTable: React.FC<ViewKeyTableProps> = ({
return ( return (
<div> <div>
<Card className="w-full mx-auto flex-auto overflow-y-auto max-h-[50vh] mb-4 mt-2"> <Card className="w-full mx-auto flex-auto overflow-y-auto max-h-[50vh] mb-4 mt-2">
<Table className="mt-5"> <Table className="mt-5 max-h-[300px] min-h-[300px]">
<TableHead> <TableHead>
<TableRow> <TableRow>
<TableHeaderCell>Key Alias</TableHeaderCell> <TableHeaderCell>Key Alias</TableHeaderCell>

View file

@ -153,9 +153,13 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
return ( return (
<div style={{ width: "100%" }}> <div style={{ width: "100%" }}>
<Grid className="gap-2 p-2 h-[75vh] w-full mt-8"> <Grid className="gap-2 p-2 h-[80vh] w-full mt-8">
<CreateUser userID={userID} accessToken={accessToken} teams={teams}/> <CreateUser userID={userID} accessToken={accessToken} teams={teams}/>
<Card className="w-full mx-auto flex-auto overflow-y-auto max-h-[50vh] mb-4"> <Card className="w-full mx-auto flex-auto overflow-y-auto max-h-[80vh] mb-4">
<div className="mb-4 mt-1">
<Text><b>Key Owners: </b> Users on LiteLLM that created API Keys. Automatically tracked by LiteLLM</Text>
<Text className="mt-1"><b>End Users: </b>End Users of your LLM API calls. Tracked When a `user` param is passed in your LLM calls</Text>
</div>
<TabGroup> <TabGroup>
<TabList variant="line" defaultValue="1"> <TabList variant="line" defaultValue="1">
<Tab value="1">Key Owners</Tab> <Tab value="1">Key Owners</Tab>
@ -163,6 +167,7 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
</TabList> </TabList>
<TabPanels> <TabPanels>
<TabPanel> <TabPanel>
<Table className="mt-5"> <Table className="mt-5">
<TableHead> <TableHead>
<TableRow> <TableRow>
@ -220,8 +225,8 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
{keys?.map((key: any, index: number) => { {keys?.map((key: any, index: number) => {
if ( if (
key && key &&
key["key_name"] !== null && key["key_alias"] !== null &&
key["key_name"].length > 0 key["key_alias"].length > 0
) { ) {
return ( return (
<SelectItem <SelectItem
@ -229,7 +234,7 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
value={String(index)} value={String(index)}
onClick={() => onKeyClick(key["token"])} onClick={() => onKeyClick(key["token"])}
> >
{key["key_name"]} {key["key_alias"]}
</SelectItem> </SelectItem>
); );
} }
@ -237,7 +242,7 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
</Select> </Select>
</div> </div>
</div> </div>
<Table> <Table className="max-h-[70vh] min-h-[500px]">
<TableHead> <TableHead>
<TableRow> <TableRow>
<TableHeaderCell>End User</TableHeaderCell> <TableHeaderCell>End User</TableHeaderCell>