feat(core): use zip snapshot for onboarding page (#6495)

packages/frontend/core/src/bootstrap/first-app-data.ts

@@ -1,8 +1,61 @@
 import { DebugLogger } from '@affine/debug';
 import { DEFAULT_WORKSPACE_NAME } from '@affine/env/constant';
 import { WorkspaceFlavour } from '@affine/env/workspace';
-import type { WorkspaceManager } from '@toeverything/infra';
-import { buildShowcaseWorkspace, initEmptyPage } from '@toeverything/infra';
+import onboardingUrl from '@affine/templates/onboarding.zip';
+import { ZipTransformer } from '@blocksuite/blocks';
+import {
+  initEmptyPage,
+  PageRecordList,
+  type WorkspaceManager,
+} from '@toeverything/infra';
+
+export async function buildShowcaseWorkspace(
+  workspaceManager: WorkspaceManager,
+  flavour: WorkspaceFlavour,
+  workspaceName: string
+) {
+  const meta = await workspaceManager.createWorkspace(
+    flavour,
+    async docCollection => {
+      docCollection.meta.setName(workspaceName);
+      const blob = await (await fetch(onboardingUrl)).blob();
+
+      await ZipTransformer.importDocs(docCollection, blob);
+    }
+  );
+
+  const { workspace, release } = workspaceManager.open(meta);
+
+  await workspace.engine.waitForRootDocReady();
+
+  const pageRecordList = workspace.services.get(PageRecordList);
+
+  // todo: find better way to do the following
+  // perhaps put them into middleware?
+  {
+    // the "Write, Draw, Plan all at Once." page should be set to edgeless mode
+    const edgelessPage1 = pageRecordList.records$.value.find(
+      p => p.title$.value === 'Write, Draw, Plan all at Once.'
+    );
+
+    if (edgelessPage1) {
+      edgelessPage1.setMode('edgeless');
+    }
+
+    // should jump to "Write, Draw, Plan all at Once." by default
+    const defaultPage = pageRecordList.records$.value.find(p =>
+      p.title$.value.startsWith('Write, Draw, Plan all at Once.')
+    );
+
+    if (defaultPage) {
+      defaultPage.setMeta({
+        jumpOnce: true,
+      });
+    }
+  }
+  release();
+  return meta;
+}
 
 const logger = new DebugLogger('createFirstAppData');
 

packages/frontend/core/src/components/affine/create-workspace-modal/index.tsx

@@ -10,7 +10,6 @@ import { WorkspaceFlavour } from '@affine/env/workspace';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { _addLocalWorkspace } from '@affine/workspace-impl';
 import {
-  buildShowcaseWorkspace,
   initEmptyPage,
   useService,
   WorkspaceManager,
@@ -19,6 +18,7 @@ import { useSetAtom } from 'jotai';
 import type { KeyboardEvent } from 'react';
 import { useCallback, useLayoutEffect, useState } from 'react';
 
+import { buildShowcaseWorkspace } from '../../../bootstrap/first-app-data';
 import { mixpanel } from '../../../utils';
 import { CloudSvg } from '../share-page-modal/cloud-svg';
 import * as styles from './index.css';

packages/frontend/core/src/pages/workspace/index.tsx

@@ -1,4 +1,5 @@
 import { useWorkspace } from '@affine/core/hooks/use-workspace';
+import { ZipTransformer } from '@blocksuite/blocks';
 import type { Workspace } from '@toeverything/infra';
 import {
   ServiceProviderContext,
@@ -28,6 +29,8 @@ declare global {
    */
   // eslint-disable-next-line no-var
   var currentWorkspace: Workspace | undefined;
+  // eslint-disable-next-line no-var
+  var exportWorkspaceSnapshot: () => Promise<void>;
   interface WindowEventMap {
     'affine:workspace:change': CustomEvent<{ id: string }>;
   }
@@ -60,6 +63,19 @@ export const Component = (): ReactElement => {
 
     // for debug purpose
     window.currentWorkspace = workspace;
+    window.exportWorkspaceSnapshot = async () => {
+      const zip = await ZipTransformer.exportDocs(
+        workspace.docCollection,
+        Array.from(workspace.docCollection.docs.values())
+      );
+      const url = URL.createObjectURL(zip);
+      // download url
+      const a = document.createElement('a');
+      a.href = url;
+      a.download = `${workspace.docCollection.meta.name}.zip`;
+      a.click();
+      URL.revokeObjectURL(url);
+    };
     window.dispatchEvent(
       new CustomEvent('affine:workspace:change', {
         detail: {

packages/frontend/core/src/types/types.d.ts

@@ -14,6 +14,11 @@ declare module '*.assets.svg' {
   export default url;
 }
 
+declare module '*.zip' {
+  const url: string;
+  export default url;
+}
+
 declare module '*.png' {
   const url: string;
   export default url;