🌎 localization: docs translated to english (#7938)

* docs translated to english

* fix doc

Co-authored-by: Matt Ortiz <mattortiz@matts-mbp.lan>
Co-authored-by: chenshuai2144 <qixian.cs@outlook.com>

config/proxy.ts

@@ -1,5 +1,6 @@
 /**
  * 在生产环境 代理是无法生效的，所以这里没有生产环境的配置
+ * -------------------------------
  * The agent cannot take effect in the production environment
  * so there is no configuration of the production environment
  * For details, please see

src/components/Authorized/CheckPermissions.tsx

@@ -11,6 +11,15 @@ export type IAuthorityType =
   | ((currentAuthority: string | string[]) => IAuthorityType);
 
 /**
+ * @en-US
+ * General permission check method
+ * Common check permissions method
+ * @param {Permission judgment} authority
+ * @param {Your permission | Your permission description} currentAuthority
+ * @param {Passing components} target
+ * @param {no pass components | no pass components} Exception
+ * -------------------------------------------------------
+ * @zh-CN
  * 通用权限检查方法 Common check permissions method
  *
  * @param { 权限判定 | Permission judgment } authority
@@ -24,12 +33,12 @@ const checkPermissions = <T, K>(
   target: T,
   Exception: K,
 ): T | K | React.ReactNode => {
-  // 没有判定权限.默认查看所有
+  // No judgment permission. View all by default
   // Retirement authority, return target;
   if (!authority) {
     return target;
   }
-  // 数组处理
+  // Array processing
   if (Array.isArray(authority)) {
     if (Array.isArray(currentAuthority)) {
       if (currentAuthority.some((item) => authority.includes(item))) {
@@ -40,7 +49,7 @@ const checkPermissions = <T, K>(
     }
     return Exception;
   }
-  // string 处理
+  // Deal with string
   if (typeof authority === 'string') {
     if (Array.isArray(currentAuthority)) {
       if (currentAuthority.some((item) => authority === item)) {
@@ -51,14 +60,14 @@ const checkPermissions = <T, K>(
     }
     return Exception;
   }
-  // Promise 处理
+  // Deal with promise
   if (authority instanceof Promise) {
     return <PromiseRender<T, K> ok={target} error={Exception} promise={authority} />;
   }
-  // Function 处理
+  // Deal with function
   if (typeof authority === 'function') {
     const bool = authority(currentAuthority);
-    // 函数执行后返回值是 Promise
+    // The return value after the function is executed is Promise
     if (bool instanceof Promise) {
       return <PromiseRender<T, K> ok={target} error={Exception} promise={bool} />;
     }

src/components/Authorized/Secured.tsx

@@ -1,7 +1,10 @@
 import React from 'react';
 import CheckPermissions from './CheckPermissions';
 
-/** 默认不能访问任何页面 default is "NULL" */
+/**
+ * @en-US No pages can be accessed by default,default is "NULL"
+ * @zh-CN 默认不能访问任何页面 default is "NULL"
+ *  */
 const Exception403 = () => 403;
 
 export const isComponentClass = (component: React.ComponentClass | React.ReactNode): boolean => {
@@ -27,6 +30,20 @@ const checkIsInstantiation = (target: React.ComponentClass | React.ReactNode) =>
 };
 
 /**
+ * @en-US
+ * Used to determine whether you have permission to access this view permission
+ * authority supports incoming string, () => boolean | Promise
+ * e.g.'user' Only user user can access
+ * e.g.'user,admin' user and admin can access
+ * e.g. ()=>boolean return true to access, return false to not access
+ * e.g. Promise then can be accessed, catch can not be accessed
+ * e.g. authority support incoming string, () => boolean | Promise
+ * e.g.'user' only user user can access
+ * e.g.'user, admin' user and admin can access
+ * e.g. () => boolean true to be able to visit, return false can not be accessed
+ * e.g. Promise then can not access the visit to catch
+ *-------------------------------------------------------------
+ * @zh-CN
  * 用于判断是否拥有权限访问此 view 权限 authority 支持传入 string, () => boolean | Promise e.g. 'user' 只有 user 用户能访问
  * e.g. 'user,admin' user 和 admin 都能访问 e.g. ()=>boolean 返回true能访问,返回false不能访问 e.g. Promise then 能访问
  * catch不能访问 e.g. authority support incoming string, () => boolean | Promise e.g. 'user' only user
@@ -34,10 +51,16 @@ const checkIsInstantiation = (target: React.ComponentClass | React.ReactNode) =>
  * to visit, return false can not be accessed e.g. Promise then can not access the visit to catch
  *
  * @param {string | function | Promise} authority
- * @param {ReactNode} error 非必需参数
+ * @param {ReactNode} error non-required parameter
  */
 const authorize = (authority: string, error?: React.ReactNode) => {
   /**
+   * @en-US
+   * conversion into a class
+   * Prevent the staticContext from being found to cause an error when the string is passed in
+   * String parameters can cause staticContext not found error
+   *-------------------------------------------------------------
+   * @zh-CN
    * Conversion into a class 防止传入字符串时找不到staticContext造成报错 String parameters can cause staticContext
    * not found error
    */

src/components/GlobalHeader/NoticeIconView.tsx

@@ -43,7 +43,7 @@ class GlobalHeaderRight extends Component<GlobalHeaderRightProps> {
 
   handleNoticeClear = (title: string, key: string) => {
     const { dispatch } = this.props;
-    message.success(`${'清空了'} ${title}`);
+    message.success(`${'Emptied'} ${title}`);
 
     if (dispatch) {
       dispatch({
@@ -123,8 +123,8 @@ class GlobalHeaderRight extends Component<GlobalHeaderRightProps> {
           this.changeReadState(item as NoticeItem);
         }}
         loading={fetchingNotices}
-        clearText="清空"
-        viewMoreText="查看更多"
+        clearText="Empty"
+        viewMoreText="See more"
         onClear={this.handleNoticeClear}
         onPopupVisibleChange={onNoticeVisibleChange}
         onViewMore={() => message.info('Click on view more')}
@@ -134,22 +134,22 @@ class GlobalHeaderRight extends Component<GlobalHeaderRightProps> {
           tabKey="notification"
           count={unreadMsg.notification}
           list={noticeData.notification}
-          title="通知"
-          emptyText="你已查看所有通知"
+          title="Notification"
+          emptyText="You have viewed all notifications"
           showViewMore
         />
         <NoticeIcon.Tab
           tabKey="message"
           count={unreadMsg.message}
           list={noticeData.message}
-          title="消息"
-          emptyText="您已读完所有消息"
+          title="Message"
+          emptyText="You have read all messages"
           showViewMore
         />
         <NoticeIcon.Tab
           tabKey="event"
-          title="待办"
-          emptyText="你已完成所有待办"
+          title="To do"
+          emptyText="You have completed all to-dos"
           count={unreadMsg.event}
           list={noticeData.event}
           showViewMore

src/components/GlobalHeader/RightContent.tsx

@@ -32,7 +32,7 @@ const GlobalHeaderRight: React.SFC<GlobalHeaderRightProps> = (props) => {
     <div className={className}>
       <HeaderSearch
         className={`${styles.action} ${styles.search}`}
-        placeholder="站内搜索"
+        placeholder="Site Search"
         defaultValue="umi ui"
         options={[
           { label: <a href="https://umijs.org/zh/guide/umi-ui.html">umi ui</a>, value: 'umi ui' },
@@ -53,7 +53,7 @@ const GlobalHeaderRight: React.SFC<GlobalHeaderRightProps> = (props) => {
         //   //console.log('input', value);
         // }}
       />
-      <Tooltip title="使用文档">
+      <Tooltip title="Use documentation">
         <a
           style={{
             color: 'inherit',

src/global.less

@@ -46,7 +46,7 @@ ol {
   }
 }
 
-// 兼容IE11
+// Compatible with IE11
 @media screen and(-ms-high-contrast: active), (-ms-high-contrast: none) {
   body .ant-design-pro > .ant-layout {
     min-height: 100vh;

src/layouts/BasicLayout.tsx

@@ -56,7 +56,7 @@ const menuDataRender = (menuList: MenuDataItem[]): MenuDataItem[] =>
 
 const defaultFooterDom = (
   <DefaultFooter
-    copyright={`${new Date().getFullYear()} 蚂蚁集团体验技术部出品`}
+    copyright={`${new Date().getFullYear()} Produced by Ant Group Experience Technology Department`}
     links={[
       {
         key: 'Ant Design Pro',

src/layouts/SecurityLayout.tsx

@@ -36,7 +36,7 @@ class SecurityLayout extends React.Component<SecurityLayoutProps, SecurityLayout
     const { isReady } = this.state;
     const { children, loading, currentUser } = this.props;
     // You can replace it to your authentication rule (such as check token exists)
-    // 你可以把它替换成你自己的登录认证规则（比如判断 token 是否存在）
+    // You can replace it with your own login authentication rules (such as judging whether the token exists)
     const isLogin = currentUser && currentUser.userid;
     const queryString = stringify({
       redirect: window.location.href,

src/layouts/UserLayout.tsx

@@ -55,7 +55,7 @@ const UserLayout: React.FC<UserLayoutProps> = (props) => {
             <div className={styles.desc}>
               <FormattedMessage
                 id="pages.layouts.userLayout.title"
-                defaultMessage="Ant Design 是西湖区最具影响力的 Web 设计规范"
+                defaultMessage="Ant Design. The most influential Web design specification in Xihu District."
               />
             </div>
           </div>

src/pages/Admin.tsx

@@ -10,14 +10,14 @@ export default (): React.ReactNode => {
     <PageHeaderWrapper
       content={intl.formatMessage({
         id: 'pages.admin.subPage.title',
-        defaultMessage: ' 这个页面只有 admin 权限才能查看',
+        defaultMessage: 'This page can only be viewed by admin',
       })}
     >
       <Card>
         <Alert
           message={intl.formatMessage({
             id: 'pages.welcome.alertMessage',
-            defaultMessage: '更快更强的重型组件，已经发布。',
+            defaultMessage: 'Faster and stronger heavy-duty components have been released.',
           })}
           type="success"
           showIcon

src/pages/TableList/index.tsx

@@ -14,31 +14,32 @@ import type { TableListItem } from './data.d';
 import { queryRule, updateRule, addRule, removeRule } from './service';
 
 /**
- * 添加节点
- *
+ * @en-US Add node
+ * @zh-CN 添加节点
  * @param fields
  */
 const handleAdd = async (fields: TableListItem) => {
-  const hide = message.loading('正在添加');
+  const hide = message.loading('Adding');
   try {
     await addRule({ ...fields });
     hide();
-    message.success('添加成功');
+    message.success('Added successfully');
     return true;
   } catch (error) {
     hide();
-    message.error('添加失败请重试！');
+    message.error('Adding failed, please try again!');
     return false;
   }
 };
 
 /**
- * 更新节点
+ * @en-US Update node
+ * @zh-CN 更新节点
  *
  * @param fields
  */
 const handleUpdate = async (fields: FormValueType) => {
-  const hide = message.loading('正在配置');
+  const hide = message.loading('Configuring');
   try {
     await updateRule({
       name: fields.name,
@@ -47,41 +48,48 @@ const handleUpdate = async (fields: FormValueType) => {
     });
     hide();
 
-    message.success('配置成功');
+    message.success('Configuration is successful');
     return true;
   } catch (error) {
     hide();
-    message.error('配置失败请重试！');
+    message.error('Configuration failed, please try again!');
     return false;
   }
 };
 
 /**
- * 删除节点
+ *  Delete node
+ * @zh-CN 删除节点
  *
  * @param selectedRows
  */
 const handleRemove = async (selectedRows: TableListItem[]) => {
-  const hide = message.loading('正在删除');
+  const hide = message.loading('Deleting');
   if (!selectedRows) return true;
   try {
     await removeRule({
       key: selectedRows.map((row) => row.key),
     });
     hide();
-    message.success('删除成功，即将刷新');
+    message.success('Deleted successfully and will refresh soon');
     return true;
   } catch (error) {
     hide();
-    message.error('删除失败，请重试');
+    message.error('Delete failed, please try again');
     return false;
   }
 };
 
 const TableList: React.FC = () => {
-  /** 新建窗口的弹窗 */
+  /**
+   * @en-US Pop-up window of new window
+   * @zh-CN 新建窗口的弹窗
+   *  */
   const [createModalVisible, handleModalVisible] = useState<boolean>(false);
-  /** 分布更新窗口的弹窗 */
+  /**
+   * @en-US The pop-up window of the distribution update window
+   * @zh-CN 分布更新窗口的弹窗
+   * */
   const [updateModalVisible, handleUpdateModalVisible] = useState<boolean>(false);
 
   const [showDetail, setShowDetail] = useState<boolean>(false);
@@ -90,7 +98,10 @@ const TableList: React.FC = () => {
   const [currentRow, setCurrentRow] = useState<TableListItem>();
   const [selectedRowsState, setSelectedRows] = useState<TableListItem[]>([]);
 
-  /** 国际化配置 */
+  /**
+   * @en-US International configuration
+   * @zh-CN 国际化配置
+   * */
   const intl = useIntl();
 
   const columns: ProColumns<TableListItem>[] = [
@@ -98,11 +109,11 @@ const TableList: React.FC = () => {
       title: (
         <FormattedMessage
           id="pages.searchTable.updateForm.ruleName.nameLabel"
-          defaultMessage="规则名称"
+          defaultMessage="Rule name"
         />
       ),
       dataIndex: 'name',
-      tip: '规则名称是唯一的 key',
+      tip: 'The rule name is the unique key',
       render: (dom, entity) => {
         return (
           <a
@@ -117,12 +128,17 @@ const TableList: React.FC = () => {
       },
     },
     {
-      title: <FormattedMessage id="pages.searchTable.titleDesc" defaultMessage="描述" />,
+      title: <FormattedMessage id="pages.searchTable.titleDesc" defaultMessage="Description" />,
       dataIndex: 'desc',
       valueType: 'textarea',
     },
     {
-      title: <FormattedMessage id="pages.searchTable.titleCallNo" defaultMessage="服务调用次数" />,
+      title: (
+        <FormattedMessage
+          id="pages.searchTable.titleCallNo"
+          defaultMessage="Number of service calls"
+        />
+      ),
       dataIndex: 'callNo',
       sorter: true,
       hideInForm: true,
@@ -133,31 +149,37 @@ const TableList: React.FC = () => {
         })}`,
     },
     {
-      title: <FormattedMessage id="pages.searchTable.titleStatus" defaultMessage="状态" />,
+      title: <FormattedMessage id="pages.searchTable.titleStatus" defaultMessage="Status" />,
       dataIndex: 'status',
       hideInForm: true,
       valueEnum: {
         0: {
           text: (
-            <FormattedMessage id="pages.searchTable.nameStatus.default" defaultMessage="关闭" />
+            <FormattedMessage
+              id="pages.searchTable.nameStatus.default"
+              defaultMessage="Shut down"
+            />
           ),
           status: 'Default',
         },
         1: {
           text: (
-            <FormattedMessage id="pages.searchTable.nameStatus.running" defaultMessage="运行中" />
+            <FormattedMessage id="pages.searchTable.nameStatus.running" defaultMessage="Running" />
           ),
           status: 'Processing',
         },
         2: {
           text: (
-            <FormattedMessage id="pages.searchTable.nameStatus.online" defaultMessage="已上线" />
+            <FormattedMessage id="pages.searchTable.nameStatus.online" defaultMessage="Online" />
           ),
           status: 'Success',
         },
         3: {
           text: (
-            <FormattedMessage id="pages.searchTable.nameStatus.abnormal" defaultMessage="异常" />
+            <FormattedMessage
+              id="pages.searchTable.nameStatus.abnormal"
+              defaultMessage="Abnormal"
+            />
           ),
           status: 'Error',
         },
@@ -165,7 +187,10 @@ const TableList: React.FC = () => {
     },
     {
       title: (
-        <FormattedMessage id="pages.searchTable.titleUpdatedAt" defaultMessage="上次调度时间" />
+        <FormattedMessage
+          id="pages.searchTable.titleUpdatedAt"
+          defaultMessage="Last scheduled time"
+        />
       ),
       sorter: true,
       dataIndex: 'updatedAt',
@@ -181,7 +206,7 @@ const TableList: React.FC = () => {
               {...rest}
               placeholder={intl.formatMessage({
                 id: 'pages.searchTable.exception',
-                defaultMessage: '请输入异常原因！',
+                defaultMessage: 'Please enter the reason for the exception!',
               })}
             />
           );
@@ -190,7 +215,7 @@ const TableList: React.FC = () => {
       },
     },
     {
-      title: <FormattedMessage id="pages.searchTable.titleOption" defaultMessage="操作" />,
+      title: <FormattedMessage id="pages.searchTable.titleOption" defaultMessage="Operating" />,
       dataIndex: 'option',
       valueType: 'option',
       render: (_, record) => [
@@ -201,10 +226,13 @@ const TableList: React.FC = () => {
             setCurrentRow(record);
           }}
         >
-          <FormattedMessage id="pages.searchTable.config" defaultMessage="配置" />
+          <FormattedMessage id="pages.searchTable.config" defaultMessage="Configuration" />
         </a>,
         <a key="subscribeAlert" href="https://procomponents.ant.design/">
-          <FormattedMessage id="pages.searchTable.subscribeAlert" defaultMessage="订阅警报" />
+          <FormattedMessage
+            id="pages.searchTable.subscribeAlert"
+            defaultMessage="Subscribe to alerts"
+          />
         </a>,
       ],
     },
@@ -215,7 +243,7 @@ const TableList: React.FC = () => {
       <ProTable<TableListItem>
         headerTitle={intl.formatMessage({
           id: 'pages.searchTable.title',
-          defaultMessage: '查询表格',
+          defaultMessage: 'Enquiry form',
         })}
         actionRef={actionRef}
         rowKey="key"
@@ -230,7 +258,7 @@ const TableList: React.FC = () => {
               handleModalVisible(true);
             }}
           >
-            <PlusOutlined /> <FormattedMessage id="pages.searchTable.new" defaultMessage="新建" />
+            <PlusOutlined /> <FormattedMessage id="pages.searchTable.new" defaultMessage="New" />
           </Button>,
         ]}
         request={(params, sorter, filter) => queryRule({ ...params, sorter, filter })}
@@ -245,14 +273,14 @@ const TableList: React.FC = () => {
         <FooterToolbar
           extra={
             <div>
-              <FormattedMessage id="pages.searchTable.chosen" defaultMessage="已选择" />{' '}
+              <FormattedMessage id="pages.searchTable.chosen" defaultMessage="Chosen" />{' '}
               <a style={{ fontWeight: 600 }}>{selectedRowsState.length}</a>{' '}
               <FormattedMessage id="pages.searchTable.item" defaultMessage="项" />
               &nbsp;&nbsp;
               <span>
                 <FormattedMessage
                   id="pages.searchTable.totalServiceCalls"
-                  defaultMessage="服务调用次数总计"
+                  defaultMessage="Total number of service calls"
                 />{' '}
                 {selectedRowsState.reduce((pre, item) => pre + item.callNo, 0)}{' '}
                 <FormattedMessage id="pages.searchTable.tenThousand" defaultMessage="万" />
@@ -267,17 +295,23 @@ const TableList: React.FC = () => {
               actionRef.current?.reloadAndRest?.();
             }}
           >
-            <FormattedMessage id="pages.searchTable.batchDeletion" defaultMessage="批量删除" />
+            <FormattedMessage
+              id="pages.searchTable.batchDeletion"
+              defaultMessage="Batch deletion"
+            />
           </Button>
           <Button type="primary">
-            <FormattedMessage id="pages.searchTable.batchApproval" defaultMessage="批量审批" />
+            <FormattedMessage
+              id="pages.searchTable.batchApproval"
+              defaultMessage="Batch approval"
+            />
           </Button>
         </FooterToolbar>
       )}
       <ModalForm
         title={intl.formatMessage({
           id: 'pages.searchTable.createForm.newRule',
-          defaultMessage: '新建规则',
+          defaultMessage: 'New rule',
         })}
         width="400px"
         visible={createModalVisible}
@@ -299,7 +333,7 @@ const TableList: React.FC = () => {
               message: (
                 <FormattedMessage
                   id="pages.searchTable.ruleName"
-                  defaultMessage="规则名称为必填项"
+                  defaultMessage="Rule name is required"
                 />
               ),
             },

src/pages/User/login/index.tsx

@@ -77,14 +77,14 @@ const Login: React.FC<LoginProps> = (props) => {
             key="account"
             tab={intl.formatMessage({
               id: 'pages.login.accountLogin.tab',
-              defaultMessage: '账户密码登录',
+              defaultMessage: 'Account password login',
             })}
           />
           <Tabs.TabPane
             key="mobile"
             tab={intl.formatMessage({
               id: 'pages.login.phoneLogin.tab',
-              defaultMessage: '手机号登录',
+              defaultMessage: 'Mobile phone number login',
             })}
           />
         </Tabs>
@@ -93,7 +93,7 @@ const Login: React.FC<LoginProps> = (props) => {
           <LoginMessage
             content={intl.formatMessage({
               id: 'pages.login.accountLogin.errorMessage',
-              defaultMessage: '账户或密码错误（admin/ant.design)',
+              defaultMessage: 'Incorrect account or password（admin/ant.design)',
             })}
           />
         )}
@@ -107,7 +107,7 @@ const Login: React.FC<LoginProps> = (props) => {
               }}
               placeholder={intl.formatMessage({
                 id: 'pages.login.username.placeholder',
-                defaultMessage: '用户名: admin or user',
+                defaultMessage: 'Username: admin or user',
               })}
               rules={[
                 {
@@ -115,7 +115,7 @@ const Login: React.FC<LoginProps> = (props) => {
                   message: (
                     <FormattedMessage
                       id="pages.login.username.required"
-                      defaultMessage="请输入用户名!"
+                      defaultMessage="Please enter user name!"
                     />
                   ),
                 },
@@ -129,7 +129,7 @@ const Login: React.FC<LoginProps> = (props) => {
               }}
               placeholder={intl.formatMessage({
                 id: 'pages.login.password.placeholder',
-                defaultMessage: '密码: ant.design',
+                defaultMessage: 'Password: ant.design',
               })}
               rules={[
                 {
@@ -137,7 +137,7 @@ const Login: React.FC<LoginProps> = (props) => {
                   message: (
                     <FormattedMessage
                       id="pages.login.password.required"
-                      defaultMessage="请输入密码！"
+                      defaultMessage="Please enter password！"
                     />
                   ),
                 },
@@ -147,7 +147,7 @@ const Login: React.FC<LoginProps> = (props) => {
         )}
 
         {status === 'error' && loginType === 'mobile' && !submitting && (
-          <LoginMessage content="验证码错误" />
+          <LoginMessage content="Verification code error" />
         )}
         {type === 'mobile' && (
           <>
@@ -159,7 +159,7 @@ const Login: React.FC<LoginProps> = (props) => {
               name="mobile"
               placeholder={intl.formatMessage({
                 id: 'pages.login.phoneNumber.placeholder',
-                defaultMessage: '手机号',
+                defaultMessage: 'Phone number',
               })}
               rules={[
                 {
@@ -167,7 +167,7 @@ const Login: React.FC<LoginProps> = (props) => {
                   message: (
                     <FormattedMessage
                       id="pages.login.phoneNumber.required"
-                      defaultMessage="请输入手机号！"
+                      defaultMessage="Please enter phone number!"
                     />
                   ),
                 },
@@ -176,7 +176,7 @@ const Login: React.FC<LoginProps> = (props) => {
                   message: (
                     <FormattedMessage
                       id="pages.login.phoneNumber.invalid"
-                      defaultMessage="手机号格式错误！"
+                      defaultMessage="Malformed phone number!"
                     />
                   ),
                 },
@@ -192,18 +192,18 @@ const Login: React.FC<LoginProps> = (props) => {
               }}
               placeholder={intl.formatMessage({
                 id: 'pages.login.captcha.placeholder',
-                defaultMessage: '请输入验证码',
+                defaultMessage: 'Please enter verification code',
               })}
               captchaTextRender={(timing, count) => {
                 if (timing) {
                   return `${count} ${intl.formatMessage({
                     id: 'pages.getCaptchaSecondText',
-                    defaultMessage: '获取验证码',
+                    defaultMessage: 'Get verification code',
                   })}`;
                 }
                 return intl.formatMessage({
                   id: 'pages.login.phoneLogin.getVerificationCode',
-                  defaultMessage: '获取验证码',
+                  defaultMessage: 'Get verification code',
                 });
               }}
               name="captcha"
@@ -213,7 +213,7 @@ const Login: React.FC<LoginProps> = (props) => {
                   message: (
                     <FormattedMessage
                       id="pages.login.captcha.required"
-                      defaultMessage="请输入验证码！"
+                      defaultMessage="Please enter verification code！"
                     />
                   ),
                 },
@@ -223,7 +223,9 @@ const Login: React.FC<LoginProps> = (props) => {
                 if (result === false) {
                   return;
                 }
-                message.success('获取验证码成功！验证码为：1234');
+                message.success(
+                  'Get the verification code successfully! The verification code is: 1234',
+                );
               }}
             />
           </>
@@ -234,19 +236,19 @@ const Login: React.FC<LoginProps> = (props) => {
           }}
         >
           <ProFormCheckbox noStyle name="autoLogin">
-            <FormattedMessage id="pages.login.rememberMe" defaultMessage="自动登录" />
+            <FormattedMessage id="pages.login.rememberMe" defaultMessage="Auto login" />
           </ProFormCheckbox>
           <a
             style={{
               float: 'right',
             }}
           >
-            <FormattedMessage id="pages.login.forgotPassword" defaultMessage="忘记密码" />
+            <FormattedMessage id="pages.login.forgotPassword" defaultMessage="Forget password" />
           </a>
         </div>
       </ProForm>
       <Space className={styles.other}>
-        <FormattedMessage id="pages.login.loginWith" defaultMessage="其他登录方式" />
+        <FormattedMessage id="pages.login.loginWith" defaultMessage="Other login methods" />
         <AlipayCircleOutlined className={styles.icon} />
         <TaobaoCircleOutlined className={styles.icon} />
         <WeiboCircleOutlined className={styles.icon} />

src/pages/Welcome.tsx

@@ -20,7 +20,7 @@ export default (): React.ReactNode => {
         <Alert
           message={intl.formatMessage({
             id: 'pages.welcome.alertMessage',
-            defaultMessage: '更快更强的重型组件，已经发布。',
+            defaultMessage: 'Faster and stronger heavy-duty components have been released.',
           })}
           type="success"
           showIcon
@@ -31,13 +31,13 @@ export default (): React.ReactNode => {
           }}
         />
         <Typography.Text strong>
-          <FormattedMessage id="pages.welcome.advancedComponent" defaultMessage="高级表格" />{' '}
+          <FormattedMessage id="pages.welcome.advancedComponent" defaultMessage="Advanced Form" />{' '}
           <a
             href="https://procomponents.ant.design/components/table"
             rel="noopener noreferrer"
             target="__blank"
           >
-            <FormattedMessage id="pages.welcome.link" defaultMessage="欢迎使用" />
+            <FormattedMessage id="pages.welcome.link" defaultMessage="Welcome" />
           </a>
         </Typography.Text>
         <CodePreview>yarn add @ant-design/pro-table</CodePreview>
@@ -47,13 +47,13 @@ export default (): React.ReactNode => {
             marginBottom: 12,
           }}
         >
-          <FormattedMessage id="pages.welcome.advancedLayout" defaultMessage="高级布局" />{' '}
+          <FormattedMessage id="pages.welcome.advancedLayout" defaultMessage="Advanced layout" />{' '}
           <a
             href="https://procomponents.ant.design/components/layout"
             rel="noopener noreferrer"
             target="__blank"
           >
-            <FormattedMessage id="pages.welcome.link" defaultMessage="欢迎使用" />
+            <FormattedMessage id="pages.welcome.link" defaultMessage="Welcome" />
           </a>
         </Typography.Text>
         <CodePreview>yarn add @ant-design/pro-layout</CodePreview>

src/pages/document.ejs

@@ -5,7 +5,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta
       name="keywords"
-      content="antd,umi,umijs,ant design,脚手架,布局, Ant Design,项目,Pro,admin,控制台,主页,开箱即用,中后台,解决方案,组件库"
+      content="antd,umi,umijs,ant design,Scaffolding, layout, Ant Design, project, Pro, admin, console, homepage, out-of-the-box, middle and back office, solution, component library"
     />
     <meta
       name="description"
@@ -15,7 +15,7 @@
     <meta
       name="description"
       content="
-      开箱即用的中台前端/设计解决方案。"
+      Out-of-the-box mid-stage front-end/design solution."
     />
     <meta
       name="viewport"

src/typings.d.ts

@@ -39,7 +39,7 @@ interface Window {
 declare let ga: () => void;
 
 // preview.pro.ant.design only do not use in your production ;
-// preview.pro.ant.design 专用环境变量，请不要在你的项目中使用它。
+// preview.pro.ant.design Dedicated environment variable, please do not use it in your project.
 declare let ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION: 'site' | undefined;
 
 declare const REACT_APP_ENV: 'test' | 'dev' | 'pre' | false;

src/utils/authority.ts

@@ -17,7 +17,7 @@ export function getAuthority(str?: string): string | string[] {
     return [authority];
   }
   // preview.pro.ant.design only do not use in your production.
-  // preview.pro.ant.design 专用环境变量，请不要在你的项目中使用它。
+  // preview.pro.ant.design Dedicated environment variable, please do not use it in your project.
   if (!authority && ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION === 'site') {
     return ['admin'];
   }

src/utils/request.ts

@@ -2,7 +2,7 @@
 import { extend } from 'umi-request';
 import { notification } from 'antd';
 
-const codeMessage: { [status: number]: string } = {
+const codeMessage: Record<number, string> = {
   200: '服务器成功返回请求的数据。',
   201: '新建或修改数据成功。',
   202: '一个请求已经进入后台排队（异步任务）。',
@@ -20,7 +20,10 @@ const codeMessage: { [status: number]: string } = {
   504: '网关超时。',
 };
 
-/** 异常处理程序 */
+/**
+ * @zh-CN 异常处理程序
+ * @en-US Exception handler
+ */
 const errorHandler = (error: { response: Response }): Response => {
   const { response } = error;
   if (response && response.status) {
@@ -28,22 +31,25 @@ const errorHandler = (error: { response: Response }): Response => {
     const { status, url } = response;
 
     notification.error({
-      message: `请求错误 ${status}: ${url}`,
+      message: `Request error ${status}: ${url}`,
       description: errorText,
     });
   } else if (!response) {
     notification.error({
-      description: '您的网络发生异常，无法连接服务器',
-      message: '网络异常',
+      description: 'Your network is abnormal and cannot connect to the server',
+      message: 'Network anomaly',
     });
   }
   return response;
 };
 
-/** 配置request请求时的默认参数 */
+/**
+ * @en-US Configure the default parameters for request
+ * @zh-CN 配置request请求时的默认参数
+ */
 const request = extend({
-  errorHandler, // 默认错误处理
-  credentials: 'include', // 默认请求是否带上cookie
+  errorHandler, // default error handling
+  credentials: 'include', // Does the default request bring cookies
 });
 
 export default request;

src/utils/utils.ts

@@ -12,7 +12,7 @@ export const isAntDesignPro = (): boolean => {
   return window.location.hostname === 'preview.pro.ant.design';
 };
 
-// 给官方演示站点用，用于关闭真实开发环境不需要使用的特性
+// For the official demo site, it is used to turn off features that are not needed in the real development environment
 export const isAntDesignProOrDev = (): boolean => {
   const { NODE_ENV } = process.env;
   if (NODE_ENV === 'development') {