diff --git a/ui/litellm-dashboard/src/components/view_users.tsx b/ui/litellm-dashboard/src/components/view_users.tsx index e409fea00a..99ae2c979e 100644 --- a/ui/litellm-dashboard/src/components/view_users.tsx +++ b/ui/litellm-dashboard/src/components/view_users.tsx @@ -278,6 +278,35 @@ const ViewUserDashboard: React.FC = ({ } }; + const handlePageChange = async (newPage: number) => { + if (!accessToken || !token || !userRole || !userID) { + return; + } + + try { + const userDataResponse = await userListCall( + accessToken, + filters.user_id ? [filters.user_id] : null, + newPage, + defaultPageSize, + filters.email || null, + filters.user_role || null, + filters.team || null + ); + + // Update session storage with new data + sessionStorage.setItem( + `userList_${newPage}`, + JSON.stringify(userDataResponse) + ); + + setUserListResponse(userDataResponse); + setCurrentPage(newPage); + } catch (error) { + console.error("Error changing page:", error); + } + }; + useEffect(() => { if (!accessToken || !token || !userRole || !userID) { return; @@ -515,8 +544,8 @@ const ViewUserDashboard: React.FC = ({ )} - {/* Results Count */} -
+ {/* Results Count and Pagination */} +
Showing{" "} {userListResponse && userListResponse.users && userListResponse.users.length > 0 @@ -531,6 +560,32 @@ const ViewUserDashboard: React.FC = ({ : 0}{" "} of {userListResponse ? userListResponse.total : 0} results + + {/* Pagination Buttons */} +
+ + +