chore: remove useEditor

packages/app/src/hooks/use-change-page-meta.ts

@@ -1,6 +1,5 @@
 import { useCallback } from 'react';
-import { useAppState } from '@/providers/app-state-provider';
-import { PageMeta } from '@blocksuite/store';
+import { useAppState, PageMeta } from '@/providers/app-state-provider';
 
 export type ChangePageMeta = (
   pageId: string,

packages/app/src/hooks/use-current-page-meta.ts

@@ -1,17 +1,17 @@
 import { useCallback, useEffect, useState } from 'react';
-import { useAppState } from '@/providers/app-state-provider';
-import { PageMeta } from '@blocksuite/store';
+import { useAppState, PageMeta } from '@/providers/app-state-provider';
 
-export const useCurrentPageMeta = () => {
+export const useCurrentPageMeta = (): PageMeta | null => {
   const { currentPage, currentWorkspace } = useAppState();
 
-  const pageMetaHandler = useCallback(() => {
+  const pageMetaHandler = useCallback((): PageMeta | null => {
     if (!currentPage || !currentWorkspace) {
       return null;
     }
     return (
-      currentWorkspace?.meta.pageMetas.find(p => p.id === currentPage.pageId) ??
-      null
+      (currentWorkspace?.meta.pageMetas.find(
+        p => p.id === currentPage.pageId
+      ) as PageMeta) ?? null
     );
   }, [currentPage, currentWorkspace]);
 

packages/app/src/hooks/use-editor-mode.ts

@@ -1,7 +0,0 @@
-import { useState } from 'react';
-import { EditorContainer } from '@blocksuite/editor';
-import { useAppState } from '@/providers/app-state-provider';
-
-export const usePageHandler = () => {
-  return null;
-};

packages/app/src/hooks/use-history-update.ts

@@ -0,0 +1,37 @@
+import { Page } from '@blocksuite/store';
+import { useAppState } from '@/providers/app-state-provider';
+import { useEffect, useRef } from 'react';
+
+export type EventCallBack<T> = (callback: (props: T) => void) => void;
+export type UseHistoryUpdated = (page?: Page) => EventCallBack<Page>;
+
+export const useHistoryUpdate: UseHistoryUpdated = () => {
+  const { currentPage } = useAppState();
+
+  const callbackQueue = useRef<((page: Page) => void)[]>([]);
+
+  useEffect(() => {
+    if (!currentPage) {
+      return;
+    }
+
+    setTimeout(() => {
+      currentPage.signals.historyUpdated.on(() => {
+        callbackQueue.current.forEach(callback => {
+          callback(currentPage);
+        });
+      });
+    }, 300);
+
+    return () => {
+      callbackQueue.current = [];
+      currentPage.signals.historyUpdated.dispose();
+    };
+  }, [currentPage]);
+
+  return callback => {
+    callbackQueue.current.push(callback);
+  };
+};
+
+export default useHistoryUpdate;

packages/app/src/hooks/use-page-helper.ts

@@ -1,51 +1,88 @@
-import { Page } from '@blocksuite/store';
-import { PageMeta } from '@/providers/editor-provider';
+import { Workspace } from '@blocksuite/store';
+import { QueryContent } from '@blocksuite/store/dist/workspace/search';
 import { useAppState } from '@/providers/app-state-provider';
+import { EditorContainer } from '@blocksuite/editor';
+import { useChangePageMeta } from '@/hooks/use-change-page-meta';
+import { useRouter } from 'next/router';
 
 export type EditorHandlers = {
   // createPage: (params?: { pageId?: string; title?: string }) => Promise<Page>;
-  // openPage: (
-  //   pageId: string,
-  //   query?: { [key: string]: string }
-  // ) => Promise<boolean>;
+  openPage: (
+    pageId: string,
+    query?: { [key: string]: string }
+  ) => Promise<boolean>;
   // getPageMeta: (pageId?: string) => PageMeta;
-  toggleDeletePage: (pageId: string) => void;
-  toggleFavoritePage: (pageId: string) => void;
-  // permanentlyDeletePage: (pageId: string) => void;
-  search: (query: string) => Map<string, string | undefined>;
+  toggleDeletePage: (pageId: string) => Promise<boolean>;
+  toggleFavoritePage: (pageId: string) => Promise<boolean>;
+  permanentlyDeletePage: (pageId: string) => void;
+  search: (query: QueryContent) => Map<string, string | undefined>;
   // changeEditorMode: (pageId: string) => void;
+  changePageMode: (
+    pageId: string,
+    mode: EditorContainer['mode']
+  ) => Promise<EditorContainer['mode']>;
 };
 
+const getPageMeta = (workspace: Workspace | null, pageId: string) => {
+  return workspace?.meta.pageMetas.find(p => p.id === pageId);
+};
 export const usePageHelper = (): EditorHandlers => {
-  const { currentWorkspace } = useAppState();
+  const router = useRouter();
+  const changePageMeta = useChangePageMeta();
+  const { currentWorkspace, editor, currentWorkspaceId } = useAppState();
 
   return {
-    toggleFavoritePage: (pageId: string) => {
-      if (!currentWorkspace) {
-        return;
-      }
-      const pageMeta = currentWorkspace.meta.pageMetas.find(
-        p => p.id === pageId
-      );
-      if (pageMeta) {
-        currentWorkspace.setPageMeta(pageId, {
-          favorite: !pageMeta.favorite,
-        });
+    toggleFavoritePage: async pageId => {
+      const pageMeta = getPageMeta(currentWorkspace, pageId);
+      if (!pageMeta) {
+        return Promise.reject('No page');
       }
+      const favorite = !pageMeta.favorite;
+      changePageMeta(pageMeta.id, {
+        favorite,
+      });
+      return favorite;
     },
-    toggleDeletePage: (pageId: string) => {
-      const pageMeta = currentWorkspace?.meta.pageMetas.find(
-        p => p.id === pageId
-      );
-      if (pageMeta) {
-        currentWorkspace!.setPageMeta(pageId, {
-          trash: !pageMeta.trash,
-          trashDate: +new Date(),
-        });
+    toggleDeletePage: async pageId => {
+      const pageMeta = getPageMeta(currentWorkspace, pageId);
+
+      if (!pageMeta) {
+        return Promise.reject('No page');
       }
+      const trash = !pageMeta.trash;
+
+      changePageMeta(pageMeta.id, {
+        trash,
+        trashDate: +new Date(),
+      });
+      return trash;
     },
     search: (query: string) => {
       return currentWorkspace!.search(query);
     },
+    changePageMode: async (pageId, mode) => {
+      const pageMeta = getPageMeta(currentWorkspace, pageId);
+      if (!pageMeta) {
+        return Promise.reject('No page');
+      }
+
+      editor?.setAttribute('mode', mode as string);
+
+      changePageMeta(pageMeta.id, {
+        mode,
+      });
+      return mode;
+    },
+    permanentlyDeletePage: pageId => {
+      // TODO:  workspace.meta.removePage or workspace.removePage?
+      currentWorkspace!.meta.removePage(pageId);
+    },
+    openPage: (pageId, query = {}) => {
+      pageId = pageId.replace('space:', '');
+      return router.push({
+        pathname: `/workspace/${currentWorkspaceId}/${pageId}`,
+        query,
+      });
+    },
   };
 };

packages/app/src/hooks/use-page-meta-list.ts

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react';
-import { PageMeta } from '@/providers/app-state-provider/usePageList';
+import { PageMeta } from '@/providers/app-state-provider';
 import { useAppState } from '@/providers/app-state-provider';
 
 export const usePageMetaList = () => {

packages/app/src/hooks/use-props-updated.ts

@@ -0,0 +1,38 @@
+import { useEffect, useRef } from 'react';
+import { EditorContainer } from '@blocksuite/editor';
+import { useAppState } from '@/providers/app-state-provider';
+export type EventCallBack<T> = (callback: (props: T) => void) => void;
+
+export type UsePropsUpdated = (
+  editor?: EditorContainer
+) => EventCallBack<EditorContainer>;
+
+export const usePropsUpdated: UsePropsUpdated = () => {
+  const { editor } = useAppState();
+
+  const callbackQueue = useRef<((editor: EditorContainer) => void)[]>([]);
+
+  useEffect(() => {
+    if (!editor) {
+      return;
+    }
+    setTimeout(() => {
+      editor.model?.propsUpdated.on(() => {
+        callbackQueue.current.forEach(callback => {
+          callback(editor);
+        });
+      });
+    }, 300);
+
+    return () => {
+      callbackQueue.current = [];
+      editor?.model?.propsUpdated.dispose();
+    };
+  }, [editor]);
+
+  return callback => {
+    callbackQueue.current.push(callback);
+  };
+};
+
+export default usePropsUpdated;