1.adjust code style.

libs/components/layout/src/header/FileSystem.tsx

@@ -4,7 +4,7 @@ import { CloseIcon } from '@toeverything/components/common';
 import { IconButton, MuiSnackbar, styled } from '@toeverything/components/ui';
 import { services } from '@toeverything/datasource/db-service';
 import { useLocalTrigger } from '@toeverything/datasource/state';
-import { useTranslation } from 'react-i18next';
+
 const cleanupWorkspace = (workspace: string) =>
     new Promise((resolve, reject) => {
         const req = indexedDB.deleteDatabase(workspace);
@@ -75,25 +75,39 @@ export const FileSystem = () => {
         setError(true);
         setTimeout(() => setError(false), 3000);
     }, []);
-    const { t } = useTranslation();
+
     const apiSupported = useMemo(() => fsApiSupported(), []);
 
     if (apiSupported && !selected) {
         return (
-            <MuiSnackbar
+            <>
-                anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
+                <MuiSnackbar
-                open={error}
+                    anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
-                message="Request File Permission failed, please check if you have permission"
+                    open={error}
-                sx={{ marginTop: '3em' }}
+                    message="Request File Permission failed, please check if you have permission"
-                action={
+                    sx={{ marginTop: '3em' }}
-                    <IconButton
+                    action={
-                        aria-label="close"
+                        <IconButton
-                        onClick={() => setError(false)}
+                            aria-label="close"
-                    >
+                            onClick={() => setError(false)}
-                        <CloseIcon />
+                        >
-                    </IconButton>
+                            <CloseIcon />
-                }
+                        </IconButton>
-            />
+                    }
+                />
+                <StyledFileSystem
+                    onClick={async () => {
+                        try {
+                            await requestPermission('AFFiNE');
+                            onSelected();
+                        } catch (e) {
+                            onError();
+                        }
+                    }}
+                >
+                    Sync to Disk
+                </StyledFileSystem>
+            </>
         );
     }
     return null;

libs/components/layout/src/header/LayoutHeader.tsx

@@ -14,7 +14,7 @@ import {
 
 import { useTranslation } from 'react-i18next';
 import { EditorBoardSwitcher } from './EditorBoardSwitcher';
-import { FileSystem, fsApiSupported } from './FileSystem';
+import { fsApiSupported } from './FileSystem';
 import { CurrentPageTitle } from './Title';
 
 export const LayoutHeader = () => {
@@ -44,7 +44,6 @@ export const LayoutHeader = () => {
                 </FlexContainer>
                 <FlexContainer>
                     <StyledHelper>
-                        <FileSystem />
                         <StyledShare disabled={true}>{t('Share')}</StyledShare>
                         <div style={{ margin: '0px 12px' }}>
                             <IconButton

libs/components/layout/src/header/PageSettingPortal.tsx

@@ -58,8 +58,6 @@ function PageSettingPortal() {
     const navigate = useNavigate();
     const { user } = useUserAndSpaces();
     const BooleanFullWidthChecked = useFlag('BooleanFullWidthChecked', false);
-    const BooleanExportWorkspace = useFlag('BooleanExportWorkspace', false);
-    const BooleanImportWorkspace = useFlag('BooleanImportWorkspace', false);
     const BooleanExportHtml = useFlag('BooleanExportHtml', false);
     const BooleanExportPdf = useFlag('BooleanExportPdf', false);
     const BooleanExportMarkdown = useFlag('BooleanExportMarkdown', false);
@@ -217,18 +215,14 @@ function PageSettingPortal() {
                             />
                         )}
                         <Divider />
-                        {BooleanImportWorkspace && (
+                        <ListButton
-                            <ListButton
+                            content="Import Workspace"
-                                content="Import Workspace"
+                            onClick={handleImportWorkspace}
-                                onClick={handleImportWorkspace}
+                        />
-                            />
+                        <ListButton
-                        )}
+                            content="Export Workspace"
-                        {BooleanExportWorkspace && (
+                            onClick={handleExportWorkspace}
-                            <ListButton
+                        />
-                                content="Export Workspace"
-                                onClick={handleExportWorkspace}
-                            />
-                        )}
 
                         <p className="textDescription">
                             Last edited by {user && user.nickname}

libs/components/layout/src/settings-sidebar/Settings/use-setting-flags.ts

@@ -2,8 +2,6 @@ import { useFlag } from '@toeverything/datasource/feature-flags';
 
 export const useSettingFlags = () => {
     const booleanFullWidthChecked = useFlag('BooleanFullWidthChecked', false);
-    const booleanExportWorkspace = useFlag('BooleanExportAffineDb', true);
-    const booleanImportWorkspace = useFlag('BooleanImportAffineDb', true);
     const booleanExportHtml = useFlag('BooleanExportHtml', false);
     const booleanExportPdf = useFlag('BooleanExportPdf', false);
     const booleanExportMarkdown = useFlag('BooleanExportMarkdown', false);
@@ -11,8 +9,6 @@ export const useSettingFlags = () => {
 
     return {
         booleanFullWidthChecked,
-        booleanExportWorkspace,
-        booleanImportWorkspace,
         booleanExportHtml,
         booleanExportPdf,
         booleanExportMarkdown,

libs/components/layout/src/settings-sidebar/Settings/use-settings.ts

@@ -156,15 +156,13 @@ export const useSettings = (): SettingItem[] => {
             type: 'button',
             name: t('Import Workspace'),
             key: 'Import Workspace',
-            onClick: () => importWorkspace(workspaceId),
+            onClick: () => importWorkspace(),
-            flag: 'booleanClearWorkspace',
         },
         {
             type: 'button',
             name: t('Export Workspace'),
             key: 'Export Workspace',
             onClick: () => exportWorkspace(),
-            flag: 'booleanExportWorkspace',
         },
     ];
 

libs/components/layout/src/settings-sidebar/Settings/util/inspector-workspace.ts

@@ -1,18 +1,17 @@
 /**
  * @deprecated debugging method, deprecated
  */
-export const importWorkspace = (workspaceId: string) => {
+export const importWorkspace = async () => {
-    //@ts-ignore
+    if (window.confirm('Your currently open data will be lost.')) {
-    window.client
+        //@ts-ignore
-        .inspector()
+        const status = await window.client.inspector().load();
-        .load()
+
-        .then(status => {
+        console.log(status);
-            if (status) {
+
-                if (window.confirm('Your currently open data will be lost.')) {
+        if (status) {
-                    window.location.href = `/${workspaceId}/`;
+            window.location.reload();
-                }
+        }
-            }
+    }
-        });
 };
 
 /**

libs/datasource/db-service/src/services/workspace/user-config.ts

@@ -36,7 +36,7 @@ export class UserConfig extends ServiceBaseClass {
         }
 
         const db = await this.database.getDatabase(workspace);
-        const newPage = await db.get_named_block('start-page');
+        const newPage = await db.getNamedBlock('start-page');
 
         await this.get_dependency(PageTree).addPage(workspace, newPage.id);
         await this.addRecentPage(workspace, userId, newPage.id);

libs/datasource/jwt/src/index.ts

@@ -357,7 +357,7 @@ export class BlockClient<
      * @param name block name
      * @returns block instance
      */
-    public async get_named_block(
+    public async getNamedBlock(
         name: string,
         options?: { workspace?: boolean }
     ): Promise<BaseBlock<B, C>> {
@@ -376,7 +376,7 @@ export class BlockClient<
      */
     public async getWorkspace() {
         if (!this._root.node) {
-            this._root.node = await this.get_named_block(this._workspace, {
+            this._root.node = await this.getNamedBlock(this._workspace, {
                 workspace: true,
             });
         }

libs/datasource/jwt/src/yjs/index.ts

@@ -371,7 +371,6 @@ export class YjsAdapter implements AsyncDatabaseAdapter<YjsContentOperation> {
                         applyUpdate(doc, new Uint8Array(binary));
                         await update_check;
                     }
-                    console.log('load success');
 
                     return true;
                 } catch (err) {