milestone: publish alpha version (#637)

- document folder
- full-text search
- blob storage
- basic edgeless support

Co-authored-by: tzhangchi <terry.zhangchi@outlook.com>
Co-authored-by: QiShaoXuan <qishaoxuan777@gmail.com>
Co-authored-by: DiamondThree <diamond.shx@gmail.com>
Co-authored-by: MingLiang Wang <mingliangwang0o0@gmail.com>
Co-authored-by: JimmFly <yangjinfei001@gmail.com>
Co-authored-by: Yifeng Wang <doodlewind@toeverything.info>
Co-authored-by: Himself65 <himself65@outlook.com>
Co-authored-by: lawvs <18554747+lawvs@users.noreply.github.com>
Co-authored-by: Qi <474021214@qq.com>

packages/app/src/components/import/index.tsx

@@ -0,0 +1,65 @@
+import { Modal, ModalWrapper, ModalCloseButton } from '@/ui/modal';
+import { StyledButtonWrapper, StyledTitle } from './styles';
+import { Button } from '@/ui/button';
+import { Wrapper, Content } from '@/ui/layout';
+import Loading from '@/components/loading';
+import { useEffect, useState } from 'react';
+type ImportModalProps = {
+  open: boolean;
+  onClose: () => void;
+};
+export const ImportModal = ({ open, onClose }: ImportModalProps) => {
+  const [status, setStatus] = useState<'unImported' | 'importing'>('importing');
+
+  useEffect(() => {
+    if (status === 'importing') {
+      setTimeout(() => {
+        setStatus('unImported');
+      }, 1500);
+    }
+  }, [status]);
+
+  return (
+    <Modal open={open} onClose={onClose}>
+      <ModalWrapper width={460} minHeight={240}>
+        <ModalCloseButton onClick={onClose} />
+        <StyledTitle>Import</StyledTitle>
+
+        {status === 'unImported' && (
+          <StyledButtonWrapper>
+            <Button
+              onClick={() => {
+                setStatus('importing');
+              }}
+            >
+              Markdown
+            </Button>
+            <Button
+              onClick={() => {
+                setStatus('importing');
+              }}
+            >
+              HTML
+            </Button>
+          </StyledButtonWrapper>
+        )}
+
+        {status === 'importing' && (
+          <Wrapper
+            wrap={true}
+            justifyContent="center"
+            style={{ marginTop: 22, paddingBottom: '32px' }}
+          >
+            <Loading size={25}></Loading>
+            <Content align="center" weight="500">
+              OOOOPS! Sorry forgot to remind you that we are working on the
+              import function
+            </Content>
+          </Wrapper>
+        )}
+      </ModalWrapper>
+    </Modal>
+  );
+};
+
+export default ImportModal;

packages/app/src/components/import/styles.ts

@@ -0,0 +1,25 @@
+import { styled } from '@/styles';
+
+export const StyledTitle = styled.div(({ theme }) => {
+  return {
+    fontSize: theme.font.h6,
+    fontWeight: 600,
+    textAlign: 'center',
+    marginTop: '45px',
+    color: theme.colors.popoverColor,
+  };
+});
+
+export const StyledButtonWrapper = styled.div(() => {
+  return {
+    width: '280px',
+    margin: '24px auto 0',
+    button: {
+      display: 'block',
+      width: '100%',
+      ':not(:last-child)': {
+        marginBottom: '16px',
+      },
+    },
+  };
+});