feat(storybook): preview app (#3765)

apps/core/package.json

@@ -8,6 +8,11 @@
     "dev": "yarn -T run dev-core",
     "static-server": "ts-node-esm ./server.mts"
   },
+  "exports": {
+    "./app": "./src/app.tsx",
+    "./router": "./src/router.ts",
+    "./bootstrap/setup": "./src/bootstrap/setup.ts"
+  },
   "dependencies": {
     "@affine-test/fixtures": "workspace:*",
     "@affine/component": "workspace:*",

apps/core/src/bootstrap/setup.ts

@@ -169,7 +169,14 @@ function createFirstAppData() {
   rootStore.set(rootWorkspacesMetadataAtom, result);
 }
 
+let isSetup = false;
+
 export async function setup() {
+  if (isSetup) {
+    console.warn('already setup');
+    return;
+  }
+  isSetup = true;
   rootStore.set(
     workspaceAdaptersAtom,
     WorkspaceAdapters as Record<

apps/core/src/components/blocksuite/block-suite-mode-switch/switch-items.tsx

@@ -3,6 +3,8 @@ import type { HTMLAttributes } from 'react';
 import type React from 'react';
 import { cloneElement, useState } from 'react';
 
+import edgelessHover from './animation-data/edgeless-hover.json';
+import pageHover from './animation-data/page-hover.json';
 import { StyledSwitchItem } from './style';
 
 type HoverAnimateControllerProps = {
@@ -52,7 +54,7 @@ export const PageSwitchItem = (
         options={{
           loop: false,
           autoplay: false,
-          animationData: require('./animation-data/page-hover.json'),
+          animationData: pageHover,
           rendererSettings: {
             preserveAspectRatio: 'xMidYMid slice',
           },
@@ -71,7 +73,7 @@ export const EdgelessSwitchItem = (
         options={{
           loop: false,
           autoplay: false,
-          animationData: require('./animation-data/edgeless-hover.json'),
+          animationData: edgelessHover,
           rendererSettings: {
             preserveAspectRatio: 'xMidYMid slice',
           },

apps/core/src/router.ts

@@ -1,41 +1,41 @@
+import type { RouteObject } from 'react-router-dom';
 import { createBrowserRouter } from 'react-router-dom';
 
-export const router = createBrowserRouter(
-  [
-    {
-      path: '/',
-      lazy: () => import('./pages/index'),
-    },
-    {
-      path: '/workspace/:workspaceId',
-      lazy: () => import('./pages/workspace/index'),
-      children: [
-        {
-          path: 'all',
-          lazy: () => import('./pages/workspace/all-page'),
-        },
-        {
-          path: 'trash',
-          lazy: () => import('./pages/workspace/trash-page'),
-        },
-        {
-          path: ':pageId',
-          lazy: () => import('./pages/workspace/detail-page'),
-        },
-      ],
-    },
-    {
-      path: '/404',
-      lazy: () => import('./pages/404'),
-    },
-    {
-      path: '*',
-      lazy: () => import('./pages/404'),
-    },
-  ],
+export const routes = [
   {
-    future: {
-      v7_normalizeFormMethod: true,
-    },
-  }
-);
+    path: '/',
+    lazy: () => import('./pages/index'),
+  },
+  {
+    path: '/workspace/:workspaceId',
+    lazy: () => import('./pages/workspace/index'),
+    children: [
+      {
+        path: 'all',
+        lazy: () => import('./pages/workspace/all-page'),
+      },
+      {
+        path: 'trash',
+        lazy: () => import('./pages/workspace/trash-page'),
+      },
+      {
+        path: ':pageId',
+        lazy: () => import('./pages/workspace/detail-page'),
+      },
+    ],
+  },
+  {
+    path: '/404',
+    lazy: () => import('./pages/404'),
+  },
+  {
+    path: '*',
+    lazy: () => import('./pages/404'),
+  },
+] satisfies [RouteObject, ...RouteObject[]];
+
+export const router = createBrowserRouter(routes, {
+  future: {
+    v7_normalizeFormMethod: true,
+  },
+});

apps/core/tsconfig.json

@@ -5,7 +5,7 @@
     "typeRoots": ["../../node_modules", "../../node_modules/@types"],
     "types": ["webpack-env", "ses", "affine__env"]
   },
-  "include": ["src/**/*.ts", "src/**/*.tsx"],
+  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.json"],
   "exclude": ["node_modules"],
   "references": [
     {