fix(Calendar): make Calendar locale overriding locale from ConfigProvider (#50236)

Co-authored-by: Lansana DIOMANDE <lansana.diomande@cartier.comm>
This commit is contained in:
Lansana Diomande 2024-08-07 17:12:32 +02:00 committed by GitHub
parent a711cf4039
commit 37abf776f4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 24 additions and 18 deletions

View File

@ -18,6 +18,7 @@ import Button from '../../radio/radioButton';
import Select from '../../select';
import Header from '../Header';
import type { CalendarHeaderProps } from '../Header';
import ConfigProvider from '../../config-provider';
const ref: {
calendarProps?: PickerPanelProps;
@ -208,6 +209,23 @@ describe('Calendar', () => {
MockDate.reset();
});
it('Calendar locale support should override ConfigProvider locale', () => {
MockDate.set(Dayjs('2018-10-19').valueOf());
// eslint-disable-next-line global-require
const zhCN = require('../locale/zh_CN').default;
// eslint-disable-next-line global-require
const enUs = require('../../locale/en_US').default;
const wrapper = render(
<ConfigProvider locale={enUs}>
<Calendar locale={zhCN} />
</ConfigProvider>,
);
expect(wrapper.container.querySelector('.ant-picker-content thead')?.textContent).toBe(
'一二三四五六日',
);
MockDate.reset();
});
describe('onPanelChange', () => {
it('trigger when click last month of date', () => {
const onPanelChange = jest.fn();

View File

@ -172,20 +172,6 @@ const generateCalendar = <DateType extends AnyObject>(generateConfig: GenerateCo
onSelect?.(date, { source });
};
// ====================== Locale ======================
const getDefaultLocale = () => {
const { locale } = props;
const result = {
...enUS,
...locale,
};
result.lang = {
...result.lang,
...locale?.lang,
};
return result;
};
// ====================== Render ======================
const dateRender = React.useCallback(
(date: DateType, info: CellRenderInfo<DateType>): React.ReactNode => {
@ -244,7 +230,9 @@ const generateCalendar = <DateType extends AnyObject>(generateConfig: GenerateCo
[monthFullCellRender, monthCellRender, cellRender, fullCellRender],
);
const [contextLocale] = useLocale('Calendar', getDefaultLocale);
const [contextLocale] = useLocale('Calendar', enUS);
const locale = { ...contextLocale, ...props.locale! };
const mergedCellRender: RcBasePickerPanelProps['cellRender'] = (current, info) => {
if (info.type === 'date') {
@ -254,7 +242,7 @@ const generateCalendar = <DateType extends AnyObject>(generateConfig: GenerateCo
if (info.type === 'month') {
return monthRender(current, {
...info,
locale: contextLocale?.lang,
locale: locale?.lang,
});
}
};
@ -292,7 +280,7 @@ const generateCalendar = <DateType extends AnyObject>(generateConfig: GenerateCo
generateConfig={generateConfig}
mode={mergedMode}
fullscreen={fullscreen}
locale={contextLocale?.lang}
locale={locale?.lang}
validRange={validRange}
onChange={onInternalSelect}
onModeChange={triggerModeChange}
@ -301,7 +289,7 @@ const generateCalendar = <DateType extends AnyObject>(generateConfig: GenerateCo
<RCPickerPanel
value={mergedValue}
prefixCls={prefixCls}
locale={contextLocale?.lang}
locale={locale?.lang}
generateConfig={generateConfig}
cellRender={mergedCellRender}
onSelect={(nextDate) => {