create onClick function

apps/app/src/components/PageHeader/page-header-utils.ts

@@ -9,13 +9,13 @@ import { useSWRMUTxCurrentPage } from '~/stores/page';
 import { mutatePageTree, mutatePageList } from '~/stores/page-listing';
 
 export const usePagePathRenameHandler = (
-    currentPage: IPagePopulatedToShowRevision, onRenameFinish?: () => void, onRenameFailure?: () => void,
+    currentPage?: IPagePopulatedToShowRevision | null, onRenameFinish?: () => void, onRenameFailure?: () => void,
 ): (newPagePath: string) => Promise<void> => {
 
   const { trigger: mutateCurrentPage } = useSWRMUTxCurrentPage();
   const { t } = useTranslation();
 
-  const currentPagePath = currentPage.path;
+  const currentPagePath = currentPage?.path;
 
   const pagePathRenameHandler = useCallback(async(newPagePath: string) => {
 
@@ -28,7 +28,7 @@ export const usePagePathRenameHandler = (
       }
     };
 
-    if (newPagePath === currentPage.path || newPagePath === '') {
+    if (newPagePath === currentPage?.path || newPagePath === '') {
       onRenameFinish?.();
       return;
     }
@@ -36,20 +36,20 @@ export const usePagePathRenameHandler = (
     try {
       onRenameFinish?.();
       await apiv3Put('/pages/rename', {
-        pageId: currentPage._id,
-        revisionId: currentPage.revision._id,
+        pageId: currentPage?._id,
+        revisionId: currentPage?.revision._id,
         newPagePath,
       });
 
-      onRenamed(currentPage.path, newPagePath);
+      onRenamed(currentPage?.path, newPagePath);
 
-      toastSuccess(t('renamed_pages', { path: currentPage.path }));
+      toastSuccess(t('renamed_pages', { path: currentPage?.path }));
     }
     catch (err) {
       onRenameFailure?.();
       toastError(err);
     }
-  }, [currentPage._id, currentPage.path, currentPage.revision._id, currentPagePath, mutateCurrentPage, onRenameFailure, onRenameFinish, t]);
+  }, [currentPage?._id, currentPage?.path, currentPage?.revision._id, currentPagePath, mutateCurrentPage, onRenameFailure, onRenameFinish, t]);
 
   return pagePathRenameHandler;
 };

apps/app/src/components/PageSelectModal/TreeItemForModal.tsx

@@ -1,9 +1,17 @@
-import React, { type FC } from 'react';
+import type { FC } from 'react';
+import { useCallback } from 'react';
 
+import nodePath from 'path';
+
+import { type IPageForItem } from '~/interfaces/page';
+import { useSWRxCurrentPage } from '~/stores/page';
+
+import { usePagePathRenameHandler } from '../PageHeader/page-header-utils';
 import {
   SimpleItem, useNewPageInput, type TreeItemProps,
 } from '../TreeItem';
 
+
 type PageTreeItemProps = TreeItemProps & {
   key?: React.Key | null,
 };
@@ -11,7 +19,24 @@ type PageTreeItemProps = TreeItemProps & {
 export const TreeItemForModal: FC<PageTreeItemProps> = (props) => {
 
   const { isOpen } = props;
+
+  const { data: currentPage } = useSWRxCurrentPage();
   const { Input: NewPageInput, CreateButton: NewPageCreateButton } = useNewPageInput();
+  const pagePathRenameHandler = usePagePathRenameHandler(currentPage);
+
+  const currentPageTitle = nodePath.basename(currentPage?.path ?? '') || '/';
+
+  const onClick = useCallback((page: IPageForItem) => {
+    const parentPagePath = page.path;
+
+    if (parentPagePath == null) {
+      return;
+    }
+
+    const newPagePath = nodePath.resolve(parentPagePath, currentPageTitle);
+
+    pagePathRenameHandler(newPagePath);
+  }, [currentPageTitle, pagePathRenameHandler]);
 
   return (
     <SimpleItem
@@ -27,6 +52,7 @@ export const TreeItemForModal: FC<PageTreeItemProps> = (props) => {
       customNextComponents={[NewPageInput]}
       itemClass={TreeItemForModal}
       customEndComponents={[NewPageCreateButton]}
+      onClick={onClick}
     />
   );
 };