FB by takeisan

src/client/js/components/ComparePathsTable.jsx

@@ -14,7 +14,7 @@ function ComparePathsTable(props) {
   const { path } = pageContainer.state;
 
   return (
-    <table className="table table-bordered compare-page-table">
+    <table className="table table-bordered grw-compare-page-table">
       <thead>
         <tr>
           <th className="w-50">{t('original_path')}</th>

src/client/js/components/PageRenameModal.jsx

@@ -32,7 +32,7 @@ const PageRenameModal = (props) => {
   const [isRenameRecursively, SetIsRenameRecursively] = useState(true);
   const [isRenameRedirect, SetIsRenameRedirect] = useState(false);
   const [isRenameMetadata, SetIsRenameMetadata] = useState(false);
-  const [getSubordinatedError] = useState(null);
+  const [subordinatedError] = useState(null);
   const [isDuplicateRecursivelyWithoutExistPath, setIsDuplicateRecursivelyWithoutExistPath] = useState(true);
 
 
@@ -52,7 +52,7 @@ const PageRenameModal = (props) => {
     SetIsRenameMetadata(!isRenameMetadata);
   }
 
-  const getSubordinatedList = useCallback(async() => {
+  const updateSubordinatedList = useCallback(async() => {
     try {
       const res = await appContainer.apiv3Get('/pages/subordinated-list', { path });
       const { subordinatedPaths } = res.data;
@@ -66,9 +66,9 @@ const PageRenameModal = (props) => {
 
   useEffect(() => {
     if (props.isOpen) {
-      getSubordinatedList();
+      updateSubordinatedList();
     }
-  }, [props.isOpen, getSubordinatedList]);
+  }, [props.isOpen, updateSubordinatedList]);
 
   /**
    * change pageNameInput
@@ -192,7 +192,7 @@ const PageRenameModal = (props) => {
             <p className="form-text text-muted mt-0">{ t('modal_rename.help.metadata') }</p>
           </label>
         </div>
-        <div> {getSubordinatedError} </div>
+        <div> {subordinatedError} </div>
       </ModalBody>
       <ModalFooter>
         <ApiErrorMessageList errs={errs} targetPath={pageNameInput} />

src/client/styles/scss/_create-page.scss

@@ -13,11 +13,9 @@
     font-family: $font-family-monospace-not-strictly;
   }
 
-  .compare-page-table {
-    width: 100%;
-
+  .grw-compare-page-table {
     tbody {
-      width: 100%;
+      display: block;
       max-height: 200px;
       overflow-y: auto;
     }
@@ -27,13 +25,6 @@
       width: 50%;
     }
 
-    tbody,
-    tr,
-    td,
-    th {
-      display: block;
-    }
-
     tr {
       display: flex;
     }