From c0749fbb9f1c286aac84bd0ecba8d7dc1a9d4e75 Mon Sep 17 00:00:00 2001
From: Alex Yang <himself65@outlook.com>
Date: Mon, 17 Jul 2023 11:31:06 +0800
Subject: [PATCH] refactor: use `useCallback` (#3254)

---
 .../block-suite-page-list/index.tsx           |  2 +-
 .../collections/collections-list.tsx          |  2 +-
 apps/web/src/components/workspace-header.tsx  |  4 ++-
 apps/web/src/hooks/use-get-page-info.ts       | 32 ++++++++++---------
 4 files changed, 22 insertions(+), 18 deletions(-)

diff --git a/apps/web/src/components/blocksuite/block-suite-page-list/index.tsx b/apps/web/src/components/blocksuite/block-suite-page-list/index.tsx
index ad9a8060a5..e640fa8d6c 100644
--- a/apps/web/src/components/blocksuite/block-suite-page-list/index.tsx
+++ b/apps/web/src/components/blocksuite/block-suite-page-list/index.tsx
@@ -109,7 +109,7 @@ export const BlockSuitePageList: React.FC<BlockSuitePageListProps> = ({
   const { createPage, createEdgeless, importFile, isPreferredEdgeless } =
     usePageHelper(blockSuiteWorkspace);
   const t = useAFFiNEI18N();
-  const getPageInfo = useGetPageInfoById();
+  const getPageInfo = useGetPageInfoById(blockSuiteWorkspace);
   const tagOptionMap = useMemo(
     () =>
       Object.fromEntries(
diff --git a/apps/web/src/components/pure/workspace-slider-bar/collections/collections-list.tsx b/apps/web/src/components/pure/workspace-slider-bar/collections/collections-list.tsx
index 3cbff89b2f..1ae6404c03 100644
--- a/apps/web/src/components/pure/workspace-slider-bar/collections/collections-list.tsx
+++ b/apps/web/src/components/pure/workspace-slider-bar/collections/collections-list.tsx
@@ -255,7 +255,7 @@ const CollectionRenderer = ({
 export const CollectionsList = ({ workspace }: CollectionsListProps) => {
   const metas = useBlockSuitePageMeta(workspace);
   const { savedCollections } = useSavedCollections(workspace.id);
-  const getPageInfo = useGetPageInfoById();
+  const getPageInfo = useGetPageInfoById(workspace);
   return (
     <div data-testid="collections" className={styles.wrapper}>
       {savedCollections
diff --git a/apps/web/src/components/workspace-header.tsx b/apps/web/src/components/workspace-header.tsx
index d45fc43389..148d0f1f7a 100644
--- a/apps/web/src/components/workspace-header.tsx
+++ b/apps/web/src/components/workspace-header.tsx
@@ -35,7 +35,9 @@ export function WorkspaceHeader({
 
   const currentWorkspace = useWorkspace(currentWorkspaceId);
 
-  const getPageInfoById = useGetPageInfoById();
+  const getPageInfoById = useGetPageInfoById(
+    currentWorkspace.blockSuiteWorkspace
+  );
   if ('subPath' in currentEntry) {
     if (currentEntry.subPath === WorkspaceSubPath.ALL) {
       const leftSlot = (
diff --git a/apps/web/src/hooks/use-get-page-info.ts b/apps/web/src/hooks/use-get-page-info.ts
index 24b67a44ad..885a4336be 100644
--- a/apps/web/src/hooks/use-get-page-info.ts
+++ b/apps/web/src/hooks/use-get-page-info.ts
@@ -1,27 +1,29 @@
 import type { GetPageInfoById } from '@affine/env/page-info';
+import type { Workspace } from '@blocksuite/store';
 import { useBlockSuitePageMeta } from '@toeverything/hooks/use-block-suite-page-meta';
 import { useAtomValue } from 'jotai';
-import { useMemo } from 'react';
+import { useCallback, useMemo } from 'react';
 
 import { pageSettingsAtom } from '../atoms';
-import { useCurrentWorkspace } from './current/use-current-workspace';
 
-export const useGetPageInfoById = (): GetPageInfoById => {
-  const [currentWorkspace] = useCurrentWorkspace();
-  const pageMetas = useBlockSuitePageMeta(currentWorkspace.blockSuiteWorkspace);
+export const useGetPageInfoById = (workspace: Workspace): GetPageInfoById => {
+  const pageMetas = useBlockSuitePageMeta(workspace);
   const pageMap = useMemo(
     () => Object.fromEntries(pageMetas.map(page => [page.id, page])),
     [pageMetas]
   );
   const pageSettings = useAtomValue(pageSettingsAtom);
-  return (id: string) => {
-    const page = pageMap[id];
-    if (!page) {
-      return;
-    }
-    return {
-      ...page,
-      isEdgeless: pageSettings[id]?.mode === 'edgeless',
-    };
-  };
+  return useCallback(
+    (id: string) => {
+      const page = pageMap[id];
+      if (!page) {
+        return;
+      }
+      return {
+        ...page,
+        isEdgeless: pageSettings[id]?.mode === 'edgeless',
+      };
+    },
+    [pageMap, pageSettings]
+  );
 };