blob: 4507b409b34cdf32330576d4a18cb8c98b4d9336 (
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
42
|
import PropTypes from 'prop-types'
import React, { useState } from 'react'
import { Button, InputGroup, Select, SelectOption, SelectVariant } from '@patternfly/react-core'
import PlusIcon from '@patternfly/react-icons/dist/js/icons/plus-icon'
function UnitAddComponent({ units, onAdd }) {
const [isOpen, setOpen] = useState(false)
const [selected, setSelected] = useState(null)
return (
<InputGroup>
<Select
variant={SelectVariant.single}
placeholderText="Select a unit"
aria-label="Select Unit"
onToggle={() => setOpen(!isOpen)}
isOpen={isOpen}
onSelect={(_, selection) => {
setSelected(selection)
setOpen(false)
}}
selections={selected}
>
{units.map((unit) => (
<SelectOption value={unit.id} key={unit.id}>
{unit.name}
</SelectOption>
))}
</Select>
<Button icon={<PlusIcon />} variant="control" onClick={() => onAdd(selected)}>
Add
</Button>
</InputGroup>
)
}
UnitAddComponent.propTypes = {
units: PropTypes.array.isRequired,
onAdd: PropTypes.func.isRequired,
}
export default UnitAddComponent
|
