summaryrefslogtreecommitdiff
path: root/frontend/src/components/modals/TextInputModal.js
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/components/modals/TextInputModal.js')
-rw-r--r--frontend/src/components/modals/TextInputModal.js58
1 files changed, 58 insertions, 0 deletions
diff --git a/frontend/src/components/modals/TextInputModal.js b/frontend/src/components/modals/TextInputModal.js
new file mode 100644
index 00000000..cc16f8e1
--- /dev/null
+++ b/frontend/src/components/modals/TextInputModal.js
@@ -0,0 +1,58 @@
+import PropTypes from "prop-types";
+import React from "react";
+import Modal from "./Modal";
+
+class TextInputModal extends React.Component {
+ static propTypes = {
+ title: PropTypes.string.isRequired,
+ label: PropTypes.string.isRequired,
+ show: PropTypes.bool.isRequired,
+ callback: PropTypes.func.isRequired,
+ initialValue: PropTypes.string
+ };
+
+ componentDidUpdate() {
+ if (this.props.initialValue) {
+ this.textInput.value = this.props.initialValue;
+ }
+ }
+
+ onSubmit() {
+ this.props.callback(this.textInput.value);
+ this.textInput.value = "";
+ }
+
+ onCancel() {
+ this.props.callback(undefined);
+ this.textInput.value = "";
+ }
+
+ render() {
+ return (
+ <Modal
+ title={this.props.title}
+ show={this.props.show}
+ onSubmit={this.onSubmit.bind(this)}
+ onCancel={this.onCancel.bind(this)}
+ >
+ <form
+ onSubmit={e => {
+ e.preventDefault();
+ this.onSubmit();
+ }}
+ >
+ <div className="form-group">
+ <label className="form-control-label">{this.props.label}</label>
+ <input
+ type="text"
+ className="form-control"
+ ref={textInput => (this.textInput = textInput)}
+ />
+ </div>
+ </form>
+ </Modal>
+ );
+ }
+}
+
+export default TextInputModal;