fix: modify with new blocksuite version about subpage

apps/web/package.json

@@ -18,11 +18,11 @@
     "@affine/jotai": "workspace:*",
     "@affine/templates": "workspace:*",
     "@affine/workspace": "workspace:*",
-    "@blocksuite/blocks": "0.0.0-20230420160324-857b396c-nightly",
-    "@blocksuite/editor": "0.0.0-20230420160324-857b396c-nightly",
-    "@blocksuite/global": "0.0.0-20230420160324-857b396c-nightly",
+    "@blocksuite/blocks": "0.0.0-20230420210727-85b7de79-nightly",
+    "@blocksuite/editor": "0.0.0-20230420210727-85b7de79-nightly",
+    "@blocksuite/global": "0.0.0-20230420210727-85b7de79-nightly",
     "@blocksuite/icons": "^2.1.10",
-    "@blocksuite/store": "0.0.0-20230420160324-857b396c-nightly",
+    "@blocksuite/store": "0.0.0-20230420210727-85b7de79-nightly",
     "@dnd-kit/core": "^6.0.8",
     "@dnd-kit/sortable": "^7.0.2",
     "@emotion/cache": "^11.10.7",

apps/web/src/atoms/public-workspace/index.ts

@@ -25,7 +25,7 @@ function createPublicWorkspace(
   );
   blockSuiteWorkspace.awarenessStore.setFlag('enable_block_hub', false);
   blockSuiteWorkspace.awarenessStore.setFlag('enable_set_remote_flag', false);
-  blockSuiteWorkspace.awarenessStore.setFlag('enable_database', true);
+  blockSuiteWorkspace.awarenessStore.setFlag('enable_database', false);
   blockSuiteWorkspace.awarenessStore.setFlag('enable_edgeless_toolbar', false);
   blockSuiteWorkspace.awarenessStore.setFlag('enable_slash_menu', false);
   blockSuiteWorkspace.awarenessStore.setFlag('enable_drag_handle', false);

apps/web/src/components/affine/pinboard/pinboard-menu/index.tsx

@@ -3,9 +3,9 @@ import { Input, PureMenu, TreeView } from '@affine/component';
 import { useTranslation } from '@affine/i18n';
 import { RemoveIcon, SearchIcon } from '@blocksuite/icons';
 import type { PageMeta } from '@blocksuite/store';
-import { usePageMetaHelper } from '@toeverything/hooks/use-block-suite-page-meta';
 import React, { useCallback, useMemo, useState } from 'react';
 
+import { useReferenceLinkHelper } from '../../../../hooks/affine/use-reference-link-helper';
 import { usePinboardData } from '../../../../hooks/use-pinboard-data';
 import { usePinboardHandler } from '../../../../hooks/use-pinboard-handler';
 import type { BlockSuiteWorkspace } from '../../../../shared';
@@ -41,13 +41,13 @@ export const PinboardMenu = ({
     [currentMeta.id, propsMetas]
   );
   const { t } = useTranslation();
-  const { setPageMeta } = usePageMetaHelper(blockSuiteWorkspace);
   const [query, setQuery] = useState('');
   const isSearching = query.length > 0;
 
   const searchResult = metas.filter(
     meta => !meta.trash && meta.title.includes(query)
   );
+  const { removeReferenceLink } = useReferenceLinkHelper(blockSuiteWorkspace);
 
   const { dropPin } = usePinboardHandler({
     blockSuiteWorkspace,
@@ -117,16 +117,7 @@ export const PinboardMenu = ({
           <StyledPinboard
             data-testid={'remove-from-pinboard-button'}
             onClick={() => {
-              const parentMeta = metas.find(m =>
-                m.subpageIds.includes(currentMeta.id)
-              );
-              if (!parentMeta) return;
-              const newSubpageIds = [...parentMeta.subpageIds];
-              const deleteIndex = newSubpageIds.findIndex(
-                id => id === currentMeta.id
-              );
-              newSubpageIds.splice(deleteIndex, 1);
-              setPageMeta(parentMeta.id, { subpageIds: newSubpageIds });
+              removeReferenceLink(currentMeta.id);
             }}
           >
             <RemoveIcon />

apps/web/src/components/affine/pinboard/pinboard-render/AddButton.tsx

@@ -0,0 +1,22 @@
+import { PlusIcon } from '@blocksuite/icons';
+
+import { StyledOperationButton } from '../styles';
+import type { OperationButtonProps } from './OperationButton';
+
+export const AddButton = ({
+  onAdd,
+  visible,
+}: Pick<OperationButtonProps, 'onAdd' | 'visible'>) => {
+  return (
+    <StyledOperationButton
+      visible={visible}
+      size="small"
+      onClick={e => {
+        e.stopPropagation();
+        onAdd();
+      }}
+    >
+      <PlusIcon />
+    </StyledOperationButton>
+  );
+};

apps/web/src/components/affine/pinboard/pinboard-render/OperationButton.tsx

@@ -28,7 +28,7 @@ export type OperationButtonProps = {
   metas: PageMeta[];
   currentMeta: PageMeta;
   blockSuiteWorkspace: BlockSuiteWorkspace;
-  isHover: boolean;
+  visible: boolean;
   onRename?: () => void;
   onMenuClose?: () => void;
 };
@@ -39,7 +39,7 @@ export const OperationButton = ({
   metas,
   currentMeta,
   blockSuiteWorkspace,
-  isHover,
+  visible,
   onMenuClose,
   onRename,
 }: OperationButtonProps) => {
@@ -61,6 +61,7 @@ export const OperationButton = ({
       }}
     >
       <div
+        style={{ display: 'flex' }}
         onClick={e => {
           e.stopPropagation();
         }}
@@ -81,7 +82,7 @@ export const OperationButton = ({
           onClick={() => {
             setOperationMenuOpen(!operationMenuOpen);
           }}
-          visible={isHover}
+          visible={visible}
         >
           <MoreVerticalIcon />
         </StyledOperationButton>

apps/web/src/components/affine/pinboard/pinboard-render/index.tsx

@@ -14,6 +14,7 @@ import { useMemo, useState } from 'react';
 import { workspacePreferredModeAtom } from '../../../../atoms';
 import type { PinboardNode } from '../../../../hooks/use-pinboard-data';
 import { StyledCollapsedButton, StyledPinboard } from '../styles';
+import { AddButton } from './AddButton';
 import EmptyItem from './EmptyItem';
 import { OperationButton } from './OperationButton';
 
@@ -84,10 +85,8 @@ export const PinboardRender: PinboardNode['render'] = (
             <ArrowDownSmallIcon />
           </StyledCollapsedButton>
         )}
-
         {asPath && !isRoot ? <LevelIcon className="path-icon" /> : null}
         {getIcon(isRoot ? 'root' : record[node.id])}
-
         {showRename ? (
           <Input
             data-testid={`pinboard-input-${node.id}`}
@@ -106,6 +105,7 @@ export const PinboardRender: PinboardNode['render'] = (
         ) : (
           <span>{isRoot ? 'Pinboard' : currentMeta.title || 'Untitled'}</span>
         )}
+        {showOperationButton && <AddButton onAdd={onAdd} visible={isHover} />}
 
         {showOperationButton && (
           <OperationButton
@@ -115,7 +115,7 @@ export const PinboardRender: PinboardNode['render'] = (
             metas={metas}
             currentMeta={currentMeta!}
             blockSuiteWorkspace={blockSuiteWorkspace!}
-            isHover={isHover}
+            visible={isHover}
             onMenuClose={() => setIsHover(false)}
             onRename={() => {
               setShowRename(true);