clean codes

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

@@ -18,7 +18,7 @@ export const PageHeader: FC = () => {
   }
 
   return (
-    <div id="page-header">
+    <>
       <PagePathHeader
         currentPagePath={currentPagePath}
         currentPage={currentPage}
@@ -29,6 +29,6 @@ export const PageHeader: FC = () => {
         currentPage={currentPage}
         editingPagePathHandler={editingPagePathHandler}
       />
-    </div>
+    </>
   );
 };

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

@@ -1,10 +1,7 @@
-import type { FC, Dispatch, SetStateAction } from 'react';
-import { useEffect, useMemo, useState } from 'react';
-
-import nodePath from 'path';
+import type { FC } from 'react';
+import { useMemo, useState } from 'react';
 
 import type { IPagePopulatedToShowRevision } from '@growi/core';
-import { pathUtils } from '@growi/core/dist/utils';
 
 import { usePageSelectModal } from '~/stores/modal';
 import { EditorMode, useEditorMode } from '~/stores/ui';
@@ -76,26 +73,8 @@ export const PagePathHeader: FC<Props> = (props) => {
 
   const buttonStyle = isButtonsShown ? '' : 'd-none';
 
-  // const clickOutSideHandler = (e) => {
-  //   const container = document.getElementById('page-path-header');
-
-  //   if (container && !container.contains(e.target)) {
-  //     pagePathRenameHandler(editingPagePath);
-  //     console.log('click outside');
-  //   }
-  // };
-
-  // useEffect(() => {
-  //   document.addEventListener('click', clickOutSideHandler);
-
-  //   return () => {
-  //     document.removeEventListener('click', clickOutSideHandler);
-  //   };
-  // }, []);
-
   return (
     <div
-      id="page-path-header"
       onMouseLeave={() => setButtonShown(false)}
     >
       <div className="row">

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

@@ -1,11 +1,10 @@
 import type { FC } from 'react';
 import {
-  useState, useMemo, useEffect, useRef,
+  useState, useMemo,
 } from 'react';
 
 import nodePath from 'path';
 
-import type { IPagePopulatedToShowRevision } from '@growi/core';
 import { pathUtils } from '@growi/core/dist/utils';
 
 import type { Props } from './PagePathHeader';
@@ -19,8 +18,6 @@ export const PageTitleHeader: FC<Props> = (props) => {
 
   const [isRenameInputShown, setRenameInputShown] = useState(false);
 
-  const ref = useRef<HTMLDivElement>(null);
-
   const { editingPagePath, setEditingPagePath } = editingPagePathHandler;
 
   const editingPageTitle = nodePath.basename(editingPagePath);
@@ -46,10 +43,6 @@ export const PageTitleHeader: FC<Props> = (props) => {
     setEditingPagePath(newPagePath);
   };
 
-  const onBlurHandler = () => {
-    pagePathRenameHandler(editingPagePath);
-  };
-
   const buttonStyle = isRenameInputShown ? '' : 'd-none';
 
   const handleButtonClick = () => {
@@ -57,12 +50,7 @@ export const PageTitleHeader: FC<Props> = (props) => {
   };
 
   return (
-    <div
-      id="page-title-header"
-      className="row"
-      // onBlur={onBlurHandler}
-      ref={ref}
-    >
+    <div className="row">
       <div className="col-4">
         <TextInputForPageTitleAndPath
           currentPage={currentPage}