kosei-n пре 2 година
родитељ
комит
34a753df89

+ 15 - 10
apps/app/src/components/PageHeader/PageHeader.tsx

@@ -1,33 +1,38 @@
-import { type FC, useState } from 'react';
+import { useState } from 'react';
+import type { Dispatch, SetStateAction, FC } from 'react';
 
-import { useCurrentPagePath, useSWRxCurrentPage } from '~/stores/page';
+import { useSWRxCurrentPage } from '~/stores/page';
 
 import { PagePathHeader } from './PagePathHeader';
 import { PageTitleHeader } from './PageTitleHeader';
 
+export type editedPagePathHandler = {
+  editedPagePath: string
+  setEditedPagePath: Dispatch<SetStateAction<string>>
+}
+
 export const PageHeader: FC = () => {
-  const { data: currentPagePath } = useCurrentPagePath();
   const { data: currentPage } = useSWRxCurrentPage();
+  const currentPagePath = currentPage?.path;
+
 
-  const [editingPagePath, setEditingPagePath] = useState(currentPagePath ?? '');
+  const [editedPagePath, setEditedPagePath] = useState(currentPagePath ?? '');
 
-  const editingPagePathHandler = { editingPagePath, setEditingPagePath };
+  const editedPagePathStateHandler = { editedPagePath, setEditedPagePath };
 
-  if (currentPage == null || currentPagePath == null) {
+  if (currentPage == null) {
     return <></>;
   }
 
   return (
     <>
       <PagePathHeader
-        currentPagePath={currentPagePath}
         currentPage={currentPage}
-        editingPagePathHandler={editingPagePathHandler}
+        editedPagePathHandler={editedPagePathStateHandler}
       />
       <PageTitleHeader
-        currentPagePath={currentPagePath}
         currentPage={currentPage}
-        editingPagePathHandler={editingPagePathHandler}
+        editedPagePathHandler={editedPagePathStateHandler}
       />
     </>
   );

+ 11 - 9
apps/app/src/components/PageHeader/PagePathHeader.tsx

@@ -9,17 +9,19 @@ import { EditorMode, useEditorMode } from '~/stores/ui';
 import { PagePathNav } from '../Common/PagePathNav';
 import { PageSelectModal } from '../PageSelectModal/PageSelectModal';
 
-import { TextInputForPageTitleAndPath, type editingPagePathHandler } from './TextInputForPageTitleAndPath';
+import type { editedPagePathHandler } from './PageHeader';
+import { TextInputForPageTitleAndPath } from './TextInputForPageTitleAndPath';
 import { usePagePathRenameHandler } from './page-header-utils';
 
 export type Props = {
-  currentPagePath: string
   currentPage: IPagePopulatedToShowRevision
-  editingPagePathHandler: editingPagePathHandler
+  editedPagePathHandler: editedPagePathHandler
 }
 
 export const PagePathHeader: FC<Props> = (props) => {
-  const { currentPagePath, currentPage, editingPagePathHandler } = props;
+  const { currentPage, editedPagePathHandler } = props;
+
+  const currentPagePath = currentPage.path;
 
   const [isRenameInputShown, setRenameInputShown] = useState(false);
   const [isButtonsShown, setButtonShown] = useState(false);
@@ -27,7 +29,7 @@ export const PagePathHeader: FC<Props> = (props) => {
   const { data: editorMode } = useEditorMode();
   const { data: PageSelectModalData, open: openPageSelectModal } = usePageSelectModal();
 
-  const { editingPagePath, setEditingPagePath } = editingPagePathHandler;
+  const { editedPagePath, setEditedPagePath } = editedPagePathHandler;
 
   const onRenameFinish = () => {
     setRenameInputShown(false);
@@ -59,12 +61,12 @@ export const PagePathHeader: FC<Props> = (props) => {
   ), [currentPage._id, currentPagePath, isEditorMode]);
 
   const handleInputChange = (inputText: string) => {
-    setEditingPagePath(inputText);
+    setEditedPagePath(inputText);
   };
 
   const handleEditButtonClick = () => {
     if (isRenameInputShown) {
-      pagePathRenameHandler(editingPagePath);
+      pagePathRenameHandler(editedPagePath);
     }
     else {
       setRenameInputShown(true);
@@ -102,8 +104,8 @@ export const PagePathHeader: FC<Props> = (props) => {
           <TextInputForPageTitleAndPath
             currentPage={currentPage}
             stateHandler={stateHandler}
-            editingPagePathHandler={editingPagePathHandler}
-            inputValue={editingPagePath}
+            editedPagePathHandler={editedPagePathHandler}
+            inputValue={editedPagePath}
             CustomComponent={PagePath}
             handleInputChange={handleInputChange}
           />

+ 9 - 6
apps/app/src/components/PageHeader/PageTitleHeader.tsx

@@ -13,14 +13,17 @@ import { usePagePathRenameHandler } from './page-header-utils';
 
 
 export const PageTitleHeader: FC<Props> = (props) => {
-  const { currentPagePath, currentPage, editingPagePathHandler } = props;
+  const { currentPage, editedPagePathHandler } = props;
+
+  const currentPagePath = currentPage.path;
+
   const pageTitle = nodePath.basename(currentPagePath ?? '') || '/';
 
   const [isRenameInputShown, setRenameInputShown] = useState(false);
 
-  const { editingPagePath, setEditingPagePath } = editingPagePathHandler;
+  const { editedPagePath, setEditedPagePath } = editedPagePathHandler;
 
-  const editingPageTitle = nodePath.basename(editingPagePath);
+  const editingPageTitle = nodePath.basename(editedPagePath);
 
   const onRenameFinish = () => {
     setRenameInputShown(false);
@@ -40,13 +43,13 @@ export const PageTitleHeader: FC<Props> = (props) => {
     const parentPath = pathUtils.addTrailingSlash(nodePath.dirname(currentPage.path ?? ''));
     const newPagePath = nodePath.resolve(parentPath, inputText);
 
-    setEditingPagePath(newPagePath);
+    setEditedPagePath(newPagePath);
   };
 
   const buttonStyle = isRenameInputShown ? '' : 'd-none';
 
   const handleButtonClick = () => {
-    pagePathRenameHandler(editingPagePath);
+    pagePathRenameHandler(editedPagePath);
   };
 
   return (
@@ -55,7 +58,7 @@ export const PageTitleHeader: FC<Props> = (props) => {
         <TextInputForPageTitleAndPath
           currentPage={currentPage}
           stateHandler={stateHandler}
-          editingPagePathHandler={editingPagePathHandler}
+          editedPagePathHandler={editedPagePathHandler}
           inputValue={editingPageTitle}
           CustomComponent={PageTitle}
           handleInputChange={handleInputChange}

+ 7 - 11
apps/app/src/components/PageHeader/TextInputForPageTitleAndPath.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect } from 'react';
+import { useCallback } from 'react';
 import type { Dispatch, SetStateAction, FC } from 'react';
 
 import nodePath from 'path';
@@ -12,14 +12,10 @@ import { ValidationTarget } from '~/client/util/input-validator';
 import ClosableTextInput from '../Common/ClosableTextInput';
 
 
+import type { editedPagePathHandler } from './PageHeader';
 import { usePagePathRenameHandler } from './page-header-utils';
 
 
-export type editingPagePathHandler = {
-  editingPagePath: string
-  setEditingPagePath: Dispatch<SetStateAction<string>>
-}
-
 type StateHandler = {
   isRenameInputShown: boolean
   setRenameInputShown: Dispatch<SetStateAction<boolean>>
@@ -28,7 +24,7 @@ type StateHandler = {
 type Props = {
   currentPage: IPagePopulatedToShowRevision
   stateHandler: StateHandler
-  editingPagePathHandler: editingPagePathHandler
+  editedPagePathHandler: editedPagePathHandler
   inputValue: string
   CustomComponent: JSX.Element
   handleInputChange?: (string) => void
@@ -36,13 +32,13 @@ type Props = {
 
 export const TextInputForPageTitleAndPath: FC<Props> = (props) => {
   const {
-    currentPage, stateHandler, inputValue, CustomComponent, handleInputChange, editingPagePathHandler,
+    currentPage, stateHandler, inputValue, CustomComponent, handleInputChange, editedPagePathHandler,
   } = props;
 
   const { t } = useTranslation();
 
   const { isRenameInputShown, setRenameInputShown } = stateHandler;
-  const { setEditingPagePath } = editingPagePathHandler;
+  const { setEditedPagePath } = editedPagePathHandler;
 
   const onRenameFinish = () => {
     setRenameInputShown(false);
@@ -64,9 +60,9 @@ export const TextInputForPageTitleAndPath: FC<Props> = (props) => {
   }, [currentPage.path, pagePathRenameHandler]);
 
   const onPressEscape = useCallback(() => {
-    setEditingPagePath(currentPage.path);
+    setEditedPagePath(currentPage.path);
     setRenameInputShown(false);
-  }, [currentPage.path, setEditingPagePath, setRenameInputShown]);
+  }, [currentPage.path, setEditedPagePath, setRenameInputShown]);
 
   return (
     <>