Files
user-front/src/core/components/SelectBox.jsx

60 lines
1.9 KiB
JavaScript

import {FormControl, FormHelperText, InputLabel, MenuItem, Select,} from "@mui/material";
import {useTranslations} from "next-intl";
function SelectBox({
select,
name,
selectors,
label,
handleChange,
error,
onBlur,
disabled,
helperText,
isLoading,
errorEcured,
variant
}) {
const t = useTranslations();
return (
<FormControl
disabled={disabled || false}
variant={variant || "outlined"}
margin="normal"
fullWidth
size="small"
error={error}
sx={{mt: 0}}
>
<InputLabel>{label}</InputLabel>
<Select
label={label}
name={name}
size="small"
value={isLoading ? "" : select}
onChange={handleChange}
onBlur={onBlur}
>
{isLoading ? (
<MenuItem
sx={{color: "primary.main"}}>{t("LoanRequest.text_field_loading_provinces_list")}</MenuItem>
) : errorEcured ? (
<MenuItem sx={{color: "secondary.main"}}>
{t("LoanRequest.text_field_error_fetching_provinces")}
</MenuItem>
) : (
selectors.map((selector) => (
<MenuItem key={selector.id} value={selector.value}>
{selector.name}
</MenuItem>
))
)}
</Select>
<FormHelperText>{helperText}</FormHelperText>
</FormControl>
);
}
export default SelectBox;