From b7eee5c1f702b7b9d9070c0593a47fcb1291ce07 Mon Sep 17 00:00:00 2001 From: Cursor Agent Date: Thu, 23 Apr 2026 21:56:33 +0000 Subject: [PATCH] chore(ui): bulk antd icons \u2192 lucide aliases (37-file batch) Scripted pass over all files with @ant-design/icons imports that only contain icons covered by our mapping table. Each file now imports lucide icons with 'Outlined' aliases so existing JSX continues to work unchanged. Icons mapped: - Info/Settings/RefreshCcw/Loader2/Search/ArrowLeft/ArrowRight/ ChevronDown/ChevronRight/ChevronUp/ChevronLeft/Plus/PlusCircle/ Minus/MinusCircle/Trash2/Pencil/Copy/Check/CheckCircle2/X/XCircle/ AlertTriangle/AlertCircle/HelpCircle/Wrench/Key/Bot/History/Save/ Globe/Cloud/Server/Database/Upload/Download/Inbox/Link/Ban/EyeOff/ Eye/Code/FileText/File/Clock/User/UserPlus/Users/LayoutGrid/ GitBranch/Zap/Plug/Menu/Filter/MoreHorizontal/Image/Video/Mic/ MapPin/ChevronsUpDown. Fixups applied after the bulk pass: - 'spin' prop is antd-specific; replaced with className='animate-spin' in audit_logs, multi_cost_results, ProjectDetailsPage, SearchToolTester, EntityUsage, UsagePageView, ai_suggestion_modal. - agents/add_agent_form: InfoCircleOutlined title/style props (antd) \u2192 aria-label + Tailwind utilities (lucide React.SVGProps). After this pass: @ant-design/icons usage drops from 48 \u2192 11 files. The remaining 11 files import icon names outside the mapping table and will be migrated individually. Gates: TS \u2713 | Build \u2713. Co-authored-by: yuneng-jiang --- ui/litellm-dashboard/src/app/login/LoginPage.tsx | 2 +- .../pricing_calculator/multi_cost_results.tsx | 12 ++++++------ ui/litellm-dashboard/src/components/OldTeams.tsx | 7 +------ .../src/components/Projects/ProjectDetailsPage.tsx | 6 +++--- .../src/components/SearchTools/SearchToolTester.tsx | 4 ++-- .../UsagePage/components/EntityUsage/EntityUsage.tsx | 6 +++--- .../UsagePage/components/UsagePageView.tsx | 8 ++++---- .../src/components/add_model/add_auto_router_tab.tsx | 3 +-- .../src/components/add_model/advanced_settings.tsx | 2 +- .../src/components/add_pass_through.tsx | 5 +---- .../src/components/agents/add_agent_form.tsx | 4 ++-- .../src/components/chat/ChatMessages.tsx | 2 +- .../src/components/chat/MCPAppsPanel.tsx | 2 +- .../components/claude_code_plugins/skill_detail.tsx | 2 +- .../content_filter/ContentCategoryConfiguration.tsx | 2 +- .../content_filter/ContentFilterConfiguration.tsx | 2 +- .../src/components/guardrails/guardrail_info.tsx | 2 +- .../tool_permission/ToolPermissionRulesEditor.tsx | 3 +-- .../src/components/mcp_tools/ToolTestPanel.tsx | 2 +- .../src/components/mcp_tools/create_mcp_server.tsx | 2 +- .../src/components/mcp_tools/mcp_server_edit.tsx | 2 +- .../src/components/mcp_tools/mcp_servers.tsx | 2 +- .../components/mcp_tools/mcp_tool_configuration.tsx | 2 +- .../src/components/mcp_tools/mcp_tools.tsx | 2 +- .../src/components/model_info_view.tsx | 2 +- .../src/components/molecules/models/columns.tsx | 2 +- .../src/components/organisms/create_key_button.tsx | 2 +- .../src/components/organizations.tsx | 2 +- .../src/components/policies/ai_suggestion_modal.tsx | 2 +- .../src/components/policies/index.tsx | 2 +- .../src/components/price_data_reload.tsx | 2 +- .../src/components/team/TeamInfo.tsx | 2 +- .../src/components/team/TeamVirtualKeysTable.tsx | 2 +- .../src/components/templates/key_edit_view.tsx | 2 +- .../vector_store_management/CreateVectorStore.tsx | 2 +- .../view_logs/LogDetailsDrawer/LogDetailsDrawer.tsx | 7 +------ .../src/components/view_logs/audit_logs.tsx | 6 +++--- 37 files changed, 53 insertions(+), 68 deletions(-) diff --git a/ui/litellm-dashboard/src/app/login/LoginPage.tsx b/ui/litellm-dashboard/src/app/login/LoginPage.tsx index 7ad3e32ef5c..f8ee570cd19 100644 --- a/ui/litellm-dashboard/src/app/login/LoginPage.tsx +++ b/ui/litellm-dashboard/src/app/login/LoginPage.tsx @@ -7,7 +7,7 @@ import { exchangeLoginCode, getProxyBaseUrl, switchToWorkerUrl } from "@/compone import { clearTokenCookies, getCookie } from "@/utils/cookieUtils"; import { isJwtExpired } from "@/utils/jwtUtils"; import { consumeReturnUrl, getReturnUrl, isValidReturnUrl } from "@/utils/returnUrlUtils"; -import { InfoCircleOutlined, CloudServerOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined, Server as CloudServerOutlined } from "lucide-react"; import { Alert, Button, Card, Form, Input, Popover, Select, Space, Typography } from "antd"; import { useRouter } from "next/navigation"; import { useEffect, useState } from "react"; diff --git a/ui/litellm-dashboard/src/components/CostTrackingSettings/pricing_calculator/multi_cost_results.tsx b/ui/litellm-dashboard/src/components/CostTrackingSettings/pricing_calculator/multi_cost_results.tsx index 7467c471813..f56551961b2 100644 --- a/ui/litellm-dashboard/src/components/CostTrackingSettings/pricing_calculator/multi_cost_results.tsx +++ b/ui/litellm-dashboard/src/components/CostTrackingSettings/pricing_calculator/multi_cost_results.tsx @@ -2,7 +2,7 @@ import React, { useState } from "react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Text, Button } from "@tremor/react"; import { Card, Statistic, Row, Col, Divider, Spin, Table, Tag } from "antd"; -import { LoadingOutlined, DownOutlined, RightOutlined } from "@ant-design/icons"; +import { Loader2 as LoadingOutlined, ChevronDown as DownOutlined, ChevronRight as RightOutlined } from "lucide-react"; import { CostEstimateResponse } from "../types"; import { formatNumberWithCommas } from "@/utils/dataUtils"; import { MultiModelResult } from "./types"; @@ -42,7 +42,7 @@ const SingleModelBreakdown: React.FC<{
{loading && (
- } size="small" /> + } size="small" /> Updating...
)} @@ -134,7 +134,7 @@ const MultiCostResults: React.FC = ({ multiResult, timePe if (!hasAnyResult && isAnyLoading && !hasAnyError) { return (
- } /> + } /> Calculating costs...
); @@ -147,7 +147,7 @@ const MultiCostResults: React.FC = ({ multiResult, timePe
Cost Estimates - {isAnyLoading && } size="small" />} + {isAnyLoading && } size="small" />}
{/* Error Messages */} {errorEntries.map((e) => ( @@ -192,7 +192,7 @@ const MultiCostResults: React.FC = ({ multiResult, timePe )} {record.loading && ( - } size="small" /> + } size="small" /> )}
{record.error && ( @@ -281,7 +281,7 @@ const MultiCostResults: React.FC = ({ multiResult, timePe
Cost Estimates
- {isAnyLoading && } size="small" />} + {isAnyLoading && } size="small" />}
diff --git a/ui/litellm-dashboard/src/components/OldTeams.tsx b/ui/litellm-dashboard/src/components/OldTeams.tsx index 30c40d86237..ae2042916e7 100644 --- a/ui/litellm-dashboard/src/components/OldTeams.tsx +++ b/ui/litellm-dashboard/src/components/OldTeams.tsx @@ -3,12 +3,7 @@ import AvailableTeamsPanel from "@/components/team/available_teams"; import TeamInfoView from "@/components/team/TeamInfo"; import TeamSSOSettings from "@/components/TeamSSOSettings"; import { isProxyAdminRole } from "@/utils/roles"; -import { - InfoCircleOutlined, - PlusOutlined, - TeamOutlined, - ReloadOutlined, -} from "@ant-design/icons"; +import { Info as InfoCircleOutlined, Plus as PlusOutlined, Users as TeamOutlined, RefreshCcw as ReloadOutlined } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Accordion, diff --git a/ui/litellm-dashboard/src/components/Projects/ProjectDetailsPage.tsx b/ui/litellm-dashboard/src/components/Projects/ProjectDetailsPage.tsx index 4c911207fc3..977258c4dcf 100644 --- a/ui/litellm-dashboard/src/components/Projects/ProjectDetailsPage.tsx +++ b/ui/litellm-dashboard/src/components/Projects/ProjectDetailsPage.tsx @@ -15,7 +15,7 @@ import { theme, Typography, } from "antd"; -import { LoadingOutlined } from "@ant-design/icons"; +import { Loader2 as LoadingOutlined } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { BarChart } from "@tremor/react"; import { ArrowLeftIcon, DollarSignIcon, EditIcon, KeyIcon, UsersIcon } from "lucide-react"; @@ -72,7 +72,7 @@ export function ProjectDetail({ projectId, onBack }: ProjectDetailProps) { }} > - } size="large" /> + } size="large" /> ); @@ -311,7 +311,7 @@ export function ProjectDetail({ projectId, onBack }: ProjectDetailProps) { })() ) : project.team_id ? ( - } size="small" /> + } size="small" /> ) : ( diff --git a/ui/litellm-dashboard/src/components/SearchTools/SearchToolTester.tsx b/ui/litellm-dashboard/src/components/SearchTools/SearchToolTester.tsx index ebb44675623..a61984d6a6c 100644 --- a/ui/litellm-dashboard/src/components/SearchTools/SearchToolTester.tsx +++ b/ui/litellm-dashboard/src/components/SearchTools/SearchToolTester.tsx @@ -1,7 +1,7 @@ import React, { useState } from "react"; import { Button, Input, Typography, Spin } from "antd"; import MessageManager from "@/components/molecules/message_manager"; -import { SearchOutlined, LoadingOutlined } from "@ant-design/icons"; +import { Search as SearchOutlined, Loader2 as LoadingOutlined } from "lucide-react"; import { searchToolQueryCall } from "../networking"; import NotificationsManager from "../molecules/notifications_manager"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports @@ -88,7 +88,7 @@ export const SearchToolTester: React.FC = ({ searchToolNa })); }; - const antIcon = ; + const antIcon = ; const latestResults = searchHistory.length > 0 ? searchHistory[0] : null; diff --git a/ui/litellm-dashboard/src/components/UsagePage/components/EntityUsage/EntityUsage.tsx b/ui/litellm-dashboard/src/components/UsagePage/components/EntityUsage/EntityUsage.tsx index 77d1a8df6d1..232b32ebe7e 100644 --- a/ui/litellm-dashboard/src/components/UsagePage/components/EntityUsage/EntityUsage.tsx +++ b/ui/litellm-dashboard/src/components/UsagePage/components/EntityUsage/EntityUsage.tsx @@ -23,7 +23,7 @@ import { Text, Title, } from "@tremor/react"; -import { ExportOutlined, LoadingOutlined } from "@ant-design/icons"; +import { Upload as ExportOutlined, Loader2 as LoadingOutlined } from "lucide-react"; import { Alert, Button } from "antd"; import React, { useMemo, useState } from "react"; import TeamMultiSelect from "../../../common_components/team_multi_select"; @@ -406,7 +406,7 @@ const EntityUsage: React.FC = ({ accessToken, entityType, enti message={
- + Currently fetching spend data: fetched {progress.currentPage} / {progress.totalPages} pages. Charts will update periodically as data loads. Moving off of this page will stop and reset this. To continue using the UI in the meantime,{" "} @@ -442,7 +442,7 @@ const EntityUsage: React.FC = ({ accessToken, entityType, enti message={
- + Currently fetching agent data: fetched {agentProgress.currentPage} / {agentProgress.totalPages} pages. Charts will update periodically as data loads. Moving off of this page will stop and reset this. To continue using the UI in the meantime,{" "} diff --git a/ui/litellm-dashboard/src/components/UsagePage/components/UsagePageView.tsx b/ui/litellm-dashboard/src/components/UsagePage/components/UsagePageView.tsx index fae438406dc..3fef7d0770c 100644 --- a/ui/litellm-dashboard/src/components/UsagePage/components/UsagePageView.tsx +++ b/ui/litellm-dashboard/src/components/UsagePage/components/UsagePageView.tsx @@ -6,7 +6,7 @@ * Works at 1m+ spend logs, by querying an aggregate table instead. */ -import { DownOutlined, ExportOutlined, InfoCircleOutlined, LoadingOutlined, RightOutlined } from "@ant-design/icons"; +import { ChevronDown as DownOutlined, Upload as ExportOutlined, Info as InfoCircleOutlined, Loader2 as LoadingOutlined, ChevronRight as RightOutlined } from "lucide-react"; import { useDebouncedState } from "@tanstack/react-pacer/debouncer"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { @@ -449,7 +449,7 @@ const UsagePage: React.FC = ({ teams, organizations }) => { message={
- + Currently fetching spend data: fetched {paginatedResult.progress.currentPage} /{" "} {paginatedResult.progress.totalPages} pages. Charts will update periodically as data loads. Moving off of this page will stop and reset this. To continue using the UI in the meantime,{" "} @@ -496,14 +496,14 @@ const UsagePage: React.FC = ({ teams, organizations }) => { searchValue={userSearchInput} onPopupScroll={handleUserPopupScroll} loading={isLoadingUsers} - notFoundContent={isLoadingUsers ? : "No users found"} + notFoundContent={isLoadingUsers ? : "No users found"} options={userOptions} popupRender={(menu) => ( <> {menu} {isFetchingNextUsersPage && (
- +
)} diff --git a/ui/litellm-dashboard/src/components/add_model/add_auto_router_tab.tsx b/ui/litellm-dashboard/src/components/add_model/add_auto_router_tab.tsx index 3be8569dd86..eaaf701bf43 100644 --- a/ui/litellm-dashboard/src/components/add_model/add_auto_router_tab.tsx +++ b/ui/litellm-dashboard/src/components/add_model/add_auto_router_tab.tsx @@ -11,8 +11,7 @@ import { fetchAvailableModels, ModelGroup } from "../playground/llm_calls/fetch_ import RouterConfigBuilder from "./RouterConfigBuilder"; import ComplexityRouterConfig from "./ComplexityRouterConfig"; import NotificationManager from "../molecules/notifications_manager"; -import { ThunderboltOutlined, BranchesOutlined } from "@ant-design/icons"; - +import { Zap as ThunderboltOutlined, GitBranch as BranchesOutlined } from "lucide-react"; interface AddAutoRouterTabProps { form: FormInstance; handleOk: () => void; diff --git a/ui/litellm-dashboard/src/components/add_model/advanced_settings.tsx b/ui/litellm-dashboard/src/components/add_model/advanced_settings.tsx index 6f2f5febe66..b1d5ceeaf18 100644 --- a/ui/litellm-dashboard/src/components/add_model/advanced_settings.tsx +++ b/ui/litellm-dashboard/src/components/add_model/advanced_settings.tsx @@ -10,7 +10,7 @@ import { } from "@tremor/react"; import { Row, Col, Typography } from "antd"; import TextArea from "antd/es/input/TextArea"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; import { Team } from "../key_team_helpers/key_list"; import CacheControlSettings from "./cache_control_settings"; import VectorStoreSelector from "../vector_store_management/VectorStoreSelector"; diff --git a/ui/litellm-dashboard/src/components/add_pass_through.tsx b/ui/litellm-dashboard/src/components/add_pass_through.tsx index be16e95e215..48c62d2dfba 100644 --- a/ui/litellm-dashboard/src/components/add_pass_through.tsx +++ b/ui/litellm-dashboard/src/components/add_pass_through.tsx @@ -20,10 +20,7 @@ import { Alert, } from "antd"; import NumericalInput from "./shared/numerical_input"; -import { - InfoCircleOutlined, - ApiOutlined, -} from "@ant-design/icons"; +import { Info as InfoCircleOutlined, Plug as ApiOutlined } from "lucide-react"; import KeyValueInput from "./key_value_input"; import QueryParamInput from "./query_param_input"; import { passThroughItem } from "./pass_through_settings"; diff --git a/ui/litellm-dashboard/src/components/agents/add_agent_form.tsx b/ui/litellm-dashboard/src/components/agents/add_agent_form.tsx index dacd677124e..891e9c574d8 100644 --- a/ui/litellm-dashboard/src/components/agents/add_agent_form.tsx +++ b/ui/litellm-dashboard/src/components/agents/add_agent_form.tsx @@ -3,7 +3,7 @@ import { Modal, Form, Select, Input, Steps, Radio, Tag, Divider, Switch, InputNu // eslint-disable-next-line litellm-ui/no-banned-ui-imports import MessageManager from "@/components/molecules/message_manager"; import { Button } from "@tremor/react"; -import { CheckCircleFilled, KeyOutlined, RobotOutlined, AppstoreOutlined, InfoCircleOutlined } from "@ant-design/icons"; +import { CheckCircle2 as CheckCircleFilled, Key as KeyOutlined, Bot as RobotOutlined, LayoutGrid as AppstoreOutlined, Info as InfoCircleOutlined } from "lucide-react"; import CreatedKeyDisplay from "../shared/CreatedKeyDisplay"; import { createAgentCall, @@ -396,7 +396,7 @@ const AddAgentForm: React.FC = ({ label={ Allowed MCP Servers{" "} - + } name="allowed_mcp_servers_and_groups" diff --git a/ui/litellm-dashboard/src/components/chat/ChatMessages.tsx b/ui/litellm-dashboard/src/components/chat/ChatMessages.tsx index 2ff07c7065b..5ec77002cb5 100644 --- a/ui/litellm-dashboard/src/components/chat/ChatMessages.tsx +++ b/ui/litellm-dashboard/src/components/chat/ChatMessages.tsx @@ -1,6 +1,6 @@ "use client"; -import { ToolOutlined, CopyOutlined, CheckOutlined, EditOutlined } from "@ant-design/icons"; +import { Wrench as ToolOutlined, Copy as CopyOutlined, Check as CheckOutlined, Pencil as EditOutlined } from "lucide-react"; import { Collapse, Tooltip } from "antd"; import React, { useEffect, useRef, useState } from "react"; import ReactMarkdown from "react-markdown"; diff --git a/ui/litellm-dashboard/src/components/chat/MCPAppsPanel.tsx b/ui/litellm-dashboard/src/components/chat/MCPAppsPanel.tsx index d25db73ae46..de11c956e41 100644 --- a/ui/litellm-dashboard/src/components/chat/MCPAppsPanel.tsx +++ b/ui/litellm-dashboard/src/components/chat/MCPAppsPanel.tsx @@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useRef, useState } from "react"; import { Spin, Input, Button, Skeleton } from "antd"; -import { SearchOutlined, ArrowLeftOutlined, RightOutlined, ToolOutlined, CheckCircleOutlined } from "@ant-design/icons"; +import { Search as SearchOutlined, ArrowLeft as ArrowLeftOutlined, ChevronRight as RightOutlined, Wrench as ToolOutlined, CheckCircle2 as CheckCircleOutlined } from "lucide-react"; import { deleteMCPOAuthUserCredential, fetchMCPServers, getMCPOAuthUserCredentialStatus, listMCPTools } from "../networking"; import { AUTH_TYPE, MCPServer, MCPTool, handleTransport } from "../mcp_tools/types"; import MessageManager from "@/components/molecules/message_manager"; diff --git a/ui/litellm-dashboard/src/components/claude_code_plugins/skill_detail.tsx b/ui/litellm-dashboard/src/components/claude_code_plugins/skill_detail.tsx index b07dd07cd31..d757122d459 100644 --- a/ui/litellm-dashboard/src/components/claude_code_plugins/skill_detail.tsx +++ b/ui/litellm-dashboard/src/components/claude_code_plugins/skill_detail.tsx @@ -1,5 +1,5 @@ import React, { useState } from "react"; -import { ArrowLeftOutlined, CopyOutlined, CheckOutlined, LinkOutlined } from "@ant-design/icons"; +import { ArrowLeft as ArrowLeftOutlined, Copy as CopyOutlined, Check as CheckOutlined, Link as LinkOutlined } from "lucide-react"; import { formatInstallCommand } from "./helpers"; import { Plugin } from "./types"; diff --git a/ui/litellm-dashboard/src/components/guardrails/content_filter/ContentCategoryConfiguration.tsx b/ui/litellm-dashboard/src/components/guardrails/content_filter/ContentCategoryConfiguration.tsx index 6408d676587..fce448106f4 100644 --- a/ui/litellm-dashboard/src/components/guardrails/content_filter/ContentCategoryConfiguration.tsx +++ b/ui/litellm-dashboard/src/components/guardrails/content_filter/ContentCategoryConfiguration.tsx @@ -1,6 +1,6 @@ import React from "react"; import { Card, Typography, Select, Table, Tag, Collapse, Button } from "antd"; -import { DeleteOutlined, PlusOutlined, FileTextOutlined } from "@ant-design/icons"; +import { Trash2 as DeleteOutlined, Plus as PlusOutlined, FileText as FileTextOutlined } from "lucide-react"; import { getCategoryYaml } from "../../networking"; const { Title, Text } = Typography; diff --git a/ui/litellm-dashboard/src/components/guardrails/content_filter/ContentFilterConfiguration.tsx b/ui/litellm-dashboard/src/components/guardrails/content_filter/ContentFilterConfiguration.tsx index 99100677b2a..7851f57c998 100644 --- a/ui/litellm-dashboard/src/components/guardrails/content_filter/ContentFilterConfiguration.tsx +++ b/ui/litellm-dashboard/src/components/guardrails/content_filter/ContentFilterConfiguration.tsx @@ -1,6 +1,6 @@ import React, { useState } from "react"; import { Typography, Space, Upload, Card, Button } from "antd"; -import { PlusOutlined, UploadOutlined } from "@ant-design/icons"; +import { Plus as PlusOutlined, Upload as UploadOutlined } from "lucide-react"; import { validateBlockedWordsFile } from "../../networking"; import NotificationsManager from "../../molecules/notifications_manager"; import PatternModal from "./PatternModal"; diff --git a/ui/litellm-dashboard/src/components/guardrails/guardrail_info.tsx b/ui/litellm-dashboard/src/components/guardrails/guardrail_info.tsx index d1b42b95f3b..6008faf6b82 100644 --- a/ui/litellm-dashboard/src/components/guardrails/guardrail_info.tsx +++ b/ui/litellm-dashboard/src/components/guardrails/guardrail_info.tsx @@ -5,7 +5,7 @@ import { updateGuardrailCall, } from "@/components/networking"; import { copyToClipboard as utilCopyToClipboard } from "@/utils/dataUtils"; -import { CodeOutlined, EyeInvisibleOutlined, InfoCircleOutlined, StopOutlined } from "@ant-design/icons"; +import { Code as CodeOutlined, EyeOff as EyeInvisibleOutlined, Info as InfoCircleOutlined, Ban as StopOutlined } from "lucide-react"; import { ArrowLeft as ArrowLeftIcon } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { diff --git a/ui/litellm-dashboard/src/components/guardrails/tool_permission/ToolPermissionRulesEditor.tsx b/ui/litellm-dashboard/src/components/guardrails/tool_permission/ToolPermissionRulesEditor.tsx index a5a64874036..0cc4350a9a6 100644 --- a/ui/litellm-dashboard/src/components/guardrails/tool_permission/ToolPermissionRulesEditor.tsx +++ b/ui/litellm-dashboard/src/components/guardrails/tool_permission/ToolPermissionRulesEditor.tsx @@ -2,8 +2,7 @@ import React from "react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Card, Text } from "@tremor/react"; import { Button, Divider, Empty, Input, Select, Space, Tooltip } from "antd"; -import { InfoCircleOutlined, PlusOutlined, DeleteOutlined } from "@ant-design/icons"; - +import { Info as InfoCircleOutlined, Plus as PlusOutlined, Trash2 as DeleteOutlined } from "lucide-react"; export type ToolPermissionDecision = "allow" | "deny"; export type ToolPermissionDefaultAction = "allow" | "deny"; export type ToolPermissionOnDisallowedAction = "block" | "rewrite"; diff --git a/ui/litellm-dashboard/src/components/mcp_tools/ToolTestPanel.tsx b/ui/litellm-dashboard/src/components/mcp_tools/ToolTestPanel.tsx index 5a334656057..f94584d1964 100644 --- a/ui/litellm-dashboard/src/components/mcp_tools/ToolTestPanel.tsx +++ b/ui/litellm-dashboard/src/components/mcp_tools/ToolTestPanel.tsx @@ -3,7 +3,7 @@ import React from "react"; import { Button, TextInput } from "@tremor/react"; import { MCPTool, InputSchema, InputSchemaProperty } from "./types"; import { Form, Select, Tooltip } from "antd"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; import NotificationsManager from "../molecules/notifications_manager"; const isPlainObject = (value: unknown): value is Record => diff --git a/ui/litellm-dashboard/src/components/mcp_tools/create_mcp_server.tsx b/ui/litellm-dashboard/src/components/mcp_tools/create_mcp_server.tsx index 587e3e126b2..0417df85a90 100644 --- a/ui/litellm-dashboard/src/components/mcp_tools/create_mcp_server.tsx +++ b/ui/litellm-dashboard/src/components/mcp_tools/create_mcp_server.tsx @@ -1,6 +1,6 @@ import React, { useState } from "react"; import { Modal, Tooltip, Form, Select, Input, Switch, Collapse } from "antd"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Button, TextInput } from "@tremor/react"; import { createMCPServer, registerMCPServer } from "../networking"; diff --git a/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_edit.tsx b/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_edit.tsx index a4c1039a8bd..fc8ff14a29d 100644 --- a/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_edit.tsx +++ b/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_edit.tsx @@ -1,6 +1,6 @@ import React, { useState, useEffect } from "react"; import { Form, Select, Button as AntdButton, Tooltip, Input, InputNumber } from "antd"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Button, TabGroup, TabList, Tab, TabPanels, TabPanel } from "@tremor/react"; import { AUTH_TYPE, OAUTH_FLOW, MCPServer, MCPServerCostInfo, TRANSPORT } from "./types"; diff --git a/ui/litellm-dashboard/src/components/mcp_tools/mcp_servers.tsx b/ui/litellm-dashboard/src/components/mcp_tools/mcp_servers.tsx index 8596bda3d57..bb2ec8034a0 100644 --- a/ui/litellm-dashboard/src/components/mcp_tools/mcp_servers.tsx +++ b/ui/litellm-dashboard/src/components/mcp_tools/mcp_servers.tsx @@ -1,5 +1,5 @@ import { isAdminRole } from "@/utils/roles"; -import { QuestionCircleOutlined } from "@ant-design/icons"; +import { HelpCircle as QuestionCircleOutlined } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Button, Tab, TabGroup, TabList, TabPanel, TabPanels, Text, Title } from "@tremor/react"; import NewBadge from "../common_components/NewBadge"; diff --git a/ui/litellm-dashboard/src/components/mcp_tools/mcp_tool_configuration.tsx b/ui/litellm-dashboard/src/components/mcp_tools/mcp_tool_configuration.tsx index a492beda761..83cfbe19716 100644 --- a/ui/litellm-dashboard/src/components/mcp_tools/mcp_tool_configuration.tsx +++ b/ui/litellm-dashboard/src/components/mcp_tools/mcp_tool_configuration.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useMemo, useRef, useState } from "react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Card, Title, Text } from "@tremor/react"; -import { ToolOutlined, CheckCircleOutlined, SearchOutlined, EditOutlined } from "@ant-design/icons"; +import { Wrench as ToolOutlined, CheckCircle2 as CheckCircleOutlined, Search as SearchOutlined, Pencil as EditOutlined } from "lucide-react"; import { Badge, Spin, Checkbox, Input, Radio } from "antd"; import { useTestMCPConnection } from "../../hooks/useTestMCPConnection"; import McpCrudPermissionPanel from "./McpCrudPermissionPanel"; diff --git a/ui/litellm-dashboard/src/components/mcp_tools/mcp_tools.tsx b/ui/litellm-dashboard/src/components/mcp_tools/mcp_tools.tsx index 4e91ec685a3..137a753e4ce 100644 --- a/ui/litellm-dashboard/src/components/mcp_tools/mcp_tools.tsx +++ b/ui/litellm-dashboard/src/components/mcp_tools/mcp_tools.tsx @@ -6,7 +6,7 @@ import { listMCPTools, callMCPTool } from "../networking"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Card, Title, Text } from "@tremor/react"; -import { RobotOutlined, ToolOutlined, SearchOutlined, KeyOutlined } from "@ant-design/icons"; +import { Bot as RobotOutlined, Wrench as ToolOutlined, Search as SearchOutlined, Key as KeyOutlined } from "lucide-react"; import { Input, Button as AntdButton } from "antd"; const MCPToolsViewer = ({ diff --git a/ui/litellm-dashboard/src/components/model_info_view.tsx b/ui/litellm-dashboard/src/components/model_info_view.tsx index f7d436dde78..c01562ffc35 100644 --- a/ui/litellm-dashboard/src/components/model_info_view.tsx +++ b/ui/litellm-dashboard/src/components/model_info_view.tsx @@ -1,7 +1,7 @@ import { useModelCostMap } from "@/app/(dashboard)/hooks/models/useModelCostMap"; import { useModelHub, useModelsInfo } from "@/app/(dashboard)/hooks/models/useModels"; import { transformModelData } from "@/app/(dashboard)/models-and-endpoints/utils/modelDataTransformer"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; import { ArrowLeft as ArrowLeftIcon, Key as KeyIcon, RefreshCcw as RefreshIcon, Trash2 as TrashIcon } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { diff --git a/ui/litellm-dashboard/src/components/molecules/models/columns.tsx b/ui/litellm-dashboard/src/components/molecules/models/columns.tsx index 962cec57098..ea8ec77f197 100644 --- a/ui/litellm-dashboard/src/components/molecules/models/columns.tsx +++ b/ui/litellm-dashboard/src/components/molecules/models/columns.tsx @@ -1,4 +1,4 @@ -import { EditOutlined, InfoCircleOutlined, SyncOutlined } from "@ant-design/icons"; +import { Pencil as EditOutlined, Info as InfoCircleOutlined, RefreshCcw as SyncOutlined } from "lucide-react"; import { Trash2 } from "lucide-react"; import { ColumnDef } from "@tanstack/react-table"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports diff --git a/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx b/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx index e5f559baa9a..570655d92a7 100644 --- a/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx +++ b/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx @@ -6,7 +6,7 @@ import { useTags } from "@/app/(dashboard)/hooks/tags/useTags"; import { useUISettings } from "@/app/(dashboard)/hooks/uiSettings/useUISettings"; import useAuthorized from "@/app/(dashboard)/hooks/useAuthorized"; import { formatNumberWithCommas } from "@/utils/dataUtils"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; import { useQueryClient } from "@tanstack/react-query"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Accordion, AccordionBody, AccordionHeader, Button, Col, Grid, Text, TextInput, Title } from "@tremor/react"; diff --git a/ui/litellm-dashboard/src/components/organizations.tsx b/ui/litellm-dashboard/src/components/organizations.tsx index 6a9eef7d2ca..8038893be58 100644 --- a/ui/litellm-dashboard/src/components/organizations.tsx +++ b/ui/litellm-dashboard/src/components/organizations.tsx @@ -1,5 +1,5 @@ import OrganizationFilters, { FilterState } from "@/app/(dashboard)/organizations/OrganizationFilters"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; import { ChevronDown as ChevronDownIcon, ChevronRight as ChevronRightIcon, RefreshCcw as RefreshIcon } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { diff --git a/ui/litellm-dashboard/src/components/policies/ai_suggestion_modal.tsx b/ui/litellm-dashboard/src/components/policies/ai_suggestion_modal.tsx index 6059ea72df7..79e4b1bba23 100644 --- a/ui/litellm-dashboard/src/components/policies/ai_suggestion_modal.tsx +++ b/ui/litellm-dashboard/src/components/policies/ai_suggestion_modal.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useMemo, useState } from "react"; import { Modal, Spin, Checkbox, Select, Input, Typography, Tooltip } from "antd"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Button, Card } from "@tremor/react"; -import { CheckCircleOutlined, CloseCircleOutlined, InfoCircleOutlined, DownOutlined, RightOutlined } from "@ant-design/icons"; +import { CheckCircle2 as CheckCircleOutlined, XCircle as CloseCircleOutlined, Info as InfoCircleOutlined, ChevronDown as DownOutlined, ChevronRight as RightOutlined } from "lucide-react"; import { suggestPolicyTemplates, modelHubCall, testPolicyTemplate, enrichPolicyTemplateStream } from "../networking"; const { TextArea } = Input; diff --git a/ui/litellm-dashboard/src/components/policies/index.tsx b/ui/litellm-dashboard/src/components/policies/index.tsx index 19ee3740dd1..9e8cd51edfa 100644 --- a/ui/litellm-dashboard/src/components/policies/index.tsx +++ b/ui/litellm-dashboard/src/components/policies/index.tsx @@ -4,7 +4,7 @@ import { Button, TabGroup, TabList, Tab, TabPanels, TabPanel } from "@tremor/rea import { Alert } from "antd"; import MessageManager from "@/components/molecules/message_manager"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; import { isAdminRole } from "@/utils/roles"; import PolicyTable from "./policy_table"; import PolicyInfoView from "./policy_info"; diff --git a/ui/litellm-dashboard/src/components/price_data_reload.tsx b/ui/litellm-dashboard/src/components/price_data_reload.tsx index f8b0ab24c36..139307e9f54 100644 --- a/ui/litellm-dashboard/src/components/price_data_reload.tsx +++ b/ui/litellm-dashboard/src/components/price_data_reload.tsx @@ -1,6 +1,6 @@ import React, { useState, useEffect } from "react"; import { Button, Popconfirm, Modal, InputNumber, Space, Typography, Tag, Card, Tooltip, Divider } from "antd"; -import { ReloadOutlined, ClockCircleOutlined, StopOutlined, CloudOutlined, DatabaseOutlined, InfoCircleOutlined, WarningOutlined } from "@ant-design/icons"; +import { RefreshCcw as ReloadOutlined, Clock as ClockCircleOutlined, Ban as StopOutlined, Cloud as CloudOutlined, Database as DatabaseOutlined, Info as InfoCircleOutlined, AlertTriangle as WarningOutlined } from "lucide-react"; import { reloadModelCostMap, scheduleModelCostMapReload, diff --git a/ui/litellm-dashboard/src/components/team/TeamInfo.tsx b/ui/litellm-dashboard/src/components/team/TeamInfo.tsx index ea340b2da7b..3a862ea5e21 100644 --- a/ui/litellm-dashboard/src/components/team/TeamInfo.tsx +++ b/ui/litellm-dashboard/src/components/team/TeamInfo.tsx @@ -18,7 +18,7 @@ import { useGuardrails } from "@/app/(dashboard)/hooks/guardrails/useGuardrails" import { formatNumberWithCommas } from "@/utils/dataUtils"; import { mapEmptyStringToNull } from "@/utils/keyUpdateUtils"; import { isProxyAdminRole } from "@/utils/roles"; -import { EditOutlined, GlobalOutlined, InfoCircleOutlined, MinusCircleOutlined, PlusOutlined, SaveOutlined } from "@ant-design/icons"; +import { Pencil as EditOutlined, Globe as GlobalOutlined, Info as InfoCircleOutlined, MinusCircle as MinusCircleOutlined, Plus as PlusOutlined, Save as SaveOutlined } from "lucide-react"; import { ArrowLeft as ArrowLeftIcon } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { Accordion, AccordionBody, AccordionHeader, Badge, Card, Grid, Text, TextInput, Title } from "@tremor/react"; diff --git a/ui/litellm-dashboard/src/components/team/TeamVirtualKeysTable.tsx b/ui/litellm-dashboard/src/components/team/TeamVirtualKeysTable.tsx index 54a6098c893..553e2ee28a8 100644 --- a/ui/litellm-dashboard/src/components/team/TeamVirtualKeysTable.tsx +++ b/ui/litellm-dashboard/src/components/team/TeamVirtualKeysTable.tsx @@ -25,7 +25,7 @@ import { TableRow, Text, } from "@tremor/react"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; import { Popover, Skeleton, Tooltip } from "antd"; import React, { useCallback, useEffect, useMemo, useState } from "react"; import { getModelDisplayName } from "../key_team_helpers/fetch_available_models_team_key"; diff --git a/ui/litellm-dashboard/src/components/templates/key_edit_view.tsx b/ui/litellm-dashboard/src/components/templates/key_edit_view.tsx index 064ce9082d4..450be81c5e3 100644 --- a/ui/litellm-dashboard/src/components/templates/key_edit_view.tsx +++ b/ui/litellm-dashboard/src/components/templates/key_edit_view.tsx @@ -3,7 +3,7 @@ import { useOrganizations } from "@/app/(dashboard)/hooks/organizations/useOrgan import { useProjects } from "@/app/(dashboard)/hooks/projects/useProjects"; import { useUISettings } from "@/app/(dashboard)/hooks/uiSettings/useUISettings"; import PolicySelector from "@/components/policies/PolicySelector"; -import { InfoCircleOutlined } from "@ant-design/icons"; +import { Info as InfoCircleOutlined } from "lucide-react"; // eslint-disable-next-line litellm-ui/no-banned-ui-imports import { TextInput, Button as TremorButton } from "@tremor/react"; import { Form, Input, Select, Switch, Tooltip } from "antd"; diff --git a/ui/litellm-dashboard/src/components/vector_store_management/CreateVectorStore.tsx b/ui/litellm-dashboard/src/components/vector_store_management/CreateVectorStore.tsx index bf0ed948750..b740c3417ba 100644 --- a/ui/litellm-dashboard/src/components/vector_store_management/CreateVectorStore.tsx +++ b/ui/litellm-dashboard/src/components/vector_store_management/CreateVectorStore.tsx @@ -3,7 +3,7 @@ import React, { useState } from "react"; import { Card, Title, Text } from "@tremor/react"; import { Upload, Button, Select, Form, Alert, Tooltip, Input } from "antd"; import MessageManager from "@/components/molecules/message_manager"; -import { InboxOutlined, InfoCircleOutlined } from "@ant-design/icons"; +import { Inbox as InboxOutlined, Info as InfoCircleOutlined } from "lucide-react"; import type { UploadProps } from "antd"; import { ragIngestCall } from "../networking"; import { DocumentUpload, RAGIngestResponse } from "./types"; diff --git a/ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/LogDetailsDrawer.tsx b/ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/LogDetailsDrawer.tsx index 036a24c045a..5495102e77f 100644 --- a/ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/LogDetailsDrawer.tsx +++ b/ui/litellm-dashboard/src/components/view_logs/LogDetailsDrawer/LogDetailsDrawer.tsx @@ -1,11 +1,6 @@ import { useEffect, useMemo, useState } from "react"; import { Button, Drawer } from "antd"; -import { - CheckOutlined, - CopyOutlined, - LeftOutlined, - RightOutlined, -} from "@ant-design/icons"; +import { Check as CheckOutlined, Copy as CopyOutlined, ChevronLeft as LeftOutlined, ChevronRight as RightOutlined } from "lucide-react"; import { Bot, Sparkles, Wrench } from "lucide-react"; import { LogEntry } from "../columns"; import { AGENT_CALL_TYPES, MCP_CALL_TYPES } from "../constants"; diff --git a/ui/litellm-dashboard/src/components/view_logs/audit_logs.tsx b/ui/litellm-dashboard/src/components/view_logs/audit_logs.tsx index b16ba30049d..ddd80fd3cf2 100644 --- a/ui/litellm-dashboard/src/components/view_logs/audit_logs.tsx +++ b/ui/litellm-dashboard/src/components/view_logs/audit_logs.tsx @@ -1,7 +1,7 @@ import { useState } from "react"; import { useQuery, keepPreviousData } from "@tanstack/react-query"; import { Table, Tag, Input, Select, Button, Pagination, Spin } from "antd"; -import { ReloadOutlined, LoadingOutlined } from "@ant-design/icons"; +import { RefreshCcw as ReloadOutlined, Loader2 as LoadingOutlined } from "lucide-react"; import type { ColumnsType } from "antd/es/table"; import moment from "moment"; import { uiAuditLogsCall } from "../networking"; @@ -263,7 +263,7 @@ export default function AuditLogs({ {/* Pagination + refresh pushed to the right */}