refactor(icons): 迁移 components 目录图标到 lucide-react

- @chakra-ui/icons → lucide-react - react-icons → lucide-react - 涉及 49 个组件文件 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-12-25 12:23:19 +08:00
parent 5b05ae17c9
commit b2100d6f75
49 changed files with 250 additions and 282 deletions
--- a/src/components/ChatBot/ChatInterface.js
+++ b/src/components/ChatBot/ChatInterface.js
@@ -21,8 +21,7 @@ import {
  MenuItem,
  Button,
 } from '@chakra-ui/react';
-import { FiSend, FiRefreshCw, FiSettings, FiDownload } from 'react-icons/fi';
-import { ChevronDownIcon } from '@chakra-ui/icons';
+import { Send, RefreshCw, Settings, Download } from 'lucide-react';
 import MessageBubble from './MessageBubble';
 import { mcpService } from '../../services/mcpService';
 import { logger } from '../../utils/logger';
@@ -252,14 +251,14 @@ export const ChatInterface = () => {
        </HStack>
        <HStack>
          <IconButton
-            icon={<FiRefreshCw />}
+            icon={<RefreshCw />}
            size="sm"
            variant="ghost"
            aria-label="清空对话"
            onClick={handleClearChat}
          />
          <IconButton
-            icon={<FiDownload />}
+            icon={<Download />}
            size="sm"
            variant="ghost"
            aria-label="导出对话"
@@ -268,7 +267,7 @@ export const ChatInterface = () => {
          <Menu>
            <MenuButton
              as={IconButton}
-              icon={<FiSettings />}
+              icon={<Settings />}
              size="sm"
              variant="ghost"
              aria-label="设置"
@@ -360,7 +359,7 @@ export const ChatInterface = () => {
            disabled={isLoading}
          />
          <IconButton
-            icon={<FiSend />}
+            icon={<Send />}
            colorScheme="blue"
            aria-label="发送"
            onClick={handleSendMessage}
--- a/src/components/ChatBot/ChatInterfaceV2.js
+++ b/src/components/ChatBot/ChatInterfaceV2.js
@@ -21,7 +21,7 @@ import {
  Progress,
  Fade,
 } from '@chakra-ui/react';
-import { FiSend, FiRefreshCw, FiDownload, FiCpu, FiUser, FiZap } from 'react-icons/fi';
+import { Send, RefreshCw, Download, Cpu, User, Zap } from 'lucide-react';
 import { PlanCard } from './PlanCard';
 import { StepResultCard } from './StepResultCard';
 import { mcpService } from '../../services/mcpService';
@@ -387,14 +387,14 @@ export const ChatInterfaceV2 = () => {
            <Avatar
              size="md"
              bg="blue.500"
-              icon={<FiCpu fontSize="1.5rem" />}
+              icon={<Cpu fontSize="1.5rem" />}
            />
            <VStack align="start" spacing={0}>
              <Heading size="md">AI投资研究助手</Heading>
              <HStack>
                <Badge colorScheme="green" fontSize="xs">
                  <HStack spacing={1}>
-                    <FiZap size={10} />
+                    <Zap size={10} />
                    <span>智能分析</span>
                  </HStack>
                </Badge>
@@ -407,14 +407,14 @@ export const ChatInterfaceV2 = () => {

          <HStack>
            <IconButton
-              icon={<FiRefreshCw />}
+              icon={<RefreshCw />}
              size="sm"
              variant="ghost"
              aria-label="清空对话"
              onClick={handleClearChat}
            />
            <IconButton
-              icon={<FiDownload />}
+              icon={<Download />}
              size="sm"
              variant="ghost"
              aria-label="导出对话"
@@ -507,7 +507,7 @@ export const ChatInterfaceV2 = () => {
            size="lg"
          />
          <IconButton
-            icon={isProcessing ? <Spinner size="sm" /> : <FiSend />}
+            icon={isProcessing ? <Spinner size="sm" /> : <Send />}
            colorScheme="blue"
            aria-label="发送"
            onClick={handleSendMessage}
@@ -546,7 +546,7 @@ const MessageRenderer = ({ message }) => {
                {message.content}
              </Text>
            </Box>
-            <Avatar size="sm" bg="blue.500" icon={<FiUser fontSize="1rem" />} />
+            <Avatar size="sm" bg="blue.500" icon={<User fontSize="1rem" />} />
          </HStack>
        </Flex>
      );
@@ -555,7 +555,7 @@ const MessageRenderer = ({ message }) => {
      return (
        <Flex justify="flex-start">
          <HStack align="flex-start" maxW="75%">
-            <Avatar size="sm" bg="purple.500" icon={<FiCpu fontSize="1rem" />} />
+            <Avatar size="sm" bg="purple.500" icon={<Cpu fontSize="1rem" />} />
            <Box
              bg={agentBubbleBg}
              px={4}
@@ -580,7 +580,7 @@ const MessageRenderer = ({ message }) => {
      return (
        <Flex justify="flex-start">
          <HStack align="flex-start" maxW="85%">
-            <Avatar size="sm" bg="blue.500" icon={<FiCpu fontSize="1rem" />} />
+            <Avatar size="sm" bg="blue.500" icon={<Cpu fontSize="1rem" />} />
            <VStack align="stretch" flex={1}>
              <PlanCard plan={message.plan} stepResults={[]} />
            </VStack>
@@ -592,7 +592,7 @@ const MessageRenderer = ({ message }) => {
      return (
        <Flex justify="flex-start">
          <HStack align="flex-start" maxW="85%">
-            <Avatar size="sm" bg="orange.500" icon={<FiCpu fontSize="1rem" />} />
+            <Avatar size="sm" bg="orange.500" icon={<Cpu fontSize="1rem" />} />
            <VStack align="stretch" flex={1} spacing={3}>
              <PlanCard plan={message.plan} stepResults={message.stepResults} />
              {message.stepResults?.map((result, idx) => (
@@ -607,7 +607,7 @@ const MessageRenderer = ({ message }) => {
      return (
        <Flex justify="flex-start">
          <HStack align="flex-start" maxW="85%">
-            <Avatar size="sm" bg="green.500" icon={<FiCpu fontSize="1rem" />} />
+            <Avatar size="sm" bg="green.500" icon={<Cpu fontSize="1rem" />} />
            <VStack align="stretch" flex={1} spacing={3}>
              {/* 最终总结 */}
              <Box
@@ -657,7 +657,7 @@ const MessageRenderer = ({ message }) => {
      return (
        <Flex justify="flex-start">
          <HStack align="flex-start" maxW="75%">
-            <Avatar size="sm" bg="red.500" icon={<FiCpu fontSize="1rem" />} />
+            <Avatar size="sm" bg="red.500" icon={<Cpu fontSize="1rem" />} />
            <Box
              bg="red.50"
              color="red.700"
--- a/src/components/ChatBot/MessageBubble.js
+++ b/src/components/ChatBot/MessageBubble.js
@@ -14,7 +14,7 @@ import {
  Badge,
  VStack,
 } from '@chakra-ui/react';
-import { FiCopy, FiThumbsUp, FiThumbsDown } from 'react-icons/fi';
+import { Copy, ThumbsUp, ThumbsDown } from 'lucide-react';
 import ReactMarkdown from 'react-markdown';

 /**
@@ -105,21 +105,21 @@ export const MessageBubble = ({ message, isUser, onCopy, onFeedback }) => {
          {!isUser && (
            <HStack mt={2} spacing={2}>
              <IconButton
-                icon={<FiCopy />}
+                icon={<Copy />}
                size="xs"
                variant="ghost"
                aria-label="复制"
                onClick={handleCopy}
              />
              <IconButton
-                icon={<FiThumbsUp />}
+                icon={<ThumbsUp />}
                size="xs"
                variant="ghost"
                aria-label="赞"
                onClick={() => onFeedback?.('positive')}
              />
              <IconButton
-                icon={<FiThumbsDown />}
+                icon={<ThumbsDown />}
                size="xs"
                variant="ghost"
                aria-label="踩"
--- a/src/components/ChatBot/PlanCard.js
+++ b/src/components/ChatBot/PlanCard.js
@@ -17,7 +17,7 @@ import {
  useColorModeValue,
  Divider,
 } from '@chakra-ui/react';
-import { FiTarget, FiCheckCircle, FiXCircle, FiClock, FiTool } from 'react-icons/fi';
+import { Target, CheckCircle, XCircle, Clock, Wrench } from 'lucide-react';

 /**
 * 执行计划卡片组件
@@ -38,11 +38,11 @@ export const PlanCard = ({ plan, stepResults }) => {
  const getStepIcon = (status) => {
    switch (status) {
      case 'success':
-        return FiCheckCircle;
+        return CheckCircle;
      case 'failed':
-        return FiXCircle;
+        return XCircle;
      default:
-        return FiClock;
+        return Clock;
    }
  };

@@ -70,7 +70,7 @@ export const PlanCard = ({ plan, stepResults }) => {
      <VStack align="stretch" spacing={3}>
        {/* 目标 */}
        <HStack>
-          <Icon as={FiTarget} color="blue.500" boxSize={5} />
+          <Icon as={Target} color="blue.500" boxSize={5} />
          <Text fontWeight="bold" fontSize="md">执行目标</Text>
        </HStack>
        <Text fontSize="sm" color={useColorModeValue('gray.600', '#9BA1A6')} pl={7}>
--- a/src/components/ChatBot/StepResultCard.js
+++ b/src/components/ChatBot/StepResultCard.js
@@ -15,7 +15,7 @@ import {
  useColorModeValue,
  Divider,
 } from '@chakra-ui/react';
-import { FiChevronDown, FiChevronUp, FiCheckCircle, FiXCircle, FiClock, FiDatabase } from 'react-icons/fi';
+import { ChevronDown, ChevronUp, CheckCircle, XCircle, Clock, Database } from 'lucide-react';

 /**
 * 步骤结果卡片组件
@@ -31,11 +31,11 @@ export const StepResultCard = ({ stepResult }) => {
  const getStatusIcon = () => {
    switch (stepResult.status) {
      case 'success':
-        return FiCheckCircle;
+        return CheckCircle;
      case 'failed':
-        return FiXCircle;
+        return XCircle;
      default:
-        return FiClock;
+        return Clock;
    }
  };

@@ -101,7 +101,7 @@ export const StepResultCard = ({ stepResult }) => {
        </HStack>

        <IconButton
-          icon={<Icon as={isExpanded ? FiChevronUp : FiChevronDown} />}
+          icon={<Icon as={isExpanded ? ChevronUp : ChevronDown} />}
          size="sm"
          variant="ghost"
          aria-label={isExpanded ? "收起" : "展开"}
@@ -117,7 +117,7 @@ export const StepResultCard = ({ stepResult }) => {
          {stepResult.arguments && Object.keys(stepResult.arguments).length > 0 && (
            <VStack align="stretch" spacing={2} mb={3}>
              <HStack>
-                <Icon as={FiDatabase} color="blue.500" boxSize={4} />
+                <Icon as={Database} color="blue.500" boxSize={4} />
                <Text fontSize="xs" fontWeight="bold">请求参数:</Text>
              </HStack>
              <Code