feat(ui): Add team-alias column to Models Health Status UI

- Added Team Alias column to the Models Health Status table
- Updated HealthCheckComponent to accept teams prop
- Updated health_check_columns to display team alias based on team_id
- Falls back to team_id if team alias not found, or shows '-' if no team
- Updated parent components to pass teams data to HealthCheckComponent

Co-authored-by: ishaan <ishaan@berri.ai>

ui/litellm-dashboard/src/app/(dashboard)/models-and-endpoints/ModelsAndEndpointsView.tsx

@@ -400,6 +400,7 @@ const ModelsAndEndpointsView: React.FC<ModelDashboardProps> = ({ premiumUser, te
                     all_models_on_proxy={allModelsOnProxy}
                     getDisplayModelName={getDisplayModelName}
                     setSelectedModelId={setSelectedModelId}
+                    teams={teams}
                   />
                 </TabPanel>
                 <ModelRetrySettingsTab

ui/litellm-dashboard/src/components/model_dashboard/HealthCheckComponent.tsx

@@ -7,6 +7,7 @@ import { healthCheckColumns } from "./health_check_columns";
 import { errorPatterns } from "@/utils/errorPatterns";
 import { individualModelHealthCheckCall, latestHealthChecksCall } from "../networking";
 import { Table as TableInstance } from "@tanstack/react-table";
+import { Team } from "../key_team_helpers/key_list";
 
 interface HealthStatus {
   status: string;
@@ -24,6 +25,7 @@ interface HealthCheckComponentProps {
   all_models_on_proxy: string[];
   getDisplayModelName: (model: any) => string;
   setSelectedModelId?: (modelId: string) => void;
+  teams?: Team[] | null;
 }
 
 const HealthCheckComponent: React.FC<HealthCheckComponentProps> = ({
@@ -32,6 +34,7 @@ const HealthCheckComponent: React.FC<HealthCheckComponentProps> = ({
   all_models_on_proxy,
   getDisplayModelName,
   setSelectedModelId,
+  teams,
 }) => {
   const [modelHealthStatuses, setModelHealthStatuses] = useState<{ [key: string]: HealthStatus }>({});
   const [selectedModelsForHealth, setSelectedModelsForHealth] = useState<string[]>([]);
@@ -574,6 +577,7 @@ const HealthCheckComponent: React.FC<HealthCheckComponentProps> = ({
             showErrorModal,
             showSuccessModal,
             setSelectedModelId,
+            teams,
           )}
           data={modelData.data.map((model: any) => {
             const modelName = model.model_name;

ui/litellm-dashboard/src/components/model_dashboard/health_check_columns.tsx

@@ -2,6 +2,7 @@ import { ColumnDef } from "@tanstack/react-table";
 import { Tooltip, Checkbox } from "antd";
 import { Text } from "@tremor/react";
 import { InformationCircleIcon, PlayIcon, RefreshIcon } from "@heroicons/react/outline";
+import { Team } from "@/components/key_team_helpers/key_list";
 
 interface HealthCheckData {
   model_name: string;
@@ -42,6 +43,7 @@ export const healthCheckColumns = (
   showErrorModal?: (modelName: string, cleanedError: string, fullError: string) => void,
   showSuccessModal?: (modelName: string, response: any) => void,
   setSelectedModelId?: (modelId: string) => void,
+  teams?: Team[] | null,
 ): ColumnDef<HealthCheckData>[] => [
   {
     header: () => (
@@ -100,6 +102,31 @@ export const healthCheckColumns = (
       );
     },
   },
+  {
+    header: "Team Alias",
+    accessorKey: "model_info.team_id",
+    enableSorting: true,
+    sortingFn: "alphanumeric",
+    cell: ({ row }) => {
+      const model = row.original;
+      const teamId = model.model_info?.team_id;
+
+      if (!teamId) {
+        return <Text className="text-gray-400 text-sm">-</Text>;
+      }
+
+      const team = teams?.find((t) => t.team_id === teamId);
+      const teamAlias = team?.team_alias || teamId;
+
+      return (
+        <div className="text-sm">
+          <Tooltip title={teamAlias}>
+            <div className="truncate max-w-[150px]">{teamAlias}</div>
+          </Tooltip>
+        </div>
+      );
+    },
+  },
   {
     header: "Health Status",
     accessorKey: "health_status",

ui/litellm-dashboard/src/components/templates/model_dashboard.tsx

@@ -1368,6 +1368,7 @@ const OldModelDashboard: React.FC<ModelDashboardProps> = ({
                     all_models_on_proxy={all_models_on_proxy}
                     getDisplayModelName={getDisplayModelName}
                     setSelectedModelId={setSelectedModelId}
+                    teams={teams}
                   />
                 </TabPanel>
                 <TabPanel>