Convert withModal to useModal

client/js/components/modals/Confirm.js

@@ -1,27 +1,26 @@
-import React, { useCallback } from 'react';
-import withModal from 'components/modals/withModal';
+import React from 'react';
+import Modal from 'react-modal';
+import useModal from 'components/modals/useModal';
 import Button from 'components/ui/Button';
 
-const Confirm = ({
-  payload: { question, confirmation, onConfirm },
-  onClose
-}) => {
-  const handleConfirm = useCallback(() => {
-    onClose(false);
+const Confirm = () => {
+  const [modal, payload, closeModal] = useModal('confirm');
+  const { question, confirmation, onConfirm } = payload;
+
+  const handleConfirm = () => {
+    closeModal(false);
     onConfirm();
-  }, []);
+  };
 
   return (
-    <>
+    <Modal {...modal}>
       <p>{question}</p>
       <Button onClick={handleConfirm}>{confirmation || 'OK'}</Button>
-      <Button category="normal" onClick={onClose}>
+      <Button category="normal" onClick={closeModal}>
         Cancel
       </Button>
-    </>
+    </Modal>
   );
 };
 
-export default withModal({
-  name: 'confirm'
-})(Confirm);
+export default Confirm;