Feat: pptx and xlsx loader (#1118)

* perf: plan tip

* perf: upload size controller

* feat: add image ttl index

* feat: new upload file ux

* remove file

* feat: support read pptx

* feat: support xlsx

* fix: rerank docker flie

packages/web/components/common/MyDrawer/MyRightDrawer.tsx

@@ -0,0 +1,70 @@
+import React from 'react';
+import MyIcon from '../Icon';
+import {
+  Drawer,
+  DrawerBody,
+  DrawerHeader,
+  DrawerOverlay,
+  DrawerContent,
+  DrawerCloseButton,
+  DrawerContentProps,
+  Flex,
+  Image
+} from '@chakra-ui/react';
+import { useLoading } from '../../../hooks/useLoading';
+
+type Props = DrawerContentProps & {
+  onClose: () => void;
+  iconSrc?: string;
+  title?: any;
+  isLoading?: boolean;
+};
+
+const MyRightDrawer = ({
+  onClose,
+  iconSrc,
+  title,
+  maxW = ['90vw', '30vw'],
+  children,
+  isLoading,
+  ...props
+}: Props) => {
+  const { Loading } = useLoading();
+  return (
+    <Drawer isOpen placement="right" onClose={onClose}>
+      <DrawerOverlay />
+      <DrawerContent
+        maxW={maxW}
+        {...props}
+        h={'94%'}
+        mt={'2%'}
+        borderLeftRadius={'lg'}
+        overflow={'hidden'}
+      >
+        <DrawerCloseButton />
+        <DrawerHeader>
+          <Flex alignItems={'center'} pr={2}>
+            {iconSrc && (
+              <>
+                {iconSrc.startsWith('/') ? (
+                  <Image mr={3} objectFit={'contain'} alt="" src={iconSrc} w={'20px'} />
+                ) : (
+                  <MyIcon mr={3} name={iconSrc as any} w={'20px'} />
+                )}
+              </>
+            )}
+            {title}
+          </Flex>
+          <DrawerCloseButton zIndex={1} />
+        </DrawerHeader>
+
+        <DrawerBody>
+          {children}
+          <Loading loading={isLoading} fixed={false} />
+        </DrawerBody>
+      </DrawerContent>
+    </Drawer>
+  );
+};
+
+export default MyRightDrawer;