From 640bae5d089ff3037af572fcaad281350705fcda Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Fri, 24 Apr 2026 13:23:19 +0000
Subject: [PATCH] feat(ui): migrate model_dashboard tremor tables to shadcn

Co-authored-by: yuneng-jiang <yuneng-berri@users.noreply.github.com>
---
 .../model_dashboard/all_models_table.tsx        | 17 ++++++++---------
 .../src/components/model_dashboard/table.tsx    | 17 ++++++++---------
 2 files changed, 16 insertions(+), 18 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/model_dashboard/all_models_table.tsx b/ui/litellm-dashboard/src/components/model_dashboard/all_models_table.tsx
index e7c9d389ed0..3912bc8d75a 100644
--- a/ui/litellm-dashboard/src/components/model_dashboard/all_models_table.tsx
+++ b/ui/litellm-dashboard/src/components/model_dashboard/all_models_table.tsx
@@ -11,15 +11,14 @@ import {
   OnChangeFn,
 } from "@tanstack/react-table";
 import React from "react";
-// eslint-disable-next-line litellm-ui/no-banned-ui-imports
 import {
   Table,
-  TableHead,
-  TableHeaderCell,
   TableBody,
-  TableRow,
   TableCell,
-} from "@tremor/react";
+  TableHead,
+  TableHeader,
+  TableRow,
+} from "@/components/ui/table";
 import {
   TableHeaderSortDropdown,
   SortState,
@@ -97,11 +96,11 @@ export function AllModelsDataTable<TData, TValue>({
               tableLayout: "fixed",
             }}
           >
-            <TableHead>
+            <TableHeader>
               {tableInstance.getHeaderGroups().map((headerGroup) => (
                 <TableRow key={headerGroup.id}>
                   {headerGroup.headers.map((header) => (
-                    <TableHeaderCell
+                    <TableHead
                       key={header.id}
                       className={`py-1 h-8 relative ${
                         header.id === "actions"
@@ -156,11 +155,11 @@ export function AllModelsDataTable<TData, TValue>({
                           }`}
                         />
                       )}
-                    </TableHeaderCell>
+                    </TableHead>
                   ))}
                 </TableRow>
               ))}
-            </TableHead>
+            </TableHeader>
             <TableBody>
               {isLoading ? (
                 <TableRow>
diff --git a/ui/litellm-dashboard/src/components/model_dashboard/table.tsx b/ui/litellm-dashboard/src/components/model_dashboard/table.tsx
index d5da9051353..3a08849f006 100644
--- a/ui/litellm-dashboard/src/components/model_dashboard/table.tsx
+++ b/ui/litellm-dashboard/src/components/model_dashboard/table.tsx
@@ -12,15 +12,14 @@ import {
   OnChangeFn,
 } from "@tanstack/react-table";
 import React from "react";
-// eslint-disable-next-line litellm-ui/no-banned-ui-imports
 import {
   Table,
-  TableHead,
-  TableHeaderCell,
   TableBody,
-  TableRow,
   TableCell,
-} from "@tremor/react";
+  TableHead,
+  TableHeader,
+  TableRow,
+} from "@/components/ui/table";
 import { ArrowUpDown, ChevronDown, ChevronUp } from "lucide-react";
 
 // Extend the column meta type to include className
@@ -93,11 +92,11 @@ export function ModelDataTable<TData, TValue>({
               tableLayout: "fixed",
             }}
           >
-            <TableHead>
+            <TableHeader>
               {tableInstance.getHeaderGroups().map((headerGroup) => (
                 <TableRow key={headerGroup.id}>
                   {headerGroup.headers.map((header) => (
-                    <TableHeaderCell
+                    <TableHead
                       key={header.id}
                       className={`py-1 h-8 relative ${
                         header.id === "actions"
@@ -146,11 +145,11 @@ export function ModelDataTable<TData, TValue>({
                           }`}
                         />
                       )}
-                    </TableHeaderCell>
+                    </TableHead>
                   ))}
                 </TableRow>
               ))}
-            </TableHead>
+            </TableHeader>
             <TableBody>
               {isLoading ? (
                 <TableRow>