🎨 refactor(ui): use lucide-react for search/refresh and chevron icons

- 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.
This commit is contained in:
t0ng7u
2025-08-23 19:29:56 +08:00
parent 005e9659e1
commit 8a329f6522
5 changed files with 9 additions and 10 deletions

View File

@@ -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}`}

View File

@@ -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"

View File

@@ -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>
);

View File

@@ -39,7 +39,7 @@ const PricingDisplaySettings = ({
const items = [
{
value: 'recharge',
label: t('充值价格显示')
label: t('充值价格显示')
},
{
value: 'ratio',

View File

@@ -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",