refactor empty trash modal

packages/app/src/components/EmptyTrashModal.tsx

@@ -1,5 +1,5 @@
 import React, {
-  useState, FC, useMemo, useCallback,
+  useState, FC,
 } from 'react';
 
 import { useTranslation } from 'react-i18next';
@@ -7,38 +7,16 @@ import {
   Modal, ModalHeader, ModalBody, ModalFooter,
 } from 'reactstrap';
 
-import { apiPost } from '~/client/util/apiv1-client';
-import { apiv3Delete, apiv3Post } from '~/client/util/apiv3-client';
+import { apiv3Delete } from '~/client/util/apiv3-client';
 import { HasObjectId } from '~/interfaces/has-object-id';
 import {
-  IDeleteSinglePageApiv1Result, IDeleteManyPageApiv3Result, IPageToDeleteWithMeta, IDataWithMeta, isIPageInfoForEntity, IPageInfoForEntity,
+  IPageToDeleteWithMeta, IDataWithMeta, isIPageInfoForEntity, IPageInfoForEntity,
 } from '~/interfaces/page';
-import { usePageDeleteModal } from '~/stores/modal';
+import { useEmptyTrashModal } from '~/stores/modal';
 import { useSWRxPageInfoForList } from '~/stores/page';
-import loggerFactory from '~/utils/logger';
-
 
 import ApiErrorMessageList from './PageManagement/ApiErrorMessageList';
 
-import { isTrashPage } from '^/../core/src/utils/page-path-utils';
-
-
-const logger = loggerFactory('growi:cli:PageDeleteModal');
-
-
-const deleteIconAndKey = {
-  completely: {
-    color: 'danger',
-    icon: 'fire',
-    translationKey: 'completely',
-  },
-  temporary: {
-    color: 'primary',
-    icon: 'trash',
-    translationKey: 'page',
-  },
-};
-
 const EmptyTrashModal: FC = () => {
   const { t } = useTranslation();
 
@@ -46,7 +24,7 @@ const EmptyTrashModal: FC = () => {
 
   const isOpened = emptyTrashModalData?.isOpened ?? false;
 
-  const notOperatablePages: IPageToDeleteWithMeta[] = (deleteModalData?.pages ?? [])
+  const notOperatablePages: IPageToDeleteWithMeta[] = (emptyTrashModalData?.pages ?? [])
     .filter(p => !isIPageInfoForEntity(p.meta));
   const notOperatablePageIds = notOperatablePages.map(p => p.data._id);
 
@@ -68,8 +46,9 @@ const EmptyTrashModal: FC = () => {
 
     try {
       await apiv3Delete('/pages/empty-trash');
-      if (onDeleted != null) {
-        onDeleted('', null, null);
+      const onEmptiedTrash = emptyTrashModalData.opts?.onEmptiedTrash;
+      if (onEmptiedTrash != null) {
+        onEmptiedTrash();
       }
       closeEmptyTrashModal();
     }
@@ -83,7 +62,7 @@ const EmptyTrashModal: FC = () => {
   }
 
   const renderPagePaths = () => {
-    const pages = injectedPages != null && injectedPages.length > 0 ? injectedPages : deleteModalData?.pages;
+    const pages = injectedPages != null && injectedPages.length > 0 ? injectedPages : emptyTrashModalData?.pages;
 
     if (pages != null) {
       return pages.map(page => (
@@ -98,8 +77,8 @@ const EmptyTrashModal: FC = () => {
 
   return (
     <Modal size="lg" isOpen={isOpened} toggle={closeEmptyTrashModal} data-testid="page-delete-modal" className="grw-create-page">
-      <ModalHeader tag="h4" toggle={closeEmptyTrashModal} className={`bg-${deleteIconAndKey[deleteMode].color} text-light`}>
-        <i className={`icon-fw icon-${deleteIconAndKey[deleteMode].icon}`}></i>
+      <ModalHeader tag="h4" toggle={closeEmptyTrashModal} className="bg-danger text-light">
+        <i className="icon-fw icon-fire"></i>
         {t('ゴミ箱を空にする文言')}
       </ModalHeader>
       <ModalBody>
@@ -114,10 +93,10 @@ const EmptyTrashModal: FC = () => {
         <ApiErrorMessageList errs={errs} />
         <button
           type="button"
-          className={`btn btn-${deleteIconAndKey[deleteMode].color}`}
+          className="btn btn-danger"
           onClick={emptyTrashButtonHandler}
         >
-          <i className={`mr-1 icon-${deleteIconAndKey[deleteMode].icon}`} aria-hidden="true"></i>
+          <i className="mr-1 icon-fire" aria-hidden="true"></i>
           {t('ゴミ箱を空にする文言')}
         </button>
       </ModalFooter>
@@ -127,77 +106,3 @@ const EmptyTrashModal: FC = () => {
 };
 
 export default EmptyTrashModal;
-
-
-// import React, { useState } from 'react';
-// import PropTypes from 'prop-types';
-
-// import {
-//   Modal, ModalHeader, ModalBody, ModalFooter,
-// } from 'reactstrap';
-
-// import { withTranslation } from 'react-i18next';
-// import { withUnstatedContainers } from './UnstatedUtils';
-
-// import SocketIoContainer from '~/client/services/SocketIoContainer';
-// import AppContainer from '~/client/services/AppContainer';
-// import ApiErrorMessageList from './PageManagement/ApiErrorMessageList';
-
-
-// const EmptyTrashModal = (props) => {
-//   const {
-//     t, isOpen, onClose, appContainer, socketIoContainer,
-//   } = props;
-
-//   const [errs, setErrs] = useState(null);
-
-//   async function emptyTrash() {
-//     setErrs(null);
-
-//     try {
-//       await appContainer.apiv3Delete('/pages/empty-trash');
-//       window.location.reload();
-//     }
-//     catch (err) {
-//       setErrs(err);
-//     }
-//   }
-
-//   function emptyButtonHandler() {
-//     emptyTrash();
-//   }
-
-//   return (
-//     <Modal isOpen={isOpen} toggle={onClose} className="grw-create-page">
-//       <ModalHeader tag="h4" toggle={onClose} className="bg-danger text-light">
-//         { t('modal_empty.empty_the_trash')}
-//       </ModalHeader>
-//       <ModalBody>
-//         { t('modal_empty.notice')}
-//       </ModalBody>
-//       <ModalFooter>
-//         <ApiErrorMessageList errs={errs} />
-//         <button type="button" className="btn btn-danger" onClick={emptyButtonHandler}>
-//           <i className="icon-trash mr-2" aria-hidden="true"></i> Empty
-//         </button>
-//       </ModalFooter>
-//     </Modal>
-//   );
-// };
-
-// /**
-//  * Wrapper component for using unstated
-//  */
-// const EmptyTrashModalWrapper = withUnstatedContainers(EmptyTrashModal, [AppContainer, SocketIoContainer]);
-
-
-// EmptyTrashModal.propTypes = {
-//   t: PropTypes.func.isRequired, //  i18next
-//   appContainer: PropTypes.instanceOf(AppContainer).isRequired,
-//   socketIoContainer: PropTypes.instanceOf(SocketIoContainer),
-
-//   isOpen: PropTypes.bool.isRequired,
-//   onClose: PropTypes.func.isRequired,
-// };
-
-// export default withTranslation()(EmptyTrashModalWrapper);