cannot move user pages

packages/app/src/components/Sidebar/PageTree/Item.tsx

@@ -16,8 +16,10 @@ import { toastWarning, toastError, toastSuccess } from '~/client/util/apiNotific
 
 import { useSWRxPageChildren } from '~/stores/page-listing';
 import { apiv3Put, apiv3Post } from '~/client/util/apiv3-client';
+import { useIsUserPage } from '~/stores/context';
 import { IPageForPageRenameModal, IPageForPageDuplicateModal } from '~/stores/modal';
 
+
 import TriangleIcon from '~/components/Icons/TriangleIcon';
 import { bookmark, unbookmark } from '~/client/services/page-operation';
 import ClosableTextInput, { AlertInfo, AlertType } from '../../Common/ClosableTextInput';
@@ -62,7 +64,6 @@ const bookmarkMenuItemClickHandler = async(_pageId: string, _newValue: boolean):
   await bookmarkOperation(_pageId);
 };
 
-
 /**
  * Return new page path after the droppedPagePath is moved under the newParentPagePath
  * @param droppedPagePath
@@ -114,6 +115,8 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
     itemNode, targetPathOrId, isOpen: _isOpen = false, isEnabledAttachTitleHeader,
     onClickDuplicateMenuItem, onClickRenameMenuItem, onClickDeleteMenuItem, isEnableActions,
   } = props;
+  const [canDragItem, setCanDragItem] = useState(false);
+  const { data: isUserPage } = useIsUserPage();
 
   const { page, children } = itemNode;
 
@@ -122,6 +125,7 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
   const [isOpen, setIsOpen] = useState(_isOpen);
   const [isNewPageInputShown, setNewPageInputShown] = useState(false);
   const [shouldHide, setShouldHide] = useState(false);
+
   // const [isRenameInputShown, setRenameInputShown] = useState(false);
 
   const { data, mutate: mutateChildren } = useSWRxPageChildren(isOpen ? page._id : null);
@@ -146,10 +150,8 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
   const [{ canDrag }, drag] = useDrag({
     type: 'PAGE_TREE',
     item: { page },
-    canDrag: (monitor) => {
-      const item = monitor.getItem();
-      console.log('dragitem', item);
-      return false;
+    canDrag: () => {
+      return canDragItem;
     },
     end: (item, monitor) => {
       // in order to set d-none to dropped Item
@@ -164,8 +166,6 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
     }),
   });
 
-  console.log('canDrag', canDrag);
-
   const pageItemDropHandler = async(item: ItemNode) => {
     const { page: droppedPage } = item;
 
@@ -376,6 +376,10 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
     return null;
   };
 
+  useEffect(() => {
+    setCanDragItem(pagePathUtils.canDragByPath(page.path || '/'));
+  }, [page.path]);
+
   useEffect(() => {
     if (!props.isScrolled && page.isTarget) {
       document.dispatchEvent(new CustomEvent('targetItemRendered'));

packages/core/src/utils/page-path-utils.ts

@@ -47,6 +47,19 @@ export const isMovablePage = (path: string): boolean => {
   return !isTopPage(path) && !isUsersProtectedPages(path);
 };
 
+/**
+ * Whether path belongs to the user page
+ * @param path
+ */
+export const isUserPage = (path: string): boolean => {
+  // https://regex101.com/r/BSDdRr/1
+  if (path.match(/^\/user(\/.*)?$/)) {
+    return true;
+  }
+
+  return false;
+};
+
 /**
  * Whether path belongs to the trash page
  * @param path
@@ -252,3 +265,12 @@ export const isPathAreaOverlap = (pathToTest: string, pathToBeTested: string): b
 export const canMoveByPath = (fromPath: string, toPath: string): boolean => {
   return !isPathAreaOverlap(fromPath, toPath);
 };
+
+/**
+ * Determine whether can move by path
+ * @param path string
+ * @returns boolean
+ */
+export const canDragByPath = (path: string): boolean => {
+  return !isUserPage(path);
+};