1 files changed, 53 insertions, 0 deletions
diff --git a/opendc-web/opendc-web-ui/src/components/modals/Modal.js b/opendc-web/opendc-web-ui/src/components/modals/Modal.js
new file mode 100644
index 00000000..21b7f119
--- /dev/null
+++ b/opendc-web/opendc-web-ui/src/components/modals/Modal.js
@@ -0,0 +1,53 @@
+import React, { useState, useEffect } from 'react'
+import PropTypes from 'prop-types'
+import { Modal as RModal, ModalHeader, ModalBody, ModalFooter, Button } from 'reactstrap'
+
+function Modal({ children, title, show, onSubmit, onCancel, submitButtonType, submitButtonText }) {
+    const [modal, setModal] = useState(show)
+
+    useEffect(() => setModal(show), [show])
+
+    const toggle = () => setModal(!modal)
+    const cancel = () => {
+        if (onCancel() !== false) {
+            toggle()
+        }
+    }
+    const submit = () => {
+        if (onSubmit() !== false) {
+            toggle()
+        }
+    }
+
+    return (
+        <RModal isOpen={modal} toggle={cancel}>
+            <ModalHeader toggle={cancel}>{title}</ModalHeader>
+            <ModalBody>{children}</ModalBody>
+            <ModalFooter>
+                <Button color="secondary" onClick={cancel}>
+                    Close
+                </Button>
+                <Button color={submitButtonType} onClick={submit}>
+                    {submitButtonText}
+                </Button>
+            </ModalFooter>
+        </RModal>
+    )
+}
+
+Modal.propTypes = {
+    title: PropTypes.string.isRequired,
+    show: PropTypes.bool.isRequired,
+    onSubmit: PropTypes.func.isRequired,
+    onCancel: PropTypes.func.isRequired,
+    submitButtonType: PropTypes.string,
+    submitButtonText: PropTypes.string,
+}
+
+Modal.defaultProps = {
+    submitButtonType: 'primary',
+    submitButtonText: 'Save',
+    show: false,
+}
+
+export default Modal