import { useState } from 'react';
import { Select } from './Select';
import { ReactSelectProps } from '@/types';

const OPTION_JENIS_KELAMIN = [
    { label: 'L : LAKI-LAKI', value: 'L' },
    { label: 'P : PEREMPUAN', value: 'P' },
];

export const SelectJenisKelamin = (props: ReactSelectProps) => {
    const [value, setValue] = useState(OPTION_JENIS_KELAMIN.find((item) => item.value === props.value) ?? '');

    return (
        <Select
            value={value}
            options={OPTION_JENIS_KELAMIN}
            isDisabled={props.disable}
            placeholder="Pilih Jenis Kelamin"
            onChange={(newValue: unknown) => {
                const option = newValue as { label: string; value: string };
                setValue(option);
                props.onChange?.(option?.value);
            }}
        />
    );
};