summaryrefslogtreecommitdiff
path: root/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitAddComponent.js
blob: f80fccc8ea2284ef78255bfafe9364b4643b671e (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
import PropTypes from 'prop-types'
import React, { useRef } from 'react'

function UnitAddComponent({ units, onAdd }) {
    const unitSelect = useRef(null)

    return (
        <div className="form-inline">
            <div className="form-group w-100">
                <select className="form-control w-70 mr-1" ref={unitSelect}>
                    {units.map((unit) => (
                        <option value={unit._id} key={unit._id}>
                            {unit.name}
                        </option>
                    ))}
                </select>
                <button
                    type="submit"
                    className="btn btn-outline-primary"
                    onClick={() => onAdd(unitSelect.current.value)}
                >
                    <span className="fa fa-plus mr-2" />
                    Add
                </button>
            </div>
        </div>
    )
}

UnitAddComponent.propTypes = {
    units: PropTypes.array.isRequired,
    onAdd: PropTypes.func.isRequired,
}

export default UnitAddComponent