perf: auto load icons (#688)

* perf: icon

* perf: icon

* doc

* perf: simple edit ui

* doc

* doc

* doc

* doc

projects/app/src/components/ChatBox/MessageInput.tsx

@@ -4,8 +4,7 @@ import { Box, Flex, Image, Spinner, Textarea } from '@chakra-ui/react';
 import React, { useRef, useEffect, useCallback, useState } from 'react';
 import { useTranslation } from 'next-i18next';
 import MyTooltip from '../MyTooltip';
-import MyIcon from '../Icon';
-import styles from './index.module.scss';
+import MyIcon from '@fastgpt/web/components/common/Icon';
 import { useRouter } from 'next/router';
 import { useSelectFile } from '@/web/common/file/hooks/useSelectFile';
 import { compressImgFileAndUpload } from '@/web/common/file/controller';
@@ -137,7 +136,7 @@ const MessageInput = ({
                   rawFile: file,
                   type: FileTypeEnum.file,
                   name: file.name,
-                  icon: 'pdf'
+                  icon: 'file/pdf'
                 });
               }
             })

projects/app/src/components/ChatBox/SelectMarkCollection.tsx

@@ -2,7 +2,7 @@ import React, { useMemo, useState } from 'react';
 import { ModalBody, useTheme, ModalFooter, Button, Box, Card, Flex, Grid } from '@chakra-ui/react';
 import { useTranslation } from 'next-i18next';
 import Avatar from '../Avatar';
-import MyIcon from '@/components/Icon';
+import MyIcon from '@fastgpt/web/components/common/Icon';
 import { DatasetTypeEnum } from '@fastgpt/global/core/dataset/constant';
 import DatasetSelectModal, { useDatasetSelect } from '@/components/core/dataset/SelectModal';
 import dynamic from 'next/dynamic';

projects/app/src/components/ChatBox/index.tsx

@@ -51,7 +51,7 @@ import {
 } from '@/web/core/chat/api';
 import type { AdminMarkType } from './SelectMarkCollection';
 
-import MyIcon from '@/components/Icon';
+import MyIcon from '@fastgpt/web/components/common/Icon';
 import Avatar from '@/components/Avatar';
 import Markdown, { CodeClassName } from '@/components/Markdown';
 import MySelect from '@/components/Select';
@@ -629,7 +629,7 @@ const ChatBox = (
                   ))}
                   {!variableIsFinish && (
                     <Button
-                      leftIcon={<MyIcon name={'chatFill'} w={'16px'} />}
+                      leftIcon={<MyIcon name={'core/chat/chatFill'} w={'16px'} />}
                       size={'sm'}
                       maxW={'100px'}
                       onClick={handleSubmit((data) => {
@@ -1276,7 +1276,7 @@ function ChatController({
           <MyTooltip label={t('core.app.TTS')}>
             <MyIcon
               {...controlIconStyle}
-              name={'voice'}
+              name={'common/voiceLight'}
               _hover={{ color: '#E74694' }}
               onClick={async () => {
                 const response = await playAudio({