Add global filtering to Users tab (BerriAI#10195)

* style(internal_user_endpoints.py): add response model to `/user/list` endpoint make sure we maintain consistent response spec * fix(key_management_endpoints.py): return 'created_at' and 'updated_at' on `/key/generate` Show 'created_at' on UI when key created * test(test_keys.py): add e2e test to ensure created at is always returned * fix(view_users.tsx): support global search by user email allows easier search * test(search_users.spec.ts): add e2e test ensure user search works on admin ui * fix(view_users.tsx): support filtering user by role and user id More powerful filtering on internal users table * fix(view_users.tsx): allow filtering users by team * style(view_users.tsx): cleanup ui to show filters in consistent style * refactor(view_users.tsx): cleanup to just use 1 variable for the data * fix(view_users.tsx): cleanup use effect hooks * fix(internal_user_endpoints.py): fix check to pass testing * test: update tests * test: update tests * Revert "test: update tests" This reverts commit 6553eeb. * fix(view_userts.tsx): add back in 'previous' and 'next' tabs for pagination

Author: krrishdholakia

litellm/proxy/_experimental/out/onboarding.html

@@ -687,6 +687,8 @@ class GenerateKeyResponse(KeyRequestBase):
  token: Optional[str] = None
  created_by: Optional[str] = None
  updated_by: Optional[str] = None
+ created_at: Optional[datetime] = None
+ updated_at: Optional[datetime] = None
 
  @model_validator(mode="before")
  @classmethod

litellm/proxy/_types.py

@@ -43,6 +43,9 @@
  SpendAnalyticsPaginatedResponse,
  SpendMetrics,
 )
+from litellm.types.proxy.management_endpoints.internal_user_endpoints import (
+ UserListResponse,
+)
 
 router = APIRouter()
 
