From 8a329f6522e3f30cafa555df41a99d04a573a3ae Mon Sep 17 00:00:00 2001
From: t0ng7u <dev@aiass.cc>
Date: Sat, 23 Aug 2025 19:29:56 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20refactor(ui):=20use=20lucide-rea?=
 =?UTF-8?q?ct=20for=20search/refresh=20and=20chevron=20icons?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- DashboardHeader.jsx: replace Semi's IconSearch/IconRefresh with lucide-react's Search/RefreshCw (size 16), preserve existing button styles
- UptimePanel.jsx: replace Semi's IconRefresh with lucide-react's RefreshCw (size 14), keep styling intact
- UserArea.jsx: replace Semi's IconChevronDown with lucide-react's ChevronDown (size 14), preserve visual parity
- Update imports: remove @douyinfe/semi-icons usage where replaced; add lucide-react imports
- Verified no remaining IconSearch/IconRefresh in dashboard; no new linter errors

Motivation: unify icon library for core actions and improve UI consistency.
Follow-ups: consider migrating remaining Semi icons (e.g., plus/minus, charts) to lucide-react.
---
 web/src/components/dashboard/DashboardHeader.jsx            | 6 +++---
 web/src/components/dashboard/UptimePanel.jsx                | 5 ++---
 web/src/components/layout/HeaderBar/UserArea.jsx            | 4 ++--
 .../table/model-pricing/filter/PricingDisplaySettings.jsx   | 2 +-
 web/src/i18n/locales/en.json                                | 2 +-
 5 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/web/src/components/dashboard/DashboardHeader.jsx b/web/src/components/dashboard/DashboardHeader.jsx
index f59aa0b8..e0be5d85 100644
--- a/web/src/components/dashboard/DashboardHeader.jsx
+++ b/web/src/components/dashboard/DashboardHeader.jsx
@@ -19,7 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import { Button } from '@douyinfe/semi-ui';
-import { IconRefresh, IconSearch } from '@douyinfe/semi-icons';
+import { RefreshCw, Search } from 'lucide-react';
 
 const DashboardHeader = ({
   getGreeting,
@@ -42,13 +42,13 @@ const DashboardHeader = ({
       <div className="flex gap-3">
         <Button
           type='tertiary'
-          icon={<IconSearch />}
+          icon={<Search size={16} />}
           onClick={showSearchModal}
           className={`bg-green-500 hover:bg-green-600 ${ICON_BUTTON_CLASS}`}
         />
         <Button
           type='tertiary'
-          icon={<IconRefresh />}
+          icon={<RefreshCw size={16} />}
           onClick={refresh}
           loading={loading}
           className={`bg-blue-500 hover:bg-blue-600 ${ICON_BUTTON_CLASS}`}
diff --git a/web/src/components/dashboard/UptimePanel.jsx b/web/src/components/dashboard/UptimePanel.jsx
index 9c5049b8..723e406e 100644
--- a/web/src/components/dashboard/UptimePanel.jsx
+++ b/web/src/components/dashboard/UptimePanel.jsx
@@ -19,8 +19,7 @@ For commercial licensing, please contact support@quantumnous.com
 
 import React from 'react';
 import { Card, Button, Spin, Tabs, TabPane, Tag, Empty } from '@douyinfe/semi-ui';
-import { Gauge } from 'lucide-react';
-import { IconRefresh } from '@douyinfe/semi-icons';
+import { Gauge, RefreshCw } from 'lucide-react';
 import { IllustrationConstruction, IllustrationConstructionDark } from '@douyinfe/semi-illustrations';
 import ScrollableContainer from '../common/ui/ScrollableContainer';
 
@@ -47,7 +46,7 @@ const UptimePanel = ({
             {t('服务可用性')}
           </div>
           <Button
-            icon={<IconRefresh />}
+            icon={<RefreshCw size={14} />}
             onClick={loadUptimeData}
             loading={uptimeLoading}
             size="small"
diff --git a/web/src/components/layout/HeaderBar/UserArea.jsx b/web/src/components/layout/HeaderBar/UserArea.jsx
index a92f480a..ca134435 100644
--- a/web/src/components/layout/HeaderBar/UserArea.jsx
+++ b/web/src/components/layout/HeaderBar/UserArea.jsx
@@ -25,8 +25,8 @@ import {
   Dropdown,
   Typography,
 } from '@douyinfe/semi-ui';
+import { ChevronDown } from 'lucide-react';
 import {
-  IconChevronDown,
   IconExit,
   IconUserSetting,
   IconCreditCard,
@@ -120,7 +120,7 @@ const UserArea = ({
               {userState.user.username}
             </Typography.Text>
           </span>
-          <IconChevronDown className="text-xs text-semi-color-text-2 dark:text-gray-400" />
+          <ChevronDown size={14} className="text-xs text-semi-color-text-2 dark:text-gray-400" />
         </Button>
       </Dropdown>
     );
diff --git a/web/src/components/table/model-pricing/filter/PricingDisplaySettings.jsx b/web/src/components/table/model-pricing/filter/PricingDisplaySettings.jsx
index 05942279..9a372812 100644
--- a/web/src/components/table/model-pricing/filter/PricingDisplaySettings.jsx
+++ b/web/src/components/table/model-pricing/filter/PricingDisplaySettings.jsx
@@ -39,7 +39,7 @@ const PricingDisplaySettings = ({
   const items = [
     {
       value: 'recharge',
-      label: t('以充值价格显示')
+      label: t('充值价格显示')
     },
     {
       value: 'ratio',
diff --git a/web/src/i18n/locales/en.json b/web/src/i18n/locales/en.json
index 4adcb131..1a453b1f 100644
--- a/web/src/i18n/locales/en.json
+++ b/web/src/i18n/locales/en.json
@@ -1788,7 +1788,7 @@
   "将仅保留第一个密钥文件，其余文件将被移除，是否继续？": "Only the first key file will be retained, and the remaining files will be removed. Continue?",
   "自定义模型名称": "Custom model name",
   "启用全部密钥": "Enable all keys",
-  "以充值价格显示": "Recharge price",
+  "充值价格显示": "Recharge price",
   "美元汇率（非充值汇率，仅用于定价页面换算）": "USD exchange rate (not recharge rate, only used for pricing page conversion)",
   "美元汇率": "USD exchange rate",
   "隐藏操作项": "Hide actions",