refactor

apps/app/src/components/CreateTemplateModal.tsx

@@ -4,10 +4,9 @@ import { pathUtils } from '@growi/core/dist/utils';
 import { useTranslation } from 'next-i18next';
 import { Modal, ModalHeader, ModalBody } from 'reactstrap';
 
-import { useOnTemplateForChildrenButtonClicked, useOnTemplateForDescendantsButtonClicked } from './Navbar/hooks';
+import { TargetType, LabelType } from '~/interfaces/template';
 
-type TargetType = 'children' | 'descendants';
-type LabelType = '_template' | '__template';
+import { useOnTemplateButtonClicked } from './Navbar/hooks';
 
 type TemplateCardProps = {
   target: TargetType;
@@ -57,13 +56,7 @@ export const CreateTemplateModal: React.FC<CreateTemplateModalProps> = ({
 
   const [isPageCreating, setIsPageCreating] = useState(false);
 
-  const onClickTemplateForChildrenButton = useOnTemplateForChildrenButtonClicked(setIsPageCreating, path);
-  const onClickTemplateForDescendantsButton = useOnTemplateForDescendantsButtonClicked(setIsPageCreating, path);
-  const onClickHandler = (target: TargetType) => {
-    return target === 'children'
-      ? onClickTemplateForChildrenButton
-      : onClickTemplateForDescendantsButton;
-  };
+  const onClickTemplateButton = useOnTemplateButtonClicked(setIsPageCreating, path);
 
   const parentPath = pathUtils.addTrailingSlash(path);
 
@@ -73,7 +66,7 @@ export const CreateTemplateModal: React.FC<CreateTemplateModalProps> = ({
         target={target}
         label={label}
         isPageCreating={isPageCreating}
-        onClickHandler={onClickHandler(target)}
+        onClickHandler={() => onClickTemplateButton(label)}
       />
     </div>
   );

apps/app/src/components/Navbar/hooks.tsx

@@ -5,6 +5,7 @@ import { useRouter } from 'next/router';
 
 import { createPage, exist } from '~/client/services/page-operation';
 import { toastError } from '~/client/util/toastr';
+import { LabelType } from '~/interfaces/template';
 import { useIsNotFound } from '~/stores/page';
 import { EditorMode, useEditorMode } from '~/stores/ui';
 import loggerFactory from '~/utils/logger';
@@ -57,59 +58,19 @@ export const useOnPageEditorModeButtonClicked = (
   }, [isNotFound, mutateEditorMode, path, router, setIsCreating, t]);
 };
 
-export const useOnTemplateForChildrenButtonClicked = (
+export const useOnTemplateButtonClicked = (
     setIsCreating: React.Dispatch<React.SetStateAction<boolean>>,
     currentPagePath: string,
-): () => Promise<void> => {
+): (label: LabelType) => Promise<void> => {
   const router = useRouter();
 
-  return useCallback(async() => {
+  return useCallback(async(label: LabelType) => {
     try {
       setIsCreating(true);
 
       const path = currentPagePath == null || currentPagePath === '/'
-        ? '/_template'
-        : `${currentPagePath}/_template`;
-
-      const params = {
-        isSlackEnabled: false,
-        slackChannels: '',
-        grant: 4,
-      // grant: currentPage?.grant || 1,
-      // grantUserGroupId: currentPage?.grantedGroup?._id,
-      };
-
-      const res = await exist(JSON.stringify([path]));
-      if (!res.pages[path]) {
-        await createPage(path, '', params);
-      }
-
-      router.push(`${path}#edit`);
-    }
-    catch (err) {
-      logger.warn(err);
-      toastError(err);
-    }
-    finally {
-      setIsCreating(false);
-    }
-  }, [currentPagePath, router, setIsCreating]);
-};
-
-
-export const useOnTemplateForDescendantsButtonClicked = (
-    setIsCreating: React.Dispatch<React.SetStateAction<boolean>>,
-    currentPagePath: string,
-): () => Promise<void> => {
-  const router = useRouter();
-
-  return useCallback(async() => {
-    try {
-      setIsCreating(true);
-
-      const path = currentPagePath == null || currentPagePath === '/'
-        ? '/__template'
-        : `${currentPagePath}/__template`;
+        ? `/${label}`
+        : `${currentPagePath}/${label}`;
 
       const params = {
         isSlackEnabled: false,

apps/app/src/interfaces/template.ts

@@ -0,0 +1,2 @@
+export type TargetType = 'children' | 'descendants';
+export type LabelType = '_template' | '__template';