diff --git a/ui/litellm-dashboard/src/components/team/available_teams.tsx b/ui/litellm-dashboard/src/components/team/available_teams.tsx index 2959925f424..cade9072c56 100644 --- a/ui/litellm-dashboard/src/components/team/available_teams.tsx +++ b/ui/litellm-dashboard/src/components/team/available_teams.tsx @@ -25,11 +25,13 @@ interface AvailableTeam { interface AvailableTeamsProps { accessToken: string | null; userID: string | null; + searchTerm : string | null; } const AvailableTeamsPanel: React.FC = ({ accessToken, userID, + searchTerm, }) => { const [availableTeams, setAvailableTeams] = useState([]); @@ -70,7 +72,7 @@ const AvailableTeamsPanel: React.FC = ({ return ( - + @@ -82,7 +84,9 @@ const AvailableTeamsPanel: React.FC = ({ - {availableTeams.map((team) => ( + {availableTeams + ?.filter((team) => team["team_alias"].toLowerCase().includes(searchTerm?.toLowerCase() || '')) + ?.map((team) => ( {team.team_alias} diff --git a/ui/litellm-dashboard/src/components/teams.tsx b/ui/litellm-dashboard/src/components/teams.tsx index 6b0583bef84..4f655f3eab8 100644 --- a/ui/litellm-dashboard/src/components/teams.tsx +++ b/ui/litellm-dashboard/src/components/teams.tsx @@ -140,6 +140,7 @@ const Team: React.FC = ({ const [userModels, setUserModels] = useState([]); const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false); const [teamToDelete, setTeamToDelete] = useState(null); + const [searchTerm,setSearchTerm] = useState() @@ -362,6 +363,24 @@ const Team: React.FC = ({ /> ) : ( +
+

Teams

+
+ setSearchTerm(e.target.value)} + /> + +
+
Your Teams @@ -385,7 +404,7 @@ const Team: React.FC = ({
- +
@@ -403,7 +422,8 @@ const Team: React.FC = ({ {teams && teams.length > 0 ? teams - .sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime()) + ?.sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime()) + ?.filter((team) => team["team_alias"].toLowerCase().includes(searchTerm?.toLowerCase() || '')) .map((team: any) => ( = ({ > {team["team_alias"]} -
@@ -434,7 +453,6 @@ const Team: React.FC = ({
-
= ({
)) : null} + + {teams && teams?.length === 0 && ( + + + No available teams + + + )}
{isDeleteModalOpen && ( @@ -620,12 +646,6 @@ const Team: React.FC = ({ {userRole == "Admin"? ( - = ({