Merge pull request #13829 from yangfei4913438/yangfei/translate-user-list

Fixed the translation problem of zh-Hans on the user list page.

packages/core/admin/admin/src/pages/SettingsPage/pages/Users/ListPage/DynamicTable/TableRows/index.js

@@ -63,7 +63,7 @@ const TableRows = ({
               return (
                 <Td key={key}>
                   {typeof cellFormatter === 'function' ? (
-                    cellFormatter(data, { key, name, ...rest })
+                    cellFormatter(data, { key, name, formatMessage, ...rest })
                   ) : (
                     <Typography textColor="neutral800">{data[name] || '-'}</Typography>
                   )}

packages/core/admin/admin/src/pages/SettingsPage/pages/Users/ListPage/utils/tableHeaders.js

@@ -24,9 +24,18 @@ const tableHeaders = [
     name: 'roles',
     metadatas: { label: 'Roles', sortable: false },
     /* eslint-disable react/prop-types */
-    cellFormatter: ({ roles }) => {
+    cellFormatter: ({ roles }, { formatMessage }) => {
       return (
-        <Typography textColor="neutral800">{roles.map(role => role.name).join(',\n')}</Typography>
+        <Typography textColor="neutral800">
+          {roles
+            .map(role =>
+              formatMessage({
+                id: `global.${role.code}`,
+                defaultMessage: role.name,
+              })
+            )
+            .join(',\n')}
+        </Typography>
       );
     },
     /* eslint-enable react/prop-types */
@@ -41,11 +50,16 @@ const tableHeaders = [
     name: 'isActive',
     metadatas: { label: 'User status', sortable: false },
     // eslint-disable-next-line react/prop-types
-    cellFormatter: ({ isActive }) => {
+    cellFormatter: ({ isActive }, { formatMessage }) => {
       return (
         <Flex>
           <Status isActive={isActive} variant={isActive ? 'success' : 'danger'} />
-          <Typography textColor="neutral800">{isActive ? 'Active' : 'Inactive'}</Typography>
+          <Typography textColor="neutral800">
+            {formatMessage({
+              id: isActive ? 'global.active' : 'global.inactive',
+              defaultMessage: isActive ? 'Active' : 'Inactive',
+            })}
+          </Typography>
         </Flex>
       );
     },

packages/core/admin/admin/src/pages/SettingsPage/pages/Users/components/SelectRoles/index.js

@@ -73,7 +73,10 @@ const SelectRoles = ({ disabled, error, onChange, value }) => {
       {(data || []).map(role => {
         return (
           <Option key={role.id} value={role.id}>
-            {role.name}
+            {formatMessage({
+              id: `global.${role.code}`,
+              defaultMessage: role.name,
+            })}
           </Option>
         );
       })}

packages/core/admin/admin/src/translations/en.json

@@ -3,6 +3,7 @@
   "Auth.components.Oops.text": "Your account has been suspended.",
   "Auth.components.Oops.text.admin": "If this is a mistake, please contact your administrator.",
   "Auth.components.Oops.title": "Oops...",
+  "Auth.form.active.label": "Active",
   "Auth.form.button.forgot-password": "Send Email",
   "Auth.form.button.go-home": "GO BACK HOME",
   "Auth.form.button.login": "Login",
@@ -686,6 +687,8 @@
   "form.button.done": "Done",
   "global.search": "Search",
   "global.actions": "Actions",
+  "global.active": "Active",
+  "global.inactive": "Inactive",
   "global.back": "Back",
   "global.cancel": "Cancel",
   "global.change-password": "Change password",
@@ -731,6 +734,15 @@
   "global.select": "Select",
   "global.select-all-entries": "Select all entries",
   "global.settings": "Settings",
+  "global.strapi-super-admin": "Super Admin",
+  "global.strapi-editor": "Editor",
+  "global.strapi-author": "Author",
+  "global.table.header.email": "Email",
+  "global.table.header.firstname": "Firstname",
+  "global.table.header.isActive": "User status",
+  "global.table.header.lastname": "Lastname",
+  "global.table.header.roles": "Roles",
+  "global.table.header.username": "Username",
   "global.type": "Type",
   "global.users": "Users",
   "notification.contentType.relations.conflict": "Content type has conflicting relations",

packages/core/admin/admin/src/translations/zh-Hans.json

@@ -3,6 +3,7 @@
   "Auth.components.Oops.text": "你的帐号已经被停用。",
   "Auth.components.Oops.text.admin": "如果这是个错误，请联系你的管理员。",
   "Auth.components.Oops.title": "哎呀...",
+  "Auth.form.active.label": "激活",
   "Auth.form.button.forgot-password": "发送电子邮件",
   "Auth.form.button.go-home": "回到首页",
   "Auth.form.button.login": "登录",
@@ -613,6 +614,8 @@
   "content-type-builder.plugin.name": "模型构建器",
   "form.button.done": "完成",
   "global.search": "搜索",
+  "global.active": "已激活",
+  "global.inactive": "未激活",
   "global.back": "返回",
   "global.cancel": "取消",
   "global.change-password": "修改密码",
@@ -650,6 +653,15 @@
   "global.roles": "角色列表",
   "global.save": "保存",
   "global.settings": "设置",
+  "global.strapi-super-admin": "超级管理员",
+  "global.strapi-editor": "编辑",
+  "global.strapi-author": "作者",
+  "global.table.header.email": "电子邮件",
+  "global.table.header.firstname": "名字",
+  "global.table.header.isActive": "是否激活",
+  "global.table.header.lastname": "姓氏",
+  "global.table.header.roles": "用户角色",
+  "global.table.header.username": "用户名",
   "global.users": "用户列表",
   "global.type": "类型",
   "notification.contentType.relations.conflict": "内容类型有关联冲突",

packages/core/helper-plugin/lib/src/components/DynamicTable/TableHead/index.js

@@ -44,11 +44,16 @@ const TableHead = ({
         {headers.map(({ name, metadatas: { sortable: isSortable, label } }) => {
           const isSorted = sortBy === name;
           const isUp = sortOrder === 'ASC';
+
+          const intlLabel = formatMessage({
+            id: `global.table.header.${name}`,
+            defaultMessage: label,
+          });
+
           const sortLabel = formatMessage(
             { id: 'components.TableHeader.sort', defaultMessage: 'Sort on {label}' },
-            { label }
+            { label: intlLabel }
           );
-          const intlLabel = formatMessage({ id: label || name, defaultMessage: label || name });
 
           const handleClickSort = (shouldAllowClick = true) => {
             if (isSortable && shouldAllowClick) {
@@ -65,15 +70,13 @@ const TableHead = ({
             <Th
               key={name}
               action={
-                isSorted ? (
+                isSorted && (
                   <IconButton
                     label={sortLabel}
                     onClick={handleClickSort}
-                    icon={isSorted ? <SortIcon isUp={isUp} /> : undefined}
+                    icon={isSorted && <SortIcon isUp={isUp} />}
                     noBorder
                   />
-                ) : (
-                  undefined
                 )
               }
             >