feat: agent and ui

client/src/components/Icon/icons/minus.svg

@@ -0,0 +1 @@
+<?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="1688632968712" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3386" xmlns:xlink="http://www.w3.org/1999/xlink" ><path d="M507.904 52.224q95.232 0 179.2 36.352t145.92 98.304 98.304 145.408 36.352 178.688-36.352 179.2-98.304 145.92-145.92 98.304-179.2 36.352-178.688-36.352-145.408-98.304-98.304-145.92-36.352-179.2 36.352-178.688 98.304-145.408 145.408-98.304 178.688-36.352zM736.256 573.44q30.72 0 55.296-15.872t24.576-47.616q0-30.72-24.576-45.568t-55.296-14.848l-452.608 0q-30.72 0-56.32 14.848t-25.6 45.568q0 31.744 25.6 47.616t56.32 15.872l452.608 0z" p-id="3387"></path></svg>

client/src/components/Icon/index.tsx

@@ -35,7 +35,8 @@ const map = {
   kbTest: require('./icons/kbTest.svg').default,
   date: require('./icons/date.svg').default,
   apikey: require('./icons/apikey.svg').default,
-  save: require('./icons/save.svg').default
+  save: require('./icons/save.svg').default,
+  minus: require('./icons/minus.svg').default
 };
 
 export type IconName = keyof typeof map;

client/src/components/Layout/navbar.tsx

@@ -1,5 +1,5 @@
 import React, { useMemo } from 'react';
-import { Box, Flex, Tooltip, Link } from '@chakra-ui/react';
+import { Box, Flex, Link } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import MyIcon from '../Icon';
 import { useUserStore } from '@/store/user';

client/src/components/Markdown/img/Loading.tsx

@@ -1,25 +0,0 @@
-import React, { memo } from 'react';
-import { Box } from '@chakra-ui/react';
-
-const Loading = ({ text }: { text?: string }) => {
-  return (
-    <Box>
-      <Box
-        minW={'100px'}
-        w={'100%'}
-        h={'80px'}
-        backgroundImage={'url("/imgs/loading.gif")'}
-        backgroundSize={'contain'}
-        backgroundRepeat={'no-repeat'}
-        backgroundPosition={'center'}
-      />
-      {text && (
-        <Box mt={1} textAlign={'center'} fontSize={'sm'} color={'myGray.600'}>
-          {text}
-        </Box>
-      )}
-    </Box>
-  );
-};
-
-export default memo(Loading);

client/src/components/MyTooltip/index.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { Tooltip, TooltipProps } from '@chakra-ui/react';
+
+const MyTooltip = ({ children, ...props }: TooltipProps) => {
+  return (
+    <Tooltip
+      bg={'white'}
+      arrowShadowColor={' rgba(0,0,0,0.1)'}
+      hasArrow
+      arrowSize={12}
+      offset={[-15, 15]}
+      color={'myGray.800'}
+      px={4}
+      py={2}
+      borderRadius={'8px'}
+      whiteSpace={'pre-wrap'}
+      {...props}
+    >
+      {children}
+    </Tooltip>
+  );
+};
+
+export default MyTooltip;