mutate after renamed

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

@@ -37,8 +37,8 @@ interface ItemProps {
   isScrolled: boolean,
   isOpen?: boolean
   isEnabledAttachTitleHeader?: boolean
+  mutateAfterRenamed?(): void
   onClickDuplicateMenuItem?(pageToDuplicate: IPageForPageDuplicateModal): void
-  onClickRenameMenuItem?(pageToRename: IPageForPageRenameModal): void
   onClickDeleteMenuItem?(pageToDelete: IPageToDeleteWithMeta): void
 }
 
@@ -111,7 +111,7 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
   const { t } = useTranslation();
   const {
     itemNode, targetPathOrId, isOpen: _isOpen = false, isEnabledAttachTitleHeader,
-    onClickDuplicateMenuItem, onClickRenameMenuItem, onClickDeleteMenuItem, isEnableActions,
+    mutateAfterRenamed, onClickDuplicateMenuItem, onClickDeleteMenuItem, isEnableActions,
   } = props;
 
   const { page, children } = itemNode;
@@ -278,6 +278,10 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
         isRenameRedirect: false,
         isRemainMetadata: false,
       });
+
+      if (mutateAfterRenamed != null) {
+        mutateAfterRenamed();
+      }
     }
     catch (err) {
       setRenameInputShown(true);
@@ -500,8 +504,8 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
               isScrolled={props.isScrolled}
               targetPathOrId={targetPathOrId}
               isEnabledAttachTitleHeader={isEnabledAttachTitleHeader}
+              mutateAfterRenamed={mutateAfterRenamed}
               onClickDuplicateMenuItem={onClickDuplicateMenuItem}
-              onClickRenameMenuItem={onClickRenameMenuItem}
               onClickDeleteMenuItem={onClickDeleteMenuItem}
             />
           </div>

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

@@ -74,8 +74,8 @@ const renderByInitialNode = (
     isScrolled: boolean,
     targetPathOrId?: string,
     isEnabledAttachTitleHeader?: boolean,
+    mutateAfterRenamed?: () => void,
     onClickDuplicateMenuItem?: (pageToDuplicate: IPageForPageDuplicateModal) => void,
-    onClickRenameMenuItem?: (pageToRename: IPageForPageRenameModal) => void,
     onClickDeleteMenuItem?: (pageToDelete: IPageToDeleteWithMeta) => void,
 ): JSX.Element => {
 
@@ -88,8 +88,8 @@ const renderByInitialNode = (
         isOpen
         isEnabledAttachTitleHeader={isEnabledAttachTitleHeader}
         isEnableActions={isEnableActions}
+        mutateAfterRenamed={mutateAfterRenamed}
         onClickDuplicateMenuItem={onClickDuplicateMenuItem}
-        onClickRenameMenuItem={onClickRenameMenuItem}
         onClickDeleteMenuItem={onClickDeleteMenuItem}
         isScrolled={isScrolled}
       />
@@ -164,6 +164,12 @@ const ItemsTree: FC<ItemsTreeProps> = (props: ItemsTreeProps) => {
     });
   }, [socket, ptDescCountMap, updatePtDescCountMap]);
 
+  const mutateAfterRenamed = () => {
+    advancePt();
+    advanceFts();
+    advanceDpl();
+  };
+
   const onClickDuplicateMenuItem = (pageToDuplicate: IPageForPageDuplicateModal) => {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const duplicatedHandler: OnDuplicatedFunction = (fromPath, toPath) => {
@@ -177,18 +183,6 @@ const ItemsTree: FC<ItemsTreeProps> = (props: ItemsTreeProps) => {
     openDuplicateModal(pageToDuplicate, { onDuplicated: duplicatedHandler });
   };
 
-  const onClickRenameMenuItem = (pageToRename: IPageForPageRenameModal) => {
-    const renamedHandler: OnRenamedFunction = (path) => {
-      toastSuccess(t('renamed_pages', { path }));
-
-      advancePt();
-      advanceFts();
-      advanceDpl();
-    };
-
-    openRenameModal(pageToRename, { onRenamed: renamedHandler });
-  };
-
   const onClickDeleteMenuItem = (pageToDelete: IPageToDeleteWithMeta) => {
     const onDeletedHandler: OnDeletedFunction = (pathOrPathsToDelete, isRecursively, isCompletely) => {
       if (typeof pathOrPathsToDelete !== 'string') {
@@ -225,7 +219,7 @@ const ItemsTree: FC<ItemsTreeProps> = (props: ItemsTreeProps) => {
     const initialNode = generateInitialNodeAfterResponse(ancestorsChildrenData.ancestorsChildren, new ItemNode(rootPageData.rootPage));
     return renderByInitialNode(
       // eslint-disable-next-line max-len
-      initialNode, isEnableActions, isScrolled, targetPathOrId, isEnabledAttachTitleHeader, onClickDuplicateMenuItem, onClickRenameMenuItem, onClickDeleteMenuItem,
+      initialNode, isEnableActions, isScrolled, targetPathOrId, isEnabledAttachTitleHeader, mutateAfterRenamed, onClickDuplicateMenuItem, onClickDeleteMenuItem,
     );
   }
 
@@ -236,7 +230,7 @@ const ItemsTree: FC<ItemsTreeProps> = (props: ItemsTreeProps) => {
     const initialNode = generateInitialNodeBeforeResponse(targetAndAncestorsData.targetAndAncestors);
     return renderByInitialNode(
       // eslint-disable-next-line max-len
-      initialNode, isEnableActions, isScrolled, targetPathOrId, isEnabledAttachTitleHeader, onClickDuplicateMenuItem, onClickRenameMenuItem, onClickDeleteMenuItem,
+      initialNode, isEnableActions, isScrolled, targetPathOrId, isEnabledAttachTitleHeader, mutateAfterRenamed, onClickDuplicateMenuItem, onClickDeleteMenuItem,
     );
   }