How to change antd pro-component's SettingDrawer text/locales from default Chinese to English

Question

I am integrating antd's pro-components, specifically @ant-design/pro-layout according to their document. I have converted all Chinese text to English except text in SettingDrawer component. Screenshot attached

Here is the playground https://codesandbox.io/s/ji-chu-shi-yong-forked-lxtxqp (Note: open the output to a new window otherwise it wouldn't work).

One additional piece of info is that antd's original playground does not work as it missed to import the required CSS. Need to import the following

import "antd/dist/antd.css";

I opened your codesandbox in a new window and itt doesn't appear to have Chinese characters in the settings drawer for me. — Scratch'N'Purr, Oct 02 '22 at 14:41
I am still seeing the words in Chinese. I am talking about the words highlighted with yellow color, in case my question was not clear. — Premchandra Singh, Oct 03 '22 at 08:43

score 0 · Answer 1 · answered Jan 01 '23 at 10:02

You can change the language globally by using ConfigProvider

See Doc: https://ant.design/docs/react/i18n#configprovider

import { ConfigProvider } from 'antd';
import frFR from 'antd/locale/fr_FR';

return (
  <ConfigProvider locale={frFR}>
    <App />
  </ConfigProvider>
);

How to change antd pro-component's SettingDrawer text/locales from default Chinese to English

1 Answers1