diff --git a/ui/litellm-dashboard/src/components/create_key_button.tsx b/ui/litellm-dashboard/src/components/create_key_button.tsx index d7fb9c5eb..d8716d304 100644 --- a/ui/litellm-dashboard/src/components/create_key_button.tsx +++ b/ui/litellm-dashboard/src/components/create_key_button.tsx @@ -2,7 +2,7 @@ import React, { useState, useEffect, useRef } from "react"; import { Button, TextInput, Grid, Col } from "@tremor/react"; -import { Card, Metric, Text, Title, Subtitle } from "@tremor/react"; +import { Card, Metric, Text, Title, Subtitle, Accordion, AccordionHeader, AccordionBody, } from "@tremor/react"; import { CopyToClipboard } from 'react-copy-to-clipboard'; import { Button as Button2, @@ -116,7 +116,7 @@ const CreateKey: React.FC = ({ wrapperCol={{ span: 16 }} labelAlign="left" > - {userRole === "App Owner" || userRole === "Admin" || userRole === "App User" ? ( + {userRole === "App Owner" || userRole === "Admin" ? ( <> = ({ ) : ( <> - + - - + - - + + + + + + Optional Settings + + + { + if (value && team && team.max_budget !== null && value > team.max_budget) { + throw new Error(`Budget cannot exceed team max budget: $${team.max_budget}`); + } + }, + }, + ]} + > + + + + + + { + if (value && team && team.tpm_limit !== null && value > team.tpm_limit) { + throw new Error(`TPM limit cannot exceed team TPM limit: ${team.tpm_limit}`); + } + }, + }, + ]} + > + + + { + if (value && team && team.rpm_limit !== null && value > team.rpm_limit) { + throw new Error(`RPM limit cannot exceed team RPM limit: ${team.rpm_limit}`); + } + }, + }, + ]} + > + + + + + + + + + + + + )}
diff --git a/ui/litellm-dashboard/src/components/dashboard_default_team.tsx b/ui/litellm-dashboard/src/components/dashboard_default_team.tsx index b3976912b..c845ef150 100644 --- a/ui/litellm-dashboard/src/components/dashboard_default_team.tsx +++ b/ui/litellm-dashboard/src/components/dashboard_default_team.tsx @@ -4,6 +4,7 @@ import { Select, SelectItem, Text, Title } from "@tremor/react"; interface DashboardTeamProps { teams: Object[] | null; setSelectedTeam: React.Dispatch>; + userRole: string | null; } type TeamInterface = { @@ -15,6 +16,7 @@ type TeamInterface = { const DashboardTeam: React.FC = ({ teams, setSelectedTeam, + userRole, }) => { const defaultTeam: TeamInterface = { models: [], @@ -25,19 +27,27 @@ const DashboardTeam: React.FC = ({ const [value, setValue] = useState(defaultTeam); - const updatedTeams = teams ? [...teams, defaultTeam] : [defaultTeam]; - + let updatedTeams; + if (userRole === "App User") { + // Non-Admin SSO users should only see their own team - they should not see "Default Team" + updatedTeams = teams; + } else { + updatedTeams = teams ? [...teams, defaultTeam] : [defaultTeam]; + } return (
Select Team - - If you belong to multiple teams, this setting controls which team is - used by default when creating new API Keys. - - - Default Team: If no team_id is set for a key, it will be grouped under here. - + {userRole !== "App User" && ( + <> + + If you belong to multiple teams, this setting controls which team is used by default when creating new API Keys. + + + Default Team: If no team_id is set for a key, it will be grouped under here. + + + )} {updatedTeams && updatedTeams.length > 0 ? (