refactor(ui): drop unreferenced locals from dashboard route components

@typescript-eslint/no-unused-vars is disabled in the dashboard eslint
config, so unused locals accumulated with nothing to catch them. This is
the first slice: symbols under src/app that no code reads.

Every removal is an unused import, an unused interface or type alias, or a
local const whose only mention was its own declaration. Nothing else on the
touched lines changes, so no behavior moves with it.

Part of LIT-5162.

ui/litellm-dashboard/src/app/(dashboard)/caching/_components/cache_dashboard.tsx

@@ -65,32 +65,7 @@ interface CachePageProps {
   premiumUser: boolean;
 }
 
-interface CacheHealthResponse {
-  status?: string;
-  cache_type?: string;
-  ping_response?: boolean;
-  set_cache_response?: string;
-  litellm_cache_params?: string;
-  error?: {
-    message: string;
-    type: string;
-    param: string;
-    code: string;
-  };
-}
-
 // Helper function to deep-parse a JSON string if possible
-const deepParse = (input: any) => {
-  let parsed = input;
-  if (typeof parsed === "string") {
-    try {
-      parsed = JSON.parse(parsed);
-    } catch {
-      return parsed;
-    }
-  }
-  return parsed;
-};
 
 const CacheDashboard: React.FC<CachePageProps> = ({ accessToken, token, userRole, userID, premiumUser }) => {
   const [selectedApiKeys, setSelectedApiKeys] = useState<string[]>([]);

ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/provider_margin_table.tsx

@@ -69,14 +69,6 @@ const ProviderMarginTable: React.FC<ProviderMarginTableProps> = ({
     setEditFixedAmount("");
   };
 
-  const handleKeyDown = (e: React.KeyboardEvent, provider: string) => {
-    if (e.key === "Enter") {
-      handleSaveEdit(provider);
-    } else if (e.key === "Escape") {
-      handleCancelEdit();
-    }
-  };
-
   const formatMargin = (margin: number | { percentage?: number; fixed_amount?: number }): string => {
     if (typeof margin === "number") {
       return `${(margin * 100).toFixed(1)}%`;

ui/litellm-dashboard/src/app/(dashboard)/guardrails-monitor/_components/GuardrailDetail.tsx

@@ -25,7 +25,7 @@ const statusColors: Record<string, { bg: string; text: string; dot: string }> =
 export function GuardrailDetail({ guardrailId, onBack, accessToken = null, startDate, endDate }: GuardrailDetailProps) {
   const [activeTab, setActiveTab] = useState("overview");
   const [evaluationModalOpen, setEvaluationModalOpen] = useState(false);
-  const [logsPage, setLogsPage] = useState(1);
+  const [logsPage] = useState(1);
   const logsPageSize = 50;
 
   const {

ui/litellm-dashboard/src/app/(dashboard)/guardrails/_components/GuardrailTestResults.tsx

@@ -1,11 +1,8 @@
 import React, { useState } from "react";
 import { Button, Card } from "@tremor/react";
-import { Typography } from "antd";
 import { CopyOutlined, CheckCircleOutlined, ClockCircleOutlined, DownOutlined, RightOutlined } from "@ant-design/icons";
 import NotificationsManager from "@/components/molecules/notifications_manager";
 
-const { Text } = Typography;
-
 interface TestResult {
   guardrailName: string;
   response_text: string;

ui/litellm-dashboard/src/app/(dashboard)/guardrails/_components/content_filter/KeywordTable.tsx

@@ -1,8 +1,7 @@
 import { DeleteOutlined } from "@ant-design/icons";
-import { Button, Select, Table, Typography } from "antd";
+import { Button, Select, Table } from "antd";
 import React from "react";
 
-const { Text } = Typography;
 const { Option } = Select;
 
 interface BlockedWord {

ui/litellm-dashboard/src/app/(dashboard)/guardrails/_components/guardrail_info.tsx

@@ -35,22 +35,6 @@ export interface GuardrailInfoProps {
   isAdmin: boolean;
 }
 
-interface ProviderParam {
-  param: string;
-  description: string;
-  required: boolean;
-  default_value?: string;
-  options?: string[];
-  type?: string;
-  fields?: { [key: string]: ProviderParam };
-  dict_key_options?: string[];
-  dict_value_type?: string;
-}
-
-interface ProviderParamsResponse {
-  [provider: string]: { [key: string]: ProviderParam };
-}
-
 const GuardrailInfoView: React.FC<GuardrailInfoProps> = ({ guardrailId, onClose, accessToken, isAdmin }) => {
   const [guardrailData, setGuardrailData] = useState<any>(null);
   const [guardrailProviderSpecificParams, setGuardrailProviderSpecificParams] = useState<any>(null);
@@ -244,11 +228,6 @@ const GuardrailInfoView: React.FC<GuardrailInfoProps> = ({ guardrailId, onClose,
     resetToolPermissionEditor();
   }, [resetToolPermissionEditor]);
 
-  const handleToolPermissionConfigChange = (config: ToolPermissionConfig) => {
-    setToolPermissionConfig(config);
-    setToolPermissionDirty(true);
-  };
-
   const handlePiiEntitySelect = (entity: string) => {
     setSelectedPiiEntities((prev) => {
       if (prev.includes(entity)) {

ui/litellm-dashboard/src/app/(dashboard)/mcp-servers/_components/CreateMCPServer.tsx

@@ -333,7 +333,6 @@ const CreateMCPServer: React.FC<CreateMCPServerProps> = ({
     if (!pendingRestoredValues) {
       return;
     }
-    const transportReady = transportType || pendingRestoredValues.transport || "";
     if (pendingRestoredValues.transport && !transportType) {
       // wait until transportType state catches up so the URL field is mounted
       return;

ui/litellm-dashboard/src/app/(dashboard)/mcp-servers/_components/mcp_connect.tsx

@@ -1,14 +1,13 @@
 /* eslint-disable react/no-unescaped-entities */
 
 import React, { useState } from "react";
-import { Card, Typography, Space, Alert, Button, Switch, Form, Collapse } from "antd";
+import { Card, Typography, Space, Alert, Button, Switch, Form } from "antd";
 import { TabPanel, TabPanels, TabGroup, TabList, Tab, Title as TremorTitle, Text as TremorText } from "@tremor/react";
 import { CopyIcon, Code, Terminal, Globe, CheckIcon, ExternalLinkIcon, KeyIcon, ServerIcon, Zap } from "lucide-react";
 import { getProxyBaseUrl } from "@/components/networking";
 import { copyToClipboard as utilCopyToClipboard } from "@/utils/dataUtils";
 
 const { Title, Text } = Typography;
-const { Panel } = Collapse;
 
 interface CodeBlockProps {
   code: string;
@@ -117,12 +116,6 @@ interface MCPConnectProps {
 const MCPConnect: React.FC<MCPConnectProps> = ({ currentServerAccessGroups = [] }) => {
   const proxyBaseUrl = getProxyBaseUrl();
   const [copiedStates, setCopiedStates] = useState<Record<string, boolean>>({});
-  const [serverHeaders, setServerHeaders] = useState<Record<string, string[]>>({
-    openai: [],
-    litellm: [],
-    cursor: [],
-    http: [],
-  });
   const [currentServer] = useState("Zapier_MCP"); // This should match the current server being viewed
 
   const copyToClipboard = async (text: string, key: string) => {
@@ -135,22 +128,6 @@ const MCPConnect: React.FC<MCPConnectProps> = ({ currentServerAccessGroups = []
     }
   };
 
-  const getHeadersConfig = (type: string) => {
-    const headers: Record<string, any> = {
-      "x-litellm-api-key": "Bearer YOUR_LITELLM_API_KEY",
-    };
-
-    if (serverHeaders[type]?.length > 0) {
-      // Format server names (replace spaces with underscores)
-      const formattedServers = serverHeaders[type].map((s) => s.replace(/\s+/g, "_"));
-
-      // Use comma-separated string (can include both servers and access groups)
-      headers["x-mcp-servers"] = formattedServers.join(",");
-    }
-
-    return headers;
-  };
-
   const CodeBlock: React.FC<{
     code: string;
     copyKey: string;

ui/litellm-dashboard/src/app/(dashboard)/playground/components/chat_ui/ChatUI.tsx

@@ -7,7 +7,6 @@ import {
   CodeOutlined,
   DatabaseOutlined,
   DeleteOutlined,
-  FilePdfOutlined,
   InfoCircleOutlined,
   KeyOutlined,
   LinkOutlined,
@@ -19,12 +18,10 @@ import {
   SoundOutlined,
   TagsOutlined,
   ToolOutlined,
-  UserOutlined,
 } from "@ant-design/icons";
 import { Card, Text, TextInput, Title, Button as TremorButton } from "@tremor/react";
 import { Button, Input, Modal, Popover, Select, Spin, Tooltip, Upload } from "antd";
 import React, { useEffect, useRef, useState } from "react";
-import ReactMarkdown from "react-markdown";
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
 import { coy } from "react-syntax-highlighter/dist/esm/styles/prism";
 import { v4 as uuidv4 } from "uuid";
@@ -50,14 +47,10 @@ import { makeOpenAIImageEditsRequest } from "../../llm_calls/image_edits";
 import { makeOpenAIImageGenerationRequest } from "../../llm_calls/image_generation";
 import { makeOpenAIResponsesRequest } from "@/components/llm_calls/responses_api";
 import { makeInteractionsRequest } from "../../llm_calls/interactions_api";
-import A2AMetrics from "./A2AMetrics";
 import AdditionalModelSettings from "./AdditionalModelSettings";
-import AudioRenderer from "./AudioRenderer";
 import { OPEN_AI_VOICE_SELECT_OPTIONS, OpenAIVoice } from "./chatConstants";
-import ChatImageRenderer from "./ChatImageRenderer";
 import ChatImageUpload from "./ChatImageUpload";
 import { createChatDisplayMessage, createChatMultimodalMessage } from "./ChatImageUtils";
-import CodeInterpreterOutput from "./CodeInterpreterOutput";
 import CodeInterpreterTool from "./CodeInterpreterTool";
 import { generateCodeSnippet } from "@/components/chat_ui/CodeSnippets";
 import EndpointSelector from "./EndpointSelector";
@@ -65,15 +58,11 @@ import FilePreviewCard from "./FilePreviewCard";
 import ChatMessageBubble from "./ChatMessageBubble";
 import MCPEventsDisplay from "@/components/chat_ui/MCPEventsDisplay";
 import { EndpointType, getEndpointType } from "@/components/chat_ui/mode_endpoint_mapping";
-import ReasoningContent from "@/components/chat_ui/ReasoningContent";
-import ResponseMetrics, { TokenUsage } from "@/components/chat_ui/ResponseMetrics";
-import ResponsesImageRenderer from "./ResponsesImageRenderer";
 import ResponsesImageUpload from "./ResponsesImageUpload";
 import { createDisplayMessage, createMultimodalMessage } from "./ResponsesImageUtils";
-import { SearchResultsDisplay } from "./SearchResultsDisplay";
 import SessionManagement from "./SessionManagement";
 import RealtimePlayground from "./RealtimePlayground";
-import { A2ATaskMetadata, MessageType } from "@/components/chat_ui/types";
+import { MessageType } from "@/components/chat_ui/types";
 import { useCodeInterpreter } from "../../hooks/useCodeInterpreter";
 import { useChatHistory } from "../../hooks/useChatHistory";
 import { getSecureItem, setSecureItem } from "@/utils/secureStorage";
@@ -147,13 +136,10 @@ const ChatUI: React.FC<ChatUIProps> = ({
     chatHistory,
     setChatHistory,
     mcpEvents,
-    setMCPEvents,
     messageTraceId,
     setMessageTraceId,
     responsesSessionId,
-    setResponsesSessionId,
     useApiSessionManagement,
-    setUseApiSessionManagement,
     updateTextUI,
     updateReasoningContent,
     updateTimingData,
@@ -604,7 +590,7 @@ const ChatUI: React.FC<ChatUIProps> = ({
         return;
       }
       // Resolve the real server ID (toolsets use toolset: prefix)
-      const mcpServerId = rawSelected.startsWith("toolset:") ? rawSelected : rawSelected;
+      rawSelected.startsWith("toolset:") ? rawSelected : rawSelected;
       if (!selectedMCPDirectTool) {
         NotificationsManager.fromBackend("Please select an MCP tool to call");
         return;

ui/litellm-dashboard/src/app/(dashboard)/playground/components/chat_ui/RealtimePlayground.tsx

@@ -37,8 +37,6 @@ const RealtimePlayground: React.FC<RealtimePlaygroundProps> = ({
   const audioContextRef = useRef<AudioContext | null>(null);
   const mediaStreamRef = useRef<MediaStream | null>(null);
   const processorRef = useRef<ScriptProcessorNode | null>(null);
-  const playbackQueueRef = useRef<ArrayBuffer[]>([]);
-  const isPlayingRef = useRef(false);
   const messagesEndRef = useRef<HTMLDivElement>(null);
   const nextPlayTimeRef = useRef(0);
 

ui/litellm-dashboard/src/app/(dashboard)/prompts/_components/add_prompt_form.tsx

@@ -15,12 +15,6 @@ interface AddPromptFormProps {
   onSuccess: () => void;
 }
 
-interface PromptFormData {
-  prompt_id: string;
-  prompt_integration: string;
-  prompt_file?: File;
-}
-
 const AddPromptForm: React.FC<AddPromptFormProps> = ({ visible, onClose, accessToken, onSuccess }) => {
   const [form] = Form.useForm();
   const [loading, setLoading] = useState(false);

ui/litellm-dashboard/src/app/(dashboard)/prompts/_components/index.tsx

@@ -47,7 +47,7 @@ const PromptsPanel: React.FC<PromptsProps> = ({ accessToken, userRole }) => {
   const [isDeleting, setIsDeleting] = useState(false);
   const [promptToDelete, setPromptToDelete] = useState<{ id: string; name: string } | null>(null);
 
-  const isAdmin = userRole ? isAdminRole(userRole) : false;
+  userRole ? isAdminRole(userRole) : false;
   // Admin Viewer follows the read-parity rule: see prompts, no writes.
   const canModify = userRole ? isProxyAdminRole(userRole) : false;
 

ui/litellm-dashboard/src/app/(dashboard)/prompts/_components/prompt_editor_view/index.tsx

@@ -44,7 +44,7 @@ const PromptEditorView: React.FC<PromptEditorViewProps> = ({ onClose, onSuccess,
   };
 
   const [prompt, setPrompt] = useState<PromptType>(getInitialPrompt());
-  const [editMode, setEditMode] = useState<boolean>(!!initialPromptData);
+  const [editMode] = useState<boolean>(!!initialPromptData);
   const [showHistoryModal, setShowHistoryModal] = useState(false);
 
   // Construct versioned ID from prompt_id and version field

ui/litellm-dashboard/src/app/(dashboard)/transform-request/TransformRequestPanel.tsx

@@ -11,12 +11,6 @@ interface TransformRequestPanelProps {
   accessToken: string | null;
 }
 
-interface TransformResponse {
-  raw_request_api_base: string;
-  raw_request_body: Record<string, any>;
-  raw_request_headers: Record<string, string>;
-}
-
 const TransformRequestPanel: React.FC<TransformRequestPanelProps> = ({ accessToken }) => {
   const [originalRequestJSON, setOriginalRequestJSON] = useState(`{
   "model": "openai/gpt-4o",

ui/litellm-dashboard/src/app/(dashboard)/usage/_components/components/UsagePageView.tsx

@@ -985,40 +985,5 @@ const UsagePage: React.FC<UsagePageProps> = ({ teams, organizations }) => {
 };
 
 // Add this helper function to process model-specific activity data
-const getModelActivityData = (userSpendData: { results: DailyData[]; metadata: any }) => {
-  const modelData: {
-    [key: string]: {
-      total_requests: number;
-      total_tokens: number;
-      daily_data: Array<{
-        date: string;
-        api_requests: number;
-        total_tokens: number;
-      }>;
-    };
-  } = {};
-
-  userSpendData.results.forEach((day: DailyData) => {
-    Object.entries(day.breakdown.models || {}).forEach(([model, metrics]) => {
-      if (!modelData[model]) {
-        modelData[model] = {
-          total_requests: 0,
-          total_tokens: 0,
-          daily_data: [],
-        };
-      }
-
-      modelData[model].total_requests += metrics.metrics.api_requests;
-      modelData[model].total_tokens += metrics.metrics.total_tokens;
-      modelData[model].daily_data.push({
-        date: day.date,
-        api_requests: metrics.metrics.api_requests,
-        total_tokens: metrics.metrics.total_tokens,
-      });
-    });
-  });
-
-  return modelData;
-};
 
 export default UsagePage;

ui/litellm-dashboard/src/app/(dashboard)/users/_components/edit_user.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { useEffect } from "react";
 import { TextInput, SelectItem } from "@tremor/react";
 
 import { Button as Button2, Modal, Form, Select as Select2, InputNumber } from "antd";
@@ -15,7 +15,6 @@ interface EditUserModalProps {
 }
 
 const EditUserModal: React.FC<EditUserModalProps> = ({ visible, possibleUIRoles, onCancel, user, onSubmit }) => {
-  const [editedUser, setEditedUser] = useState(user);
   const [form] = Form.useForm();
 
   useEffect(() => {

ui/litellm-dashboard/src/app/(dashboard)/vector-stores/_components/vector_store_info.tsx

@@ -36,7 +36,6 @@ const VectorStoreInfoView: React.FC<VectorStoreInfoViewProps> = ({
   const [isEditing, setIsEditing] = useState<boolean>(editVectorStore);
   const [metadataString, setMetadataString] = useState<string>("{}");
   const [credentials, setCredentials] = useState<CredentialItem[]>([]);
-  const [activeTab, setActiveTab] = useState<string>(editVectorStore ? "details" : "details");
 
   const fetchVectorStoreDetails = async () => {
     if (!accessToken) return;

ui/litellm-dashboard/src/app/chat/page.tsx

@@ -65,7 +65,6 @@ export default function ChatConversationPage() {
     updateLastAssistantMessage,
     truncateFromMessage,
   } = useChatShell();
-  const hadActiveConversationOnMountRef = useRef(activeConversationId !== null);
 
   const [selectedModel, setSelectedModel] = useState<string | null>(null);
   const [models, setModels] = useState<string[]>([]);