From 522f119c83dba419d3d2696ef7eafc77655fc337 Mon Sep 17 00:00:00 2001
From: Ishaan Jaff <ishaanjaffer0324@gmail.com>
Date: Mon, 15 Apr 2024 09:25:37 -0700
Subject: [PATCH] show users tab on user

---
 ui/litellm-dashboard/src/components/networking.tsx |  2 +-
 ui/litellm-dashboard/src/components/view_users.tsx | 10 ++++------
 2 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/networking.tsx b/ui/litellm-dashboard/src/components/networking.tsx
index d6a929e31..46ec87e39 100644
--- a/ui/litellm-dashboard/src/components/networking.tsx
+++ b/ui/litellm-dashboard/src/components/networking.tsx
@@ -297,7 +297,7 @@ export const userInfoCall = async (
       url = `${url}?user_id=${userID}`;
     }
     console.log("in userInfoCall viewAll=", viewAll);
-    if (viewAll && page && page_size) {
+    if (viewAll && page_size && (page != null) && (page != undefined)) {
       url = `${url}?view_all=true&page=${page}&page_size=${page_size}`;
     }
     //message.info("Requesting user data");
diff --git a/ui/litellm-dashboard/src/components/view_users.tsx b/ui/litellm-dashboard/src/components/view_users.tsx
index 19929a6be..13446ae43 100644
--- a/ui/litellm-dashboard/src/components/view_users.tsx
+++ b/ui/litellm-dashboard/src/components/view_users.tsx
@@ -45,7 +45,7 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
 }) => {
   const [userData, setUserData] = useState<null | any[]>(null);
   const [endUsers, setEndUsers] = useState<null | any[]>(null);
-  const [currentPage, setCurrentPage] = useState(1);
+  const [currentPage, setCurrentPage] = useState(0);
   const defaultPageSize = 25;
 
   useEffect(() => {
@@ -113,19 +113,17 @@ const ViewUserDashboard: React.FC<ViewUserDashboardProps> = ({
   function renderPagination() {
     if (!userData) return null;
 
-    // const totalPages = Math.ceil(userData.length / defaultPageSize);
-    const startItem = (currentPage - 1) * defaultPageSize + 1;
-    const endItem = Math.min(currentPage * defaultPageSize, userData.length);
+    const totalPages = Math.ceil(userData.length / defaultPageSize);
 
     return (
       <div className="flex justify-between items-center">
         <div>
-          Showing {startItem} – {endItem} of {userData.length}
+          Showing Page {currentPage+1} of {totalPages}
         </div>
         <div className="flex">
           <button
             className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-l focus:outline-none"
-            disabled={currentPage === 1}
+            disabled={currentPage === 0}
             onClick={() => setCurrentPage(currentPage - 1)}
           >
             &larr; Prev