aswi2023one-team-to-rule-them-all-gitlab/src/components/SearchFormControl.tsx @ 78016ea3

import { CheckIcon, FormControl, Select } from "native-base"
import MultiSelect from "react-native-multiple-select"

export interface SearchFormProps {
    data: { label: string, value: string, key: string }[],
    label: string,
    placeholder: string,
}

const SearchFormControl = (props: SearchFormProps) => {
    return (
        <FormControl key={props.label}>
            <FormControl.Label>{props.label}</FormControl.Label>
            <Select
                placeholder={props.placeholder}
                minWidth="200"
                accessibilityLabel="Choose Service"
                _selectedItem={{
                    bg: "teal.600",
                    endIcon: <CheckIcon size={5} />
                }}
                mt="1"
                key={props.label}
            >
                {props.data.map((row) => (
                    <Select.Item label={row.label} value={row.value} key={row.key}/>
                ))}
            </Select>
        </FormControl>
    )
}

export default SearchFormControl