clean codes

apps/app/src/components/PageHeader/PagePathHeader.tsx

@@ -33,6 +33,8 @@ export const PagePathHeader: FC<Props> = (props) => {
   const { data: editorMode } = useEditorMode();
   const { data: PageSelectModalData, open: openPageSelectModal } = usePageSelectModal();
 
+  const pagePathRenameHandler = usePagePathRenameHandler(currentPage);
+
   const { t } = useTranslation();
 
   const onRenameFinish = () => {
@@ -47,15 +49,26 @@ export const PagePathHeader: FC<Props> = (props) => {
     setEditedPagePath(inputText);
   };
 
+  const onPressEnter = () => {
+    pagePathRenameHandler(editedPagePath, onRenameFinish, onRenameFailure);
+  };
+
   const onPressEscape = () => {
     setEditedPagePath(currentPagePath);
     setRenameInputShown(false);
   };
 
-  const pagePathRenameHandler = usePagePathRenameHandler(currentPage);
+  const onClickEditButton = useCallback(() => {
+    if (isRenameInputShown) {
+      pagePathRenameHandler(editedPagePath, onRenameFinish, onRenameFailure);
+    }
+    else {
+      setEditedPagePath(currentPagePath);
+      setRenameInputShown(true);
+    }
+  }, [currentPagePath, editedPagePath, isRenameInputShown, pagePathRenameHandler]);
 
   const isOpened = PageSelectModalData?.isOpened ?? false;
-
   const isViewMode = editorMode === EditorMode.View;
   const isEditorMode = !isViewMode;
 
@@ -67,15 +80,6 @@ export const PagePathHeader: FC<Props> = (props) => {
     />
   ), [currentPage._id, currentPagePath, isEditorMode]);
 
-  const onClickEditButton = useCallback(() => {
-    if (isRenameInputShown) {
-      pagePathRenameHandler(editedPagePath, onRenameFinish, onRenameFailure);
-    }
-    else {
-      setEditedPagePath(currentPagePath);
-      setRenameInputShown(true);
-    }
-  }, [currentPagePath, editedPagePath, isRenameInputShown, pagePathRenameHandler]);
 
   const buttonStyle = isButtonsShown ? '' : 'd-none';
 
@@ -95,9 +99,6 @@ export const PagePathHeader: FC<Props> = (props) => {
     };
   }, []);
 
-  const onPressEnter = () => {
-    pagePathRenameHandler(editedPagePath, onRenameFinish, onRenameFailure);
-  };
 
   return (
     <div

apps/app/src/components/PageHeader/PageTitleHeader.tsx

@@ -24,6 +24,8 @@ export const PageTitleHeader: FC<Props> = (props) => {
   const [isRenameInputShown, setRenameInputShown] = useState(false);
   const [editedPagePath, setEditedPagePath] = useState(currentPagePath);
 
+  const pagePathRenameHandler = usePagePathRenameHandler(currentPage);
+
   const { t } = useTranslation();
 
   const editedPageTitle = nodePath.basename(editedPagePath);
@@ -37,36 +39,34 @@ export const PageTitleHeader: FC<Props> = (props) => {
   };
 
   const onInputChange = useCallback((inputText: string) => {
-    const parentPagePath = pathUtils.addTrailingSlash(nodePath.dirname(currentPage?.path ?? ''));
+    const parentPagePath = pathUtils.addTrailingSlash(nodePath.dirname(currentPage.path));
     const newPagePath = nodePath.resolve(parentPagePath, inputText);
 
     setEditedPagePath(newPagePath);
   }, [currentPage?.path, setEditedPagePath]);
 
+  const onPressEnter = () => {
+    pagePathRenameHandler(editedPagePath, onRenameFinish, onRenameFailure);
+  };
+
   const onPressEscape = () => {
     setEditedPagePath(currentPagePath);
     setRenameInputShown(false);
   };
 
+  const onClickButton = () => {
+    pagePathRenameHandler(editedPagePath, onRenameFinish, onRenameFailure);
+  };
+
   const onClickPageTitle = () => {
     setEditedPagePath(currentPagePath);
     setRenameInputShown(true);
   };
 
-  const pagePathRenameHandler = usePagePathRenameHandler(currentPage);
-
   const PageTitle = <div onClick={onClickPageTitle}>{pageTitle}</div>;
 
   const buttonStyle = isRenameInputShown ? '' : 'd-none';
 
-  const onClickButton = () => {
-    pagePathRenameHandler(editedPagePath, onRenameFinish, onRenameFailure);
-  };
-
-  const onPressEnter = () => {
-    pagePathRenameHandler(editedPagePath, onRenameFinish, onRenameFailure);
-  };
-
   return (
     <div className="row">
       <div className="col-4">