feat(i18n): pluginpage component (#345)

* i18n pluginpage * change pluginpage to PluginPage
apache · Jul 29, 2020 · ce1b3a1 · ce1b3a1
1 parent 81e32e5
commit ce1b3a1
Show file tree

Hide file tree

Showing 8 changed files with 303 additions and 281 deletions.
diff --git a/src/components/PluginPage/PluginCard.tsx b/src/components/PluginPage/PluginCard.tsx
@@ -15,8 +15,8 @@ const PluginCard: React.FC<Props> = ({ name, actions }) => {
       <Card.Meta
         title={name}
         description={formatMessage({
-          id: `PluginForm.plugin.${name}.desc`,
-          defaultMessage: 'Please view the documentation.',
+          id: `PluginPage.plugin.${name}.desc`,
+          defaultMessage: formatMessage({ id: 'PluginPage.refer.documents' }),
         })}
       />
     </Card>

diff --git a/src/components/PluginPage/PluginDrawer.tsx b/src/components/PluginPage/PluginDrawer.tsx
@@ -3,6 +3,7 @@ import { Drawer, Button } from 'antd';
 import { withTheme, FormProps } from '@rjsf/core';
 import { Theme as AntDTheme } from '@rjsf/antd';
 import { JSONSchema7 } from 'json-schema';
+import { useIntl } from 'umi';
 
 interface Props {
   name?: string;
@@ -27,6 +28,8 @@ const PluginDrawer: React.FC<Props> = ({
   onClose,
   onFinish,
 }) => {
+
+  const { formatMessage } = useIntl();
   const PluginForm = withTheme(AntDTheme);
 
   if (!name) {
@@ -38,7 +41,7 @@ const PluginDrawer: React.FC<Props> = ({
 
   return (
     <Drawer
-      title={`配置 ${name} 插件`}
+      title={formatMessage({ id: 'PluginPage.drawer.configure.plugin' })}
       width={400}
       visible={Boolean(name)}
       destroyOnClose
@@ -49,12 +52,12 @@ const PluginDrawer: React.FC<Props> = ({
             <div>
               {Boolean(active) && (
                 <Button type="primary" danger onClick={() => onInactive(name)}>
-                  禁用
+                  {formatMessage({ id: 'PluginPage.drawer.disabled' })}
                 </Button>
               )}
               {Boolean(!active) && (
                 <Button type="primary" onClick={() => onActive(name)}>
-                  启用
+                  {formatMessage({ id: 'PluginPage.drawer.enable' })}
                 </Button>
               )}
             </div>
@@ -68,7 +71,7 @@ const PluginDrawer: React.FC<Props> = ({
                     form.submit();
                   }}
                 >
-                  确认
+                  {formatMessage({ id: 'PluginPage.drawer.confirm' })}
                 </Button>
               </div>
             )}

diff --git a/src/components/PluginPage/PluginPage.tsx b/src/components/PluginPage/PluginPage.tsx
@@ -9,6 +9,7 @@ import PluginCard from './PluginCard';
 import PluginDrawer from './PluginDrawer';
 import { getList, fetchPluginSchema } from './service';
 import { PLUGIN_MAPPER_SOURCE } from './data';
+import { useIntl } from 'umi';
 
 type Props = {
   disabled?: boolean;
@@ -21,14 +22,15 @@ const PluginPage: React.FC<Props> = ({ data = {}, disabled, onChange }) => {
   const [activeList, setActiveList] = useState<PluginPage.PluginProps[]>([]);
   const [inactiveList, setInactiveList] = useState<PluginPage.PluginProps[]>([]);
   const [schema, setSchema] = useState<JSONSchema7>();
+  const { formatMessage } = useIntl();
 
   const pluginList = [
     {
-      title: '已启用',
+      title: formatMessage({ id: 'PluginPage.drawer.is.enabled' }),
       list: activeList,
     },
     {
-      title: '未启用',
+      title: formatMessage({ id: 'PluginPage.drawer.not.enabled' }),
       list: inactiveList,
     },
   ];

diff --git a/src/components/PluginPage/index.ts b/src/components/PluginPage/index.ts
@@ -2,5 +2,5 @@ export { default } from './PluginPage';
 export { default as PluginCard } from './PluginCard';
 export { default as PluginDrawer } from './PluginDrawer';
 
-export { default as PluginZhCN } from './locales/zh-CN';
-export { default as PluginEnUS } from './locales/en-US';
+export { default as PluginPageZhCN } from './locales/zh-CN';
+export { default as PluginPageEnUS } from './locales/en-US';
diff --git a/src/components/PluginPage/locales/en-US.ts b/src/components/PluginPage/locales/en-US.ts
diff --git a/src/components/PluginPage/locales/zh-CN.ts b/src/components/PluginPage/locales/zh-CN.ts
diff --git a/src/locales/en-US.ts b/src/locales/en-US.ts
@@ -1,4 +1,4 @@
-import { PluginFormEnUS } from '@/components/PluginForm';
+import { PluginPageEnUS } from '@/components/PluginPage';
 import { ActionBarEnUS } from '@/components/ActionBar';
 
 import { ConsumerEnUS } from '@/pages/Consumer';
@@ -23,7 +23,7 @@ export default {
   ...settings,
   ...pwa,
   ...component,
-  ...PluginFormEnUS,
+  ...PluginPageEnUS,
   ...ConsumerEnUS,
   ...RouteEnUS,
   ...ActionBarEnUS,

diff --git a/src/locales/zh-CN.ts b/src/locales/zh-CN.ts
@@ -1,4 +1,4 @@
-import { PluginFormZhCN } from '@/components/PluginForm';
+import { PluginPageZhCN } from '@/components/PluginPage';
 import { ActionBarZhCN } from '@/components/ActionBar';
 
 import { ConsumerZhCN } from '@/pages/Consumer';
@@ -23,7 +23,7 @@ export default {
   ...settings,
   ...pwa,
   ...component,
-  ...PluginFormZhCN,
+  ...PluginPageZhCN,
   ...ConsumerZhCN,
   ...RouteZhCN,
   ...ActionBarZhCN,