feat: 首页提示

src/components/Icon/icons/home.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1679114254212" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2776" width="48" height="48" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M923.733333 394.666667c-85.333333-70.4-206.933333-174.933333-362.666666-309.333334C533.333333 61.866667 490.666667 61.866667 462.933333 85.333333c-155.733333 134.4-277.333333 238.933333-362.666666 309.333334-14.933333 14.933333-25.6 34.133333-25.6 53.333333 0 38.4 32 70.4 70.4 70.4H192v358.4c0 29.866667 23.466667 53.333333 53.333333 53.333333H405.333333c29.866667 0 53.333333-23.466667 53.333334-53.333333v-206.933333h106.666666v206.933333c0 29.866667 23.466667 53.333333 53.333334 53.333333h160c29.866667 0 53.333333-23.466667 53.333333-53.333333V518.4h46.933333c38.4 0 70.4-32 70.4-70.4 0-21.333333-10.666667-40.533333-25.6-53.333333z m-44.8 59.733333h-57.6c-29.866667 0-53.333333 23.466667-53.333333 53.333333v358.4h-138.666667V661.333333c0-29.866667-23.466667-53.333333-53.333333-53.333333h-128c-29.866667 0-53.333333 23.466667-53.333333 53.333333v206.933334H256V507.733333c0-29.866667-23.466667-53.333333-53.333333-53.333333H145.066667c-4.266667 0-6.4-2.133333-6.4-6.4 0-2.133333 2.133333-4.266667 2.133333-6.4 85.333333-70.4 206.933333-174.933333 362.666667-309.333333 4.266667-4.266667 10.666667-4.266667 14.933333 0 155.733333 134.4 277.333333 238.933333 362.666667 309.333333 2.133333 2.133333 2.133333 2.133333 2.133333 4.266667 2.133333 6.4-2.133333 8.533333-4.266667 8.533333z" p-id="2777"></path></svg>
\ No newline at end of file

src/components/Icon/index.tsx

@@ -5,7 +5,8 @@ import dynamic from 'next/dynamic';
 
 const map = {
   model: dynamic(() => import('./icons/model.svg')),
-  share: dynamic(() => import('./icons/share.svg'))
+  share: dynamic(() => import('./icons/share.svg')),
+  home: dynamic(() => import('./icons/home.svg'))
 };
 
 const MyIcon = ({

src/pages/chat/components/SlideBar.tsx

@@ -107,6 +107,23 @@ const SlideBar = ({
     </>
   );
 
+  const RenderButton = ({ onClick, children }: { onClick: () => void; children: JSX.Element }) => (
+    <Box px={3} mb={3}>
+      <Flex
+        alignItems={'center'}
+        p={2}
+        cursor={'pointer'}
+        borderRadius={'md'}
+        _hover={{
+          backgroundColor: 'rgba(255,255,255,0.2)'
+        }}
+        onClick={onClick}
+      >
+        {children}
+      </Flex>
+    </Box>
+  );
+
   return (
     <Flex
       flexDirection={'column'}
@@ -193,24 +210,24 @@ const SlideBar = ({
 
       <Divider my={4} />
 
-      <Box px={3}>
-        <Flex
-          alignItems={'center'}
-          p={2}
-          cursor={'pointer'}
-          borderRadius={'md'}
-          _hover={{
-            backgroundColor: 'rgba(255,255,255,0.2)'
-          }}
-          onClick={() => {
-            onOpenShare();
-            onClose();
-          }}
-        >
+      <RenderButton onClick={() => router.push('/')}>
+        <>
+          <MyIcon name="home" fill={'white'} w={'18px'} h={'18px'} mr={4} />
+          首页
+        </>
+      </RenderButton>
+
+      <RenderButton
+        onClick={() => {
+          onOpenShare();
+          onClose();
+        }}
+      >
+        <>
           <MyIcon name="share" fill={'white'} w={'16px'} h={'16px'} mr={4} />
-          分享对话
-        </Flex>
-      </Box>
+          分享
+        </>
+      </RenderButton>
 
       {/* 分享提示modal */}
       <Modal isOpen={isOpenShare} onClose={onCloseShare}>