37 lines
1.1 KiB
TypeScript
37 lines
1.1 KiB
TypeScript
import { useState, useMemo } from 'react';
|
|
import { DatePicker } from '@mui/x-date-pickers/DatePicker';
|
|
import { LocalizationProvider } from '@mui/x-date-pickers';
|
|
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
|
|
import { AdapterDateFnsJalali } from '@mui/x-date-pickers/AdapterDateFnsJalali';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
export function DateOfBirth() {
|
|
const { t, i18n } = useTranslation('completionForm');
|
|
const isFarsi = i18n.language === 'fa' || i18n.language === 'fa-IR';
|
|
const [birthDate, setBirthDate] = useState<Date | null>(null);
|
|
|
|
const Adapter = useMemo(() => {
|
|
return isFarsi ? AdapterDateFnsJalali : AdapterDateFns;
|
|
}, [isFarsi]);
|
|
|
|
return (
|
|
<LocalizationProvider dateAdapter={Adapter}>
|
|
<DatePicker
|
|
label={t('completion.dateOfBirth')}
|
|
value={birthDate}
|
|
onChange={(newValue) => setBirthDate(newValue)}
|
|
slotProps={{
|
|
textField: {
|
|
fullWidth: true,
|
|
sx: {
|
|
flex: '1 1 260px',
|
|
maxWidth: '309px',
|
|
width: '100%',
|
|
},
|
|
},
|
|
}}
|
|
/>
|
|
</LocalizationProvider>
|
|
);
|
|
}
|