feat(client): improve locale
This commit is contained in:
parent
7839e78164
commit
b466b8f6fb
@ -1,9 +1,8 @@
|
||||
import { ConfigProvider, Spin } from 'antd';
|
||||
import enUS from 'antd/lib/locale/en_US';
|
||||
import zhCN from 'antd/lib/locale/zh_CN';
|
||||
import React from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useAPIClient, useRequest } from '../api-client';
|
||||
import locale from '../locale';
|
||||
|
||||
export function AntdConfigProvider(props) {
|
||||
const { remoteLocale, ...others } = props;
|
||||
@ -28,7 +27,7 @@ export function AntdConfigProvider(props) {
|
||||
return <Spin />;
|
||||
}
|
||||
return (
|
||||
<ConfigProvider {...others} locale={i18n.language === 'zh-CN' ? zhCN : enUS}>
|
||||
<ConfigProvider {...others} locale={locale[i18n.language].antd}>
|
||||
{props.children}
|
||||
</ConfigProvider>
|
||||
);
|
||||
|
@ -1,11 +1,17 @@
|
||||
import i18next from 'i18next';
|
||||
import moment from 'moment';
|
||||
import { initReactI18next } from 'react-i18next';
|
||||
import { resources } from '../locale';
|
||||
import locale from '../locale';
|
||||
const log = require('debug')('i18next');
|
||||
|
||||
export const i18n = i18next.createInstance();
|
||||
|
||||
const resources = {};
|
||||
|
||||
Object.keys(locale).forEach((lang) => {
|
||||
resources[lang] = locale[lang].resources;
|
||||
});
|
||||
|
||||
i18n.use(initReactI18next).init({
|
||||
lng: localStorage.getItem('NOCOBASE_LOCALE') || 'en-US',
|
||||
// debug: true,
|
||||
@ -18,13 +24,8 @@ i18n.use(initReactI18next).init({
|
||||
resources,
|
||||
});
|
||||
|
||||
const momentLngs = {
|
||||
'en-US': 'en',
|
||||
'zh-CN': 'zh-cn',
|
||||
};
|
||||
|
||||
function setMomentLng(language) {
|
||||
const lng = momentLngs[language || 'en-US'] || 'en';
|
||||
const lng = locale[language || 'en-US'].moment || 'en';
|
||||
log(lng);
|
||||
moment.locale(lng);
|
||||
}
|
||||
|
@ -1,15 +1,39 @@
|
||||
import antdEnUS from 'antd/lib/locale/en_US';
|
||||
import antdZhCN from 'antd/lib/locale/zh_CN';
|
||||
import enUS from './en_US';
|
||||
import zhCN from './zh_CN';
|
||||
|
||||
export const resources = {
|
||||
export type LocaleOptions = {
|
||||
label: string;
|
||||
moment: string;
|
||||
antd: any;
|
||||
resources?: any;
|
||||
};
|
||||
|
||||
export default {
|
||||
'en-US': {
|
||||
client: {
|
||||
...enUS,
|
||||
label: 'English',
|
||||
// https://github.com/moment/moment/blob/develop/locale/en.js
|
||||
moment: 'en',
|
||||
// https://github.com/ant-design/ant-design/tree/master/components/locale/en_US
|
||||
antd: antdEnUS,
|
||||
resources: {
|
||||
client: {
|
||||
...enUS,
|
||||
},
|
||||
},
|
||||
},
|
||||
'zh-CN': {
|
||||
client: {
|
||||
...zhCN,
|
||||
label: '简体中文',
|
||||
// https://github.com/moment/moment/blob/develop/locale/zh-cn.js
|
||||
moment: 'zh-cn',
|
||||
// https://github.com/ant-design/ant-design/tree/master/components/locale/zh_CN
|
||||
antd: antdZhCN,
|
||||
// i18next
|
||||
resources: {
|
||||
client: {
|
||||
...zhCN,
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
} as Record<string, LocaleOptions>;
|
||||
|
@ -89,6 +89,19 @@ const schema: ISchema = {
|
||||
{ label: '简体中文', value: 'zh-CN' },
|
||||
],
|
||||
},
|
||||
enabledLanguages: {
|
||||
type: 'array',
|
||||
title: '{{t("Enabled languages")}}',
|
||||
'x-component': 'Select',
|
||||
"x-component-props": {
|
||||
mode: 'multiple',
|
||||
},
|
||||
'x-decorator': 'FormItem',
|
||||
enum: [
|
||||
{ label: 'English', value: 'en-US' },
|
||||
{ label: '简体中文', value: 'zh-CN' },
|
||||
],
|
||||
},
|
||||
allowSignUp: {
|
||||
type: 'boolean',
|
||||
default: true,
|
||||
|
@ -1,13 +1,20 @@
|
||||
import { Menu, Select } from 'antd';
|
||||
import React, { useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useAPIClient, useCurrentUserContext } from '..';
|
||||
import { useAPIClient, useCurrentUserContext, useSystemSettings } from '..';
|
||||
import locale from '../locale';
|
||||
|
||||
export const LanguageSettings = () => {
|
||||
const { t, i18n } = useTranslation();
|
||||
const [open, setOpen] = useState(false);
|
||||
const api = useAPIClient();
|
||||
const ctx = useCurrentUserContext();
|
||||
const { data } = useSystemSettings();
|
||||
const enabledLanguages: string[] = data?.data?.enabledLanguages || [];
|
||||
if (!enabledLanguages.length) {
|
||||
return null;
|
||||
}
|
||||
// console.log('data', data?.data?.enabledLanguages);
|
||||
return (
|
||||
<Menu.Item
|
||||
eventKey={'LanguageSettings'}
|
||||
@ -23,10 +30,14 @@ export const LanguageSettings = () => {
|
||||
onDropdownVisibleChange={(open) => {
|
||||
setOpen(open);
|
||||
}}
|
||||
options={[
|
||||
{ label: '简体中文', value: 'zh-CN' },
|
||||
{ label: 'English', value: 'en-US' },
|
||||
]}
|
||||
options={Object.keys(locale)
|
||||
.filter((lang) => enabledLanguages.includes(lang))
|
||||
.map((lang) => {
|
||||
return {
|
||||
label: locale[lang].label,
|
||||
value: lang,
|
||||
};
|
||||
})}
|
||||
value={i18n.language}
|
||||
onChange={async (lang) => {
|
||||
await api.resource('users').updateProfile({
|
||||
|
@ -21,6 +21,10 @@ export default defineCollection({
|
||||
name: 'logo',
|
||||
target: 'attachments',
|
||||
},
|
||||
{
|
||||
type: 'array',
|
||||
name: 'enabledLanguages',
|
||||
},
|
||||
{
|
||||
type: 'string',
|
||||
name: 'appLang',
|
||||
|
Loading…
Reference in New Issue
Block a user