display parent page path

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

@@ -29,6 +29,7 @@ export const PagePathHeader: FC<Props> = (props) => {
 
   const currentPagePath = currentPage.path;
   const parentPagePath = pathUtils.addTrailingSlash(nodePath.dirname(currentPagePath));
+  const pageTitle = nodePath.basename(currentPagePath) || '/';
 
   const [isRenameInputShown, setRenameInputShown] = useState(false);
   const [isButtonsShown, setButtonShown] = useState(false);
@@ -50,8 +51,9 @@ export const PagePathHeader: FC<Props> = (props) => {
   }, []);
 
   const onInputChange = useCallback((inputText: string) => {
-    setEditedPagePath(inputText);
-  }, []);
+    const newPagePath = nodePath.resolve(inputText, pageTitle);
+    setEditedPagePath(newPagePath);
+  }, [pageTitle]);
 
   const onPressEnter = useCallback(() => {
     pagePathRenameHandler(editedPagePath, onRenameFinish, onRenameFailure);
@@ -117,7 +119,7 @@ export const PagePathHeader: FC<Props> = (props) => {
           {isRenameInputShown ? (
             <div className="flex-fill">
               <ClosableTextInput
-                value={editedPagePath}
+                value={parentPagePath}
                 placeholder={t('Input page name')}
                 onPressEnter={onPressEnter}
                 onPressEscape={onPressEscape}

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

@@ -28,8 +28,6 @@ export const PageTitleHeader: FC<Props> = (props) => {
 
   const { t } = useTranslation();
 
-  const editedPageTitle = nodePath.basename(editedPagePath);
-
   const onRenameFinish = useCallback(() => {
     setRenameInputShown(false);
   }, []);
@@ -73,7 +71,7 @@ export const PageTitleHeader: FC<Props> = (props) => {
         {isRenameInputShown ? (
           <div className="flex-fill">
             <ClosableTextInput
-              value={editedPageTitle}
+              value={pageTitle}
               placeholder={t('Input page name')}
               onPressEnter={onPressEnter}
               onPressEscape={onPressEscape}