+ client: Refactor DHCP settings

client/src/components/Settings/Dhcp/StaticLeases/Modal.js

@@ -2,36 +2,37 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Trans, withTranslation } from 'react-i18next';
 import ReactModal from 'react-modal';
-
+import { useDispatch } from 'react-redux';
 import Form from './Form';
+import { toggleLeaseModal } from '../../../../actions';
 
-const Modal = (props) => {
-    const {
-        isModalOpen,
-        handleSubmit,
-        toggleLeaseModal,
-        processingAdding,
-    } = props;
+const Modal = ({
+    isModalOpen,
+    handleSubmit,
+    processingAdding,
+}) => {
+    const dispatch = useDispatch();
+
+    const toggleModal = () => dispatch(toggleLeaseModal());
 
     return (
         <ReactModal
             className="Modal__Bootstrap modal-dialog modal-dialog-centered modal-dialog--clients"
             closeTimeoutMS={0}
             isOpen={isModalOpen}
-            onRequestClose={() => toggleLeaseModal()}
+            onRequestClose={toggleModal}
         >
             <div className="modal-content">
                 <div className="modal-header">
                     <h4 className="modal-title">
                         <Trans>dhcp_new_static_lease</Trans>
                     </h4>
-                    <button type="button" className="close" onClick={() => toggleLeaseModal()}>
+                    <button type="button" className="close" onClick={toggleModal}>
                         <span className="sr-only">Close</span>
                     </button>
                 </div>
                 <Form
                     onSubmit={handleSubmit}
-                    toggleLeaseModal={toggleLeaseModal}
                     processingAdding={processingAdding}
                 />
             </div>
@@ -42,7 +43,6 @@ const Modal = (props) => {
 Modal.propTypes = {
     isModalOpen: PropTypes.bool.isRequired,
     handleSubmit: PropTypes.func.isRequired,
-    toggleLeaseModal: PropTypes.func.isRequired,
     processingAdding: PropTypes.bool.isRequired,
 };