refactor(core): favorited adapter

toeverything · Mar 24, 2024 · 347e782 · 347e782
1 parent 6a02d0b
commit 347e782
Show file tree

Hide file tree

Showing 20 changed files with 338 additions and 211 deletions.
diff --git a/packages/frontend/core/src/components/affine/page-properties/page-properties-manager.ts b/packages/frontend/core/src/components/affine/page-properties/page-properties-manager.ts
@@ -5,8 +5,8 @@ import type {
   PageInfoCustomPropertyMeta,
 } from '@affine/core/modules/workspace/properties/schema';
 import { PagePropertyType } from '@affine/core/modules/workspace/properties/schema';
+import { FractionalIndexingSortableItems } from '@affine/core/utils';
 import { DebugLogger } from '@affine/debug';
-import { generateKeyBetween } from 'fractional-indexing';
 import { nanoid } from 'nanoid';
 
 import { getDefaultIconName } from './icons-mapping';
@@ -137,12 +137,13 @@ export class PagePropertiesMetaManager {
   }
 }
 
-export class PagePropertiesManager {
+export class PagePropertiesManager extends FractionalIndexingSortableItems<PageInfoCustomProperty> {
   public readonly metaManager: PagePropertiesMetaManager;
   constructor(
     private readonly adapter: WorkspacePropertiesAdapter,
     public readonly pageId: string
   ) {
+    super();
     this.metaManager = new PagePropertiesMetaManager(this.adapter);
     this.ensureRequiredProperties();
   }
@@ -163,6 +164,22 @@ export class PagePropertiesManager {
     this.ensuring = false;
   }
 
+  get items() {
+    return Object.values(this.getCustomProperties());
+  }
+
+  getItemOrder(item: PageInfoCustomProperty): string {
+    return item.order;
+  }
+
+  setItemOrder(item: PageInfoCustomProperty, order: string) {
+    item.order = order;
+  }
+
+  getItemId(item: PageInfoCustomProperty) {
+    return item.id;
+  }
+
   get workspace() {
     return this.adapter.workspace;
   }
@@ -204,16 +221,6 @@ export class PagePropertiesManager {
       : {};
   }
 
-  getOrderedCustomProperties() {
-    return Object.values(this.getCustomProperties()).sort((a, b) =>
-      a.order > b.order ? 1 : a.order < b.order ? -1 : 0
-    );
-  }
-
-  largestOrder() {
-    return this.getOrderedCustomProperties().at(-1)?.order ?? null;
-  }
-
   getCustomPropertyMeta(id: string): PageInfoCustomPropertyMeta | undefined {
     return this.metaManager.customPropertiesSchema[id];
   }
@@ -234,7 +241,7 @@ export class PagePropertiesManager {
       return;
     }
 
-    const newOrder = generateKeyBetween(this.largestOrder(), null);
+    const newOrder = this.getNewItemOrder();
     if (this.properties!.custom[id]) {
       logger.warn(`custom property ${id} already exists`);
     }
@@ -247,21 +254,6 @@ export class PagePropertiesManager {
     };
   }
 
-  moveCustomProperty(from: number, to: number) {
-    this.ensureRequiredProperties();
-    // move from -> to means change from's order to a new order between to and to -1/+1
-    const properties = this.getOrderedCustomProperties();
-    const fromProperty = properties[from];
-    const toProperty = properties[to];
-    const toNextProperty = properties[from < to ? to + 1 : to - 1];
-    const args: [string?, string?] =
-      from < to
-        ? [toProperty.order, toNextProperty?.order ?? null]
-        : [toNextProperty?.order ?? null, toProperty.order];
-    const newOrder = generateKeyBetween(...args);
-    this.properties!.custom[fromProperty.id].order = newOrder;
-  }
-
   hasCustomProperty(id: string) {
     return !!this.properties?.custom[id];
   }

diff --git a/packages/frontend/core/src/components/affine/page-properties/table.tsx b/packages/frontend/core/src/components/affine/page-properties/table.tsx
@@ -103,10 +103,7 @@ interface SortablePropertiesProps {
 
 const SortableProperties = ({ children }: SortablePropertiesProps) => {
   const manager = useContext(managerContext);
-  const properties = useMemo(
-    () => manager.getOrderedCustomProperties(),
-    [manager]
-  );
+  const properties = useMemo(() => manager.getOrderedItems(), [manager]);
   const editingItem = useAtomValue(editingPropertyAtom);
   const draggable = !manager.readonly && !editingItem;
   const sensors = useSensors(
@@ -130,15 +127,12 @@ const SortableProperties = ({ children }: SortablePropertiesProps) => {
         return;
       }
       const { active, over } = event;
-      const fromIndex = properties.findIndex(p => p.id === active.id);
-      const toIndex = properties.findIndex(p => p.id === over?.id);
-
-      if (fromIndex !== -1 && toIndex !== -1 && fromIndex !== toIndex) {
-        manager.moveCustomProperty(fromIndex, toIndex);
-        setLocalProperties(manager.getOrderedCustomProperties());
+      if (over) {
+        manager.move(active.id, over.id);
       }
+      setLocalProperties(manager.getOrderedItems());
     },
-    [manager, properties, draggable]
+    [manager, draggable]
   );
 
   const filteredProperties = useMemo(
@@ -638,7 +632,7 @@ export const PagePropertiesTableHeader = ({
     onOpenChange(!open);
   }, [onOpenChange, open]);
 
-  const properties = manager.getOrderedCustomProperties();
+  const properties = manager.getOrderedItems();
 
   return (
     <div className={clsx(styles.tableHeader, className)} style={style}>

diff --git a/packages/frontend/core/src/components/blocksuite/block-suite-header/favorite/index.tsx b/packages/frontend/core/src/components/blocksuite/block-suite-header/favorite/index.tsx
@@ -1,12 +1,11 @@
 import { FavoriteTag } from '@affine/core/components/page-list';
-import { useBlockSuiteMetaHelper } from '@affine/core/hooks/affine/use-block-suite-meta-helper';
-import { useBlockSuiteDocMeta } from '@affine/core/hooks/use-block-suite-page-meta';
+import { FavoriteItemsAdapter } from '@affine/core/modules/workspace';
 import { toast } from '@affine/core/utils';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { assertExists } from '@blocksuite/global/utils';
-import { Workspace } from '@toeverything/infra';
+import { useLiveData, Workspace } from '@toeverything/infra';
 import { useService } from '@toeverything/infra/di';
-import { useCallback } from 'react';
+import { useCallback, useMemo } from 'react';
 
 export interface FavoriteButtonProps {
   pageId: string;
@@ -17,24 +16,21 @@ export const useFavorite = (pageId: string) => {
   const workspace = useService(Workspace);
   const docCollection = workspace.docCollection;
   const currentPage = docCollection.getDoc(pageId);
+  const favAdapter = useService(FavoriteItemsAdapter);
   assertExists(currentPage);
 
-  const pageMeta = useBlockSuiteDocMeta(docCollection).find(
-    meta => meta.id === pageId
+  const favorite = useLiveData(
+    useMemo(() => favAdapter.isFavorite$(pageId), [favAdapter, pageId])
   );
-  const favorite = pageMeta?.favorite ?? false;
-
-  const { toggleFavorite: _toggleFavorite } =
-    useBlockSuiteMetaHelper(docCollection);
 
   const toggleFavorite = useCallback(() => {
-    _toggleFavorite(pageId);
+    favAdapter.toggle(pageId);
     toast(
       favorite
         ? t['com.affine.toastMessage.removedFavorites']()
         : t['com.affine.toastMessage.addedFavorites']()
     );
-  }, [favorite, pageId, t, _toggleFavorite]);
+  }, [favorite, pageId, t, favAdapter]);
 
   return { favorite, toggleFavorite };
 };

diff --git a/packages/frontend/core/src/components/page-list/docs/virtualized-page-list.tsx b/packages/frontend/core/src/components/page-list/docs/virtualized-page-list.tsx
@@ -1,12 +1,8 @@
-import { toast } from '@affine/component';
-import { useBlockSuiteMetaHelper } from '@affine/core/hooks/affine/use-block-suite-meta-helper';
 import { useTrashModalHelper } from '@affine/core/hooks/affine/use-trash-modal-helper';
 import { useBlockSuiteDocMeta } from '@affine/core/hooks/use-block-suite-page-meta';
 import type { Tag } from '@affine/core/modules/tag';
-import { Workbench } from '@affine/core/modules/workbench';
 import type { Collection, Filter } from '@affine/env/filter';
 import { Trans } from '@affine/i18n';
-import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import type { DocMeta } from '@blocksuite/store';
 import { useService } from '@toeverything/infra';
 import { Workspace } from '@toeverything/infra';
@@ -29,61 +25,9 @@ import {
 } from './page-list-header';
 
 const usePageOperationsRenderer = () => {
-  const currentWorkspace = useService(Workspace);
-  const { setTrashModal } = useTrashModalHelper(currentWorkspace.docCollection);
-  const { toggleFavorite, duplicate } = useBlockSuiteMetaHelper(
-    currentWorkspace.docCollection
-  );
-  const t = useAFFiNEI18N();
-  const workbench = useService(Workbench);
-
-  const pageOperationsRenderer = useCallback(
-    (page: DocMeta) => {
-      const onDisablePublicSharing = () => {
-        toast('Successfully disabled', {
-          portal: document.body,
-        });
-      };
-
-      return (
-        <PageOperationCell
-          favorite={!!page.favorite}
-          isPublic={!!page.isPublic}
-          onDisablePublicSharing={onDisablePublicSharing}
-          link={`/workspace/${currentWorkspace.id}/${page.id}`}
-          onOpenInSplitView={() => workbench.openPage(page.id, { at: 'tail' })}
-          onDuplicate={() => {
-            duplicate(page.id, false);
-          }}
-          onRemoveToTrash={() =>
-            setTrashModal({
-              open: true,
-              pageIds: [page.id],
-              pageTitles: [page.title],
-            })
-          }
-          onToggleFavoritePage={() => {
-            const status = page.favorite;
-            toggleFavorite(page.id);
-            toast(
-              status
-                ? t['com.affine.toastMessage.removedFavorites']()
-                : t['com.affine.toastMessage.addedFavorites']()
-            );
-          }}
-        />
-      );
-    },
-    [
-      currentWorkspace.id,
-      workbench,
-      duplicate,
-      setTrashModal,
-      toggleFavorite,
-      t,
-    ]
-  );
-
+  const pageOperationsRenderer = useCallback((page: DocMeta) => {
+    return <PageOperationCell page={page} />;
+  }, []);
   return pageOperationsRenderer;
 };