summaryrefslogtreecommitdiff
path: root/opendc-web/opendc-web-ui/src/components/modals/TextInputModal.js
blob: 6758fdc054b1f9c08fa108c793cbb0f43bb7fc9a (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
import PropTypes from 'prop-types'
import React, { useRef } from 'react'
import Modal from './Modal'

function TextInputModal({ title, label, show, callback, initialValue }) {
    const textInput = useRef(null)
    const onSubmit = () => {
        callback(textInput.current.value)
        textInput.current.value = ''
    }
    const onCancel = () => {
        callback(undefined)
        textInput.current.value = ''
    }

    return (
        <Modal title={title} show={show} onSubmit={onSubmit} onCancel={onCancel}>
            <form
                onSubmit={(e) => {
                    e.preventDefault()
                    onSubmit()
                }}
            >
                <div className="form-group">
                    <label className="form-control-label">{label}</label>
                    <input type="text" className="form-control" ref={textInput} defaultValue={initialValue} />
                </div>
            </form>
        </Modal>
    )
}

TextInputModal.propTypes = {
    title: PropTypes.string.isRequired,
    label: PropTypes.string.isRequired,
    show: PropTypes.bool.isRequired,
    callback: PropTypes.func.isRequired,
    initialValue: PropTypes.string,
}

export default TextInputModal