refactor: support suspense mode in workspaces (#1304)

apps/web/src/hooks/current/use-current-page-id.ts

@@ -1,7 +1,40 @@
-import { useAtom } from 'jotai';
+import { Page } from '@blocksuite/store';
+import { atom, useAtom, useAtomValue } from 'jotai';
 
 import { currentPageIdAtom } from '../../atoms';
+import { currentWorkspaceAtom } from './use-current-workspace';
 
+export const currentPageAtom = atom<Promise<Page | null>>(async get => {
+  const id = get(currentPageIdAtom);
+  const workspace = await get(currentWorkspaceAtom);
+  if (!workspace || !id) {
+    return Promise.resolve(null);
+  }
+
+  const page = workspace.blockSuiteWorkspace.getPage(id);
+  if (page) {
+    return page;
+  } else {
+    return new Promise(resolve => {
+      const dispose = workspace.blockSuiteWorkspace.slots.pageAdded.on(
+        pageId => {
+          if (pageId === id) {
+            resolve(page);
+            dispose.dispose();
+          }
+        }
+      );
+    });
+  }
+});
+
+export function useCurrentPage(): Page | null {
+  return useAtomValue(currentPageAtom);
+}
+
+/**
+ * @deprecated
+ */
 export function useCurrentPageId(): [
   string | null,
   (newId: string | null) => void

apps/web/src/hooks/current/use-current-workspace.ts

@@ -1,18 +1,30 @@
-import { useAtom } from 'jotai';
+import { atom, useAtom, useAtomValue } from 'jotai';
 import { useCallback } from 'react';
 
-import { currentPageIdAtom, currentWorkspaceIdAtom } from '../../atoms';
+import {
+  currentPageIdAtom,
+  currentWorkspaceIdAtom,
+  workspacesAtom,
+} from '../../atoms';
 import { RemWorkspace } from '../../shared';
-import { useWorkspace } from '../use-workspace';
+
+export const currentWorkspaceAtom = atom<Promise<RemWorkspace | null>>(
+  async get => {
+    const id = get(currentWorkspaceIdAtom);
+    const workspaces = await get(workspacesAtom);
+    return workspaces.find(workspace => workspace.id === id) ?? null;
+  }
+);
 
 export function useCurrentWorkspace(): [
   RemWorkspace | null,
   (id: string | null) => void
 ] {
-  const [id, setId] = useAtom(currentWorkspaceIdAtom);
+  const currentWorkspace = useAtomValue(currentWorkspaceAtom);
+  const [, setId] = useAtom(currentWorkspaceIdAtom);
   const [, setPageId] = useAtom(currentPageIdAtom);
   return [
-    useWorkspace(id),
+    currentWorkspace,
     useCallback(
       (id: string | null) => {
         setPageId(null);