improve pagePathRenameHandler

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

@@ -1,87 +0,0 @@
-import { useCallback } from 'react';
-import type { Dispatch, SetStateAction, FC } from 'react';
-
-import nodePath from 'path';
-
-import type { IPagePopulatedToShowRevision } from '@growi/core';
-import { pathUtils } from '@growi/core/dist/utils';
-import { useTranslation } from 'next-i18next';
-
-import { ValidationTarget } from '~/client/util/input-validator';
-
-import ClosableTextInput from '../Common/ClosableTextInput';
-
-import { usePagePathRenameHandler } from './page-header-utils';
-
-export type editedPagePathState = {
-  editedPagePath: string
-  setEditedPagePath: Dispatch<SetStateAction<string>>
-}
-
-type StateHandler = {
-  isRenameInputShown: boolean
-  setRenameInputShown: Dispatch<SetStateAction<boolean>>
-}
-
-type Props = {
-  currentPage: IPagePopulatedToShowRevision
-  stateHandler: StateHandler
-  inputValue: string
-  CustomComponent: JSX.Element
-  onInputChange?: (string) => void
-  onPressEscape?: () => void
-}
-
-export const TextInputForPageTitleAndPath: FC<Props> = (props) => {
-  const {
-    currentPage, stateHandler, inputValue, CustomComponent, onInputChange,
-  } = props;
-
-  const { t } = useTranslation();
-
-  const { isRenameInputShown, setRenameInputShown } = stateHandler;
-
-
-  const pagePathRenameHandler = usePagePathRenameHandler(currentPage);
-
-  const onPressEnter = useCallback((inputPagePath: string) => {
-
-    const onRenameFinish = () => {
-      setRenameInputShown(false);
-    };
-
-    const onRenameFailure = () => {
-      setRenameInputShown(true);
-    };
-
-    const parentPath = pathUtils.addTrailingSlash(nodePath.dirname(currentPage.path ?? ''));
-    const newPagePath = nodePath.resolve(parentPath, inputPagePath);
-
-    pagePathRenameHandler(newPagePath, onRenameFinish, onRenameFailure);
-
-  }, [currentPage.path, pagePathRenameHandler, setRenameInputShown]);
-
-  // const onPressEscape = useCallback(() => {
-  //   setEditedPagePath(currentPage.path);
-  //   setRenameInputShown(false);
-  // }, [currentPage.path, setEditedPagePath, setRenameInputShown]);
-
-  return (
-    <>
-      {isRenameInputShown ? (
-        <div className="flex-fill">
-          <ClosableTextInput
-            value={inputValue}
-            placeholder={t('Input page name')}
-            onPressEnter={onPressEnter}
-            onPressEscape={props.onPressEscape}
-            validationTarget={ValidationTarget.PAGE}
-            handleInputChange={onInputChange}
-          />
-        </div>
-      ) : (
-        <>{ CustomComponent }</>
-      )}
-    </>
-  );
-};

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

@@ -8,10 +8,10 @@ import { toastSuccess, toastError } from '~/client/util/toastr';
 import { useSWRMUTxCurrentPage } from '~/stores/page';
 import { mutatePageTree, mutatePageList } from '~/stores/page-listing';
 
-type PagePathRenameHandler = (newPagePath: string, onRenameFinish?: () => void, onRenameFailure?: () => void) => Promise<void>;
+type PagePathRenameHandler = (newPagePath: string, onRenameFinish?: () => void, onRenameFailure?: () => void) => Promise<void>
 
 export const usePagePathRenameHandler = (
-    currentPage?: IPagePopulatedToShowRevision | null,
+    currentPage: IPagePopulatedToShowRevision,
 ): PagePathRenameHandler => {
 
   const { trigger: mutateCurrentPage } = useSWRMUTxCurrentPage();
@@ -19,9 +19,7 @@ export const usePagePathRenameHandler = (
 
   const currentPagePath = currentPage?.path;
 
-  const pagePathRenameHandler = useCallback(async(
-      newPagePath: string, onRenameFinish?: () => void, onRenameFailure?: () => void,
-  ) => {
+  const pagePathRenameHandler = useCallback(async(newPagePath, onRenameFinish, onRenameFailure) => {
 
     const onRenamed = (fromPath: string | undefined, toPath: string) => {
       mutatePageTree();
@@ -44,7 +42,8 @@ export const usePagePathRenameHandler = (
         newPagePath,
       });
 
-      onRenamed(currentPage?.path, newPagePath);
+      onRenamed(currentPage.path, newPagePath);
+      onRenameFinish?.();
 
       onRenameFinish?.();
 
@@ -54,7 +53,7 @@ export const usePagePathRenameHandler = (
       onRenameFailure?.();
       toastError(err);
     }
-  }, [currentPage?._id, currentPage?.path, currentPage?.revision._id, currentPagePath, mutateCurrentPage, t]);
+  }, [currentPage._id, currentPage.path, currentPage.revision._id, currentPagePath, mutateCurrentPage, t]);
 
   return pagePathRenameHandler;
 };