InputSelect.jsx

const InputSelect = ({options, invalidate, onChange, className, muteEmpty, children, ...props}) => {
    useEffect(() => {
        if (!invalidate) {
            return;
        }

        if (props.value && !options.some(({value}) => value === props.value)) {
            onChange({
                target: {
                    type: "select",
                    value: options[0]?.value ?? "",
                },
            });
        }
    }, [invalidate, options, onChange, props.value]);

    return (
        <Input {...props}
               type="select"
               className={classNames({
                   "custom-select": true,
                   "custom-select-sm": props.bsSize === "sm",
                   "custom-select-lg": props.bsSize === "lg",
                   [className]: !!className,
                   "text-muted": muteEmpty && !props.value,
               })}
               onChange={onChange}>
            {children}
        </Input>
    )
}