@@ -899,15 +902,11 @@ async def get_user_key_counts(
  return result
 
 
-@router.get(
- "/user/get_users",
- tags=["Internal User management"],
- dependencies=[Depends(user_api_key_auth)],
-)
 @router.get(
  "/user/list",
  tags=["Internal User management"],
  dependencies=[Depends(user_api_key_auth)],
+ response_model=UserListResponse,
 )
 async def get_users(
  role: Optional[str] = fastapi.Query(
@@ -916,15 +915,19 @@ async def get_users(
  user_ids: Optional[str] = fastapi.Query(
  default=None, description="Get list of users by user_ids"
  ),
+ user_email: Optional[str] = fastapi.Query(
+ default=None, description="Filter users by partial email match"
+ ),
+ team: Optional[str] = fastapi.Query(
+ default=None, description="Filter users by team id"
+ ),
  page: int = fastapi.Query(default=1, ge=1, description="Page number"),
  page_size: int = fastapi.Query(
  default=25, ge=1, le=100, description="Number of items per page"
  ),
 ):
  """
- Get a paginated list of users, optionally filtered by role.
-
- Used by the UI to populate the user lists.
+ Get a paginated list of users with filtering options.
 
  Parameters:
  role: Optional[str]
@@ -935,17 +938,17 @@ async def get_users(
  - internal_user_viewer
  user_ids: Optional[str]
  Get list of users by user_ids. Comma separated list of user_ids.
+ user_email: Optional[str]
+ Filter users by partial email match
+ team: Optional[str]
+ Filter users by team id. Will match if user has this team in their teams array.
  page: int
  The page number to return
  page_size: int
  The number of items per page
 
- Currently - admin-only endpoint.
-
- Example curl:
- ```
- http://0.0.0.0:4000/user/list?user_ids=default_user_id,693c1a4a-1cc0-4c7c-afe8-b5d2c8d52e17
- ```
+ Returns:
+ UserListResponse with filtered and paginated users
  """
  from litellm.proxy.proxy_server import prisma_client
 
@@ -958,35 +961,40 @@ async def get_users(
  # Calculate skip and take for pagination
  skip = (page - 1) * page_size
 
- # Prepare the query conditions
  # Build where conditions based on provided parameters
  where_conditions: Dict[str, Any] = {}
 
  if role:
- where_conditions["user_role"] = {
- "contains": role,
- "mode": "insensitive", # Case-insensitive search
- }
+ where_conditions["user_role"] = role # Exact match instead of contains
 
  if user_ids and isinstance(user_ids, str):
  user_id_list = [uid.strip() for uid in user_ids.split(",") if uid.strip()]
  where_conditions["user_id"] = {
- "in": user_id_list, # Now passing a list of strings as required by Prisma
+ "in": user_id_list,
  }
 
- users: Optional[
- List[LiteLLM_UserTable]
- ] = await prisma_client.db.litellm_usertable.find_many(
+ if user_email is not None and isinstance(user_email, str):
+ where_conditions["user_email"] = {
+ "contains": user_email,
+ "mode": "insensitive", # Case-insensitive search
+ }
+
+ if team is not None and isinstance(team, str):
+ where_conditions["teams"] = {
+ "has": team # Array contains for string arrays in Prisma
+ }
+
+ ## Filter any none fastapi.Query params - e.g. where_conditions: {'user_email': {'contains': Query(None), 'mode': 'insensitive'}, 'teams': {'has': Query(None)}}
+ where_conditions = {k: v for k, v in where_conditions.items() if v is not None}
+ users = await prisma_client.db.litellm_usertable.find_many(
  where=where_conditions,
  skip=skip,
  take=page_size,
  order={"created_at": "desc"},
  )
 
  # Get total count of user rows
- total_count = await prisma_client.db.litellm_usertable.count(
- where=where_conditions # type: ignore
- )
+ total_count = await prisma_client.db.litellm_usertable.count(where=where_conditions)
 
  # Get key count for each user
  if users is not None:
@@ -1009,7 +1017,7 @@ async def get_users(
  LiteLLM_UserTableWithKeyCount(
  **user.model_dump(), key_count=user_key_counts.get(user.user_id, 0)
  )
- ) # Return full key object
+ )
  else:
  user_list = []
 

litellm/proxy/management_endpoints/internal_user_endpoints.py

@@ -1347,10 +1347,13 @@ async def generate_key_helper_fn( # noqa: PLR0915
  create_key_response = await prisma_client.insert_data(
  data=key_data, table_name="key"
  )
+
  key_data["token_id"] = getattr(create_key_response, "token", None)
  key_data["litellm_budget_table"] = getattr(
  create_key_response, "litellm_budget_table", None
  )
+ key_data["created_at"] = getattr(create_key_response, "created_at", None)
+ key_data["updated_at"] = getattr(create_key_response, "updated_at", None)
  except Exception as e:
  verbose_proxy_logger.error(
  "litellm.proxy.proxy_server.generate_key_helper_fn(): Exception occured - {}".format(

litellm/proxy/management_endpoints/key_management_endpoints.py

@@ -0,0 +1,18 @@
+from typing import Any, Dict, List, Literal, Optional, Union
+
+from fastapi import HTTPException
+from pydantic import BaseModel, EmailStr
+
+from litellm.proxy._types import LiteLLM_UserTableWithKeyCount
+
+
+class UserListResponse(BaseModel):
+ """
+ Response model for the user list endpoint
+ """
+
+ users: List[LiteLLM_UserTableWithKeyCount]
+ total: int
+ page: int
+ page_size: int
+ total_pages: int

litellm/types/proxy/management_endpoints/internal_user_endpoints.py

@@ -0,0 +1,4 @@
+{
+ "status": "failed",
+ "failedTests": []
+}

test-results/.last-run.json

@@ -0,0 +1,119 @@
+/*
+Search Users in Admin UI
+E2E Test for user search functionality
+
+Tests:
+1. Navigate to Internal Users tab
+2. Verify search input exists
+3. Test search functionality
+4. Verify results update
+*/
+
+import { test, expect } from "@playwright/test";
+
+test("user search test", async ({ page }) => {
+ // Set a longer timeout for the entire test
+ test.setTimeout(60000);
+
+ // Enable console logging
+ page.on("console", (msg) => console.log("PAGE LOG:", msg.text()));
+
+ // Login first
+ await page.goto("http://localhost:4000/ui");
+ console.log("Navigated to login page");
+
+ // Wait for login form to be visible
+ await page.waitForSelector('input[name="username"]', { timeout: 10000 });
+ console.log("Login form is visible");
+
+ await page.fill('input[name="username"]', "admin");
+ await page.fill('input[name="password"]', "gm");
+ console.log("Filled login credentials");
+
+ const loginButton = page.locator('input[type="submit"]');
+ await expect(loginButton).toBeEnabled();
+ await loginButton.click();
+ console.log("Clicked login button");
+
+ // Wait for navigation to complete and dashboard to load
+ await page.waitForLoadState("networkidle");
+ console.log("Page loaded after login");
+
+ // Take a screenshot for debugging
+ await page.screenshot({ path: "after-login.png" });
+ console.log("Took screenshot after login");
+
+ // Try to find the Internal User tab with more debugging
+ console.log("Looking for Internal User tab...");
+ const internalUserTab = page.locator("span.ant-menu-title-content", {
+ hasText: "Internal User",
+ });
+
+ // Wait for the tab to be visible
+ await internalUserTab.waitFor({ state: "visible", timeout: 10000 });
+ console.log("Internal User tab is visible");
+
+ // Take another screenshot before clicking
+ await page.screenshot({ path: "before-tab-click.png" });
+ console.log("Took screenshot before tab click");
+
+ await internalUserTab.click();
+ console.log("Clicked Internal User tab");
+
+ // Wait for the page to load and table to be visible
+ await page.waitForSelector("tbody tr", { timeout: 10000 });
+ await page.waitForTimeout(2000); // Additional wait for table to stabilize
+ console.log("Table is visible");
+
+ // Take a final screenshot
+ await page.screenshot({ path: "after-tab-click.png" });
+ console.log("Took screenshot after tab click");
+
+ // Verify search input exists
+ const searchInput = page.locator('input[placeholder="Search by email..."]');
+ await expect(searchInput).toBeVisible();
+ console.log("Search input is visible");
+
+ // Test search functionality
+ const initialUserCount = await page.locator("tbody tr").count();
+ console.log(`Initial user count: ${initialUserCount}`);
+
+ // Perform a search
+ const testEmail = "test@";
+ await searchInput.fill(testEmail);
+ console.log("Filled search input");
+
+ // Wait for the debounced search to complete
+ await page.waitForTimeout(500);
+ console.log("Waited for debounce");
+
+ // Wait for the results count to update
+ await page.waitForFunction((initialCount) => {
+ const currentCount = document.querySelectorAll("tbody tr").length;
+ return currentCount !== initialCount;
+ }, initialUserCount);
+ console.log("Results updated");
+
+ const filteredUserCount = await page.locator("tbody tr").count();
+ console.log(`Filtered user count: ${filteredUserCount}`);
+
+ expect(filteredUserCount).toBeDefined();
+
+ // Clear the search
+ await searchInput.clear();
+ console.log("Cleared search");
+
+ await page.waitForTimeout(500);
+ console.log("Waited for debounce after clear");
+
+ await page.waitForFunction((initialCount) => {
+ const currentCount = document.querySelectorAll("tbody tr").length;
+ return currentCount === initialCount;
+ }, initialUserCount);
+ console.log("Results reset");
+
+ const resetUserCount = await page.locator("tbody tr").count();
+ console.log(`Reset user count: ${resetUserCount}`);
+
+ expect(resetUserCount).toBe(initialUserCount);
+});