From 38884e4d7a76c69d4c71bf2ba96f75b52367fab9 Mon Sep 17 00:00:00 2001 From: Krrish Dholakia Date: Wed, 18 Feb 2026 16:46:43 -0800 Subject: [PATCH] feat: add UI banner warning for detailed debug mode Add a prominent warning banner to the UI dashboard when detailed debug mode (LITELLM_LOG=DEBUG) is enabled. This alerts users to significant performance degradation caused by extensive diagnostic logging. Backend changes: - Enhanced /health/readiness endpoint to include log_level and is_detailed_debug fields - Added detection using verbose_logger.getEffectiveLevel() - Backward compatible - old clients ignore new fields Frontend changes: - Updated useHealthReadiness TypeScript interface - Created DebugWarningBanner component using Ant Design Alert - Integrated banner into dashboard layout below navbar - Banner only shows when DEBUG level is active - Non-dismissible to ensure users are aware of performance impact Co-Authored-By: Claude Opus 4.6 --- .../health_endpoints/_health_endpoints.py | 23 +++++++------ .../healthReadiness/useHealthReadiness.ts | 2 ++ .../src/app/(dashboard)/layout.tsx | 2 ++ .../src/components/DebugWarningBanner.tsx | 32 +++++++++++++++++++ 4 files changed, 49 insertions(+), 10 deletions(-) create mode 100644 ui/litellm-dashboard/src/components/DebugWarningBanner.tsx diff --git a/litellm/proxy/health_endpoints/_health_endpoints.py b/litellm/proxy/health_endpoints/_health_endpoints.py index da90696ec2d..7c6521903fe 100644 --- a/litellm/proxy/health_endpoints/_health_endpoints.py +++ b/litellm/proxy/health_endpoints/_health_endpoints.py @@ -1,5 +1,6 @@ import asyncio import copy +import logging import os import time import traceback @@ -10,8 +11,9 @@ import fastapi from fastapi import APIRouter, Depends, HTTPException, Request, Response, status import litellm -from litellm._logging import verbose_proxy_logger +from litellm._logging import verbose_logger, verbose_proxy_logger from litellm.constants import HEALTH_CHECK_TIMEOUT_SECONDS +from litellm.litellm_core_utils.custom_logger_registry import CustomLoggerRegistry from litellm.llms.custom_httpx.http_handler import AsyncHTTPHandler from litellm.proxy._types import ( AlertType, @@ -32,7 +34,6 @@ from litellm.proxy.health_check import ( run_with_timeout, ) from litellm.secret_managers.main import get_secret -from litellm.litellm_core_utils.custom_logger_registry import CustomLoggerRegistry #### Health ENDPOINTS #### @@ -1007,10 +1008,7 @@ async def shared_health_check_status_endpoint( def _read_license_data() -> Optional[Dict[str, Any]]: - from litellm.proxy.proxy_server import ( - _license_check, - premium_user_data, - ) + from litellm.proxy.proxy_server import _license_check, premium_user_data license_data: Optional[EnterpriseLicenseData] = ( premium_user_data or _license_check.airgapped_license_data @@ -1054,10 +1052,7 @@ async def health_license_endpoint( user_api_key_dict: UserAPIKeyAuth = Depends(user_api_key_auth), ): """Return metadata about the configured LiteLLM license without exposing the key.""" - from litellm.proxy.proxy_server import ( - _license_check, - premium_user, - ) + from litellm.proxy.proxy_server import _license_check, premium_user license_data = _read_license_data() has_license = bool(getattr(_license_check, "license_str", None)) @@ -1251,6 +1246,10 @@ async def health_readiness(): index_info = "index does not exist - error: " + str(e) cache_type = {"type": cache_type, "index_info": index_info} + # check log level + log_level_name = logging.getLevelName(verbose_logger.getEffectiveLevel()) + is_detailed_debug = verbose_logger.isEnabledFor(logging.DEBUG) + # check DB if prisma_client is not None: # if db passed in, check if it's connected db_health_status = await _db_health_readiness_check() @@ -1261,6 +1260,8 @@ async def health_readiness(): "litellm_version": version, "success_callbacks": success_callback_names, "use_aiohttp_transport": AsyncHTTPHandler._should_use_aiohttp_transport(), + "log_level": log_level_name, + "is_detailed_debug": is_detailed_debug, **db_health_status, } else: @@ -1271,6 +1272,8 @@ async def health_readiness(): "litellm_version": version, "success_callbacks": success_callback_names, "use_aiohttp_transport": AsyncHTTPHandler._should_use_aiohttp_transport(), + "log_level": log_level_name, + "is_detailed_debug": is_detailed_debug, } except Exception as e: raise HTTPException(status_code=503, detail=f"Service Unhealthy ({str(e)})") diff --git a/ui/litellm-dashboard/src/app/(dashboard)/hooks/healthReadiness/useHealthReadiness.ts b/ui/litellm-dashboard/src/app/(dashboard)/hooks/healthReadiness/useHealthReadiness.ts index db394b9f7f8..10d29d86ad7 100644 --- a/ui/litellm-dashboard/src/app/(dashboard)/hooks/healthReadiness/useHealthReadiness.ts +++ b/ui/litellm-dashboard/src/app/(dashboard)/hooks/healthReadiness/useHealthReadiness.ts @@ -6,6 +6,8 @@ const healthReadinessKeys = createQueryKeys("healthReadiness"); interface HealthReadinessResponse { litellm_version?: string; + log_level?: string; + is_detailed_debug?: boolean; [key: string]: any; } diff --git a/ui/litellm-dashboard/src/app/(dashboard)/layout.tsx b/ui/litellm-dashboard/src/app/(dashboard)/layout.tsx index b387380ff72..1cf7adf1ea9 100644 --- a/ui/litellm-dashboard/src/app/(dashboard)/layout.tsx +++ b/ui/litellm-dashboard/src/app/(dashboard)/layout.tsx @@ -6,6 +6,7 @@ import { ThemeProvider } from "@/contexts/ThemeContext"; import Sidebar2 from "@/app/(dashboard)/components/Sidebar2"; import useAuthorized from "@/app/(dashboard)/hooks/useAuthorized"; import { useRouter, useSearchParams } from "next/navigation"; +import { DebugWarningBanner } from "@/components/DebugWarningBanner"; /** ---- BASE URL HELPERS ---- */ function normalizeBasePrefix(raw: string | undefined | null): string { @@ -61,6 +62,7 @@ function LayoutContent({ children }: { children: React.ReactNode }) { isDarkMode={false} toggleDarkMode={() => { }} /> +
diff --git a/ui/litellm-dashboard/src/components/DebugWarningBanner.tsx b/ui/litellm-dashboard/src/components/DebugWarningBanner.tsx new file mode 100644 index 00000000000..e4b2ab69a18 --- /dev/null +++ b/ui/litellm-dashboard/src/components/DebugWarningBanner.tsx @@ -0,0 +1,32 @@ +"use client"; + +import React from "react"; +import { Alert } from "antd"; +import { useHealthReadiness } from "@/app/(dashboard)/hooks/healthReadiness/useHealthReadiness"; + +export const DebugWarningBanner: React.FC = () => { + const { data: healthData } = useHealthReadiness(); + + // Only show banner if detailed debug mode is explicitly enabled + if (!healthData?.is_detailed_debug) { + return null; + } + + return ( + + Detailed debug logging (LITELLM_LOG=DEBUG) is currently + enabled. This mode logs extensive diagnostic information and will + significantly degrade performance. It should only be used for + troubleshooting and disabled in production environments. + + } + type="warning" + showIcon + banner + style={{ marginBottom: 0, borderRadius: 0 }} + /> + ); +};