From 4e3af83bbf0fd2080c238baa204aaaaa1362fb7c Mon Sep 17 00:00:00 2001
From: tzhangchi <terry.zhangchi@outlook.com>
Date: Fri, 6 Jan 2023 18:54:07 +0800
Subject: [PATCH] feat: Make software interaction more natural

---
 .../src/components/workspace-avatar/index.tsx |  3 +--
 .../src/components/workspace-modal/index.tsx  |  2 +-
 .../workspace-setting/ExportPage.tsx          | 19 +++++++++++++++++++
 .../workspace-setting/workspace-setting.tsx   |  4 ++++
 4 files changed, 25 insertions(+), 3 deletions(-)
 create mode 100644 packages/app/src/components/workspace-setting/ExportPage.tsx

diff --git a/packages/app/src/components/workspace-avatar/index.tsx b/packages/app/src/components/workspace-avatar/index.tsx
index a8ef0960e3..b810a0e720 100644
--- a/packages/app/src/components/workspace-avatar/index.tsx
+++ b/packages/app/src/components/workspace-avatar/index.tsx
@@ -20,8 +20,7 @@ export const WorkspaceAvatar = (props: IWorkspaceAvatar) => {
           background: stringToColour(props.name || 'AFFiNE'),
           borderRadius: '50%',
           textAlign: 'center',
-          // Let the text inside the avatar be absolutely in the play
-          lineHeight: size - 2 + '[x',
+          lineHeight: size + 'px',
         }}
       >
         {(props.name || 'AFFiNE').substring(0, 1)}
diff --git a/packages/app/src/components/workspace-modal/index.tsx b/packages/app/src/components/workspace-modal/index.tsx
index 2c15d97218..cb0605a785 100644
--- a/packages/app/src/components/workspace-modal/index.tsx
+++ b/packages/app/src/components/workspace-modal/index.tsx
@@ -60,7 +60,7 @@ export const WorkspaceModal = ({ open, onClose }: LoginModalProps) => {
                     }}
                     key={index}
                   >
-                    <span style={{ width: '100px', marginRight: '20px' }}>
+                    <span style={{ width: '100px' }}>
                       <div
                         style={{
                           float: 'left',
diff --git a/packages/app/src/components/workspace-setting/ExportPage.tsx b/packages/app/src/components/workspace-setting/ExportPage.tsx
new file mode 100644
index 0000000000..531e889938
--- /dev/null
+++ b/packages/app/src/components/workspace-setting/ExportPage.tsx
@@ -0,0 +1,19 @@
+import { Workspace } from '@/hooks/mock-data/mock';
+import { styled } from '@/styles';
+
+export const ExportPageTitleContainer = styled('div')(() => {
+  return {
+    display: 'flex',
+    marginTop: '60px',
+    fontWeight: '500',
+    flex: 1,
+  };
+});
+export const ExportPage = ({ workspace }: { workspace: Workspace }) => {
+  return (
+    <ExportPageTitleContainer>
+      Export Workspace{' '}
+      <code style={{ margin: '0 10px' }}>{workspace.name}</code> Is Comming
+    </ExportPageTitleContainer>
+  );
+};
diff --git a/packages/app/src/components/workspace-setting/workspace-setting.tsx b/packages/app/src/components/workspace-setting/workspace-setting.tsx
index 7ebb5a8fb0..cad8b82d82 100644
--- a/packages/app/src/components/workspace-setting/workspace-setting.tsx
+++ b/packages/app/src/components/workspace-setting/workspace-setting.tsx
@@ -18,6 +18,7 @@ import { useEffect, useState } from 'react';
 import { GeneralPage } from './general';
 import { MembersPage } from './MembersPage';
 import { PublishPage } from './PublishPage';
+import { ExportPage } from './ExportPage';
 import { SyncPage } from './SyncPage';
 import { useTemporaryHelper } from '@/providers/temporary-helper-provider';
 
@@ -153,6 +154,9 @@ export const WorkspaceSetting = ({
           {activeTab === ActiveTab.publish && currentWorkspace && (
             <PublishPage workspace={currentWorkspace} />
           )}
+          {activeTab === ActiveTab.export && currentWorkspace && (
+            <ExportPage workspace={currentWorkspace} />
+          )}
         </StyledSettingContent>
       </StyledSettingContainer>
     </Modal>