Merge branch 'master' of github.com:ONLYOFFICE/CommunityServer-AspNetCore

products/ASC.People/Client/src/components/pages/GroupAction/Section/Body/Form/groupForm.js

@@ -11,6 +11,8 @@ import {
 } from "asc-web-components";
 import submit from "./submit";
 import validate from "./validate";
+import { useTranslation } from 'react-i18next';
+import { department, headOfDepartment, typeUser } from './../../../../../../helpers/customNames';
 
 const generateItems = numItems =>
   Array(numItems)
@@ -22,6 +24,7 @@ const generateItems = numItems =>
 
 const GroupForm = props => {
   const { error, handleSubmit, submitting, initialValues, history } = props;
+  const { t } = useTranslation();
 
   const selectedList = generateItems(100);
   
@@ -35,7 +38,7 @@ const GroupForm = props => {
     <form onSubmit={handleSubmit(submit)}>
       <div>
         <label htmlFor="group-name">
-          <Text.Body as="span" isBold={true}>Department name:</Text.Body>
+          <Text.Body as="span" isBold={true}>{t('CustomDepartmentName', { department })}:</Text.Body>
         </label>
         <div style={{width: "320px"}}>
           <TextInput id="group-name" name="group-name" scale={true} />
@@ -43,11 +46,11 @@ const GroupForm = props => {
       </div>
       <div style={{ marginTop: "16px" }}>
         <label htmlFor="head-selector">
-          <Text.Body as="span" isBold={true}>Head of department:</Text.Body>
+          <Text.Body as="span" isBold={true}>{t('CustomHeadOfDepartment', { headOfDepartment })}:</Text.Body>
         </label>
         <InputBlock
           id="head-selector"
-          value="Add employee"
+          value={t('CustomAddEmployee', { typeUser })}
           iconName="ExpanderDownIcon"
           iconSize={8}
           isIconFill={true}
@@ -64,7 +67,7 @@ const GroupForm = props => {
         </label>
         <InputBlock
           id="employee-selector"
-          value="Add employee"
+          value={t('CustomAddEmployee', { typeUser })}
           iconName="ExpanderDownIcon"
           iconSize={8}
           isIconFill={true}
@@ -87,9 +90,9 @@ const GroupForm = props => {
       </div>
       <div>{error && <strong>{error}</strong>}</div>
       <div style={{ marginTop: "60px" }}>
-        <Button label="Save" primary type="submit" isDisabled={submitting} size="big" />
+        <Button label={t('SaveButton')} primary type="submit" isDisabled={submitting} size="big" />
         <Button
-          label="Cancel"
+          label={t('CancelButton')}
           style={{ marginLeft: "8px" }}
           size="big"
           isDisabled={submitting}

products/ASC.People/Client/src/components/pages/GroupAction/Section/Header/index.js

@@ -3,6 +3,8 @@ import { connect } from 'react-redux';
 import { withRouter } from "react-router";
 import PropTypes from "prop-types";
 import { IconButton, Text } from 'asc-web-components';
+import { useTranslation } from 'react-i18next';
+import { department } from './../../../../../helpers/customNames';
 
 
 const wrapperStyle = {
@@ -16,8 +18,9 @@ const textStyle = {
 
 const SectionHeaderContent = (props) => {
   const {group, history, settings} = props;
+  const { t } = useTranslation();
 
-  const headerText = "New department";
+  const headerText = t('CustomNewDepartment', { department });
 
   return (
     <div style={wrapperStyle}>

products/ASC.People/Client/src/components/pages/GroupAction/i18n.js

@@ -0,0 +1,58 @@
+import i18n from "i18next";
+import Backend from "i18next-xhr-backend";
+import config from "../../../../package.json";
+
+const newInstance = i18n.createInstance();
+
+if (process.env.NODE_ENV === "production") {
+  newInstance
+    .use(Backend)
+    .init({
+      lng: 'en',
+      fallbackLng: "en",
+      debug: true,
+
+      interpolation: {
+        escapeValue: false, // not needed for react as it escapes by default
+        format: function (value, format) {
+          if (format === 'lowercase') return value.toLowerCase();
+          return value;
+        }
+      },
+
+      react: {
+        useSuspense: true
+      },
+      backend: {
+        loadPath: `${config.homepage}/locales/GroupAction/{{lng}}/{{ns}}.json`
+      }
+    });
+} else if (process.env.NODE_ENV === "development") {
+
+  const resources = {
+    en: {
+      translation: require("./locales/en/translation.json")
+    }
+  };
+
+  newInstance.init({
+    resources: resources,
+    lng: 'en',
+    fallbackLng: "en",
+    debug: true,
+
+    interpolation: {
+      escapeValue: false, // not needed for react as it escapes by default
+      format: function (value, format) {
+        if (format === 'lowercase') return value.toLowerCase();
+        return value;
+      }
+    },
+
+    react: {
+      useSuspense: true
+    }
+  });
+}
+
+export default newInstance;

products/ASC.People/Client/src/components/pages/GroupAction/index.js

@@ -3,6 +3,8 @@ import { connect } from "react-redux";
 import { PageLayout } from "asc-web-components";
 import { ArticleHeaderContent, ArticleMainButtonContent, ArticleBodyContent } from '../../Article';
 import { SectionHeaderContent, SectionBodyContent } from './Section';
+import i18n from "./i18n";
+import { I18nextProvider } from "react-i18next";
 
 class GroupAction extends React.Component {
 
@@ -10,13 +12,15 @@ class GroupAction extends React.Component {
     console.log("GroupAction render")
 
     return (
-      <PageLayout
+      <I18nextProvider i18n={i18n}>
+        <PageLayout
           articleHeaderContent={<ArticleHeaderContent />}
           articleMainButtonContent={<ArticleMainButtonContent />}
           articleBodyContent={<ArticleBodyContent />}
           sectionHeaderContent={<SectionHeaderContent />}
           sectionBodyContent={<SectionBodyContent />}
         />
+      </I18nextProvider>
     );
   }
 }

products/ASC.People/Client/src/components/pages/GroupAction/locales/en/translation.json

@@ -0,0 +1,11 @@
+{
+  "SaveButton": "Save",
+  "CancelButton": "Cancel",
+
+
+
+  "CustomHeadOfDepartment": "{{headOfDepartment}}",
+  "CustomAddEmployee": "Add {{typeUser, lowercase}}",
+  "CustomNewDepartment": "New {{department, lowercase}}",
+  "CustomDepartmentName": "{{department}} name"
+}

products/ASC.People/Client/src/components/pages/Home/locales/en/translation.json

@@ -45,7 +45,7 @@
   "CustomTypeUser": "{{typeUser}}",
   "CustomMakeUser": "Make {{typeUser, lowercase}}",
   "CustomMakeGuest": "Make {{typeGuest, lowercase}}",
-  "CustomDepartment": "{{department}}"  ,
+  "CustomDepartment": "{{department}}",
   "CountPerPage": "{{count}} per page",
   "PageOfTotalPage": "{{page}} of {{totalPage}}"
 }

products/ASC.People/Client/src/resourceConfig.json

@@ -97,5 +97,11 @@
       "AboutCompanyTitle",
       "LogoutButton"
     ]
+  },
+  "GroupAction": {
+    "Resource": [
+      "SaveButton",
+      "CancelButton"
+    ]
   }
-}
+}