From 7e4f03d22373c3652b993b53a67f63b9959077a1 Mon Sep 17 00:00:00 2001
From: Petr Stefan <ptr.stef@gmail.com>
Date: Sat, 11 Nov 2017 15:52:39 +0100
Subject: [PATCH] Translate group description, sidebar & edit form

---
 .../Groups/GroupDetail/GroupDetail.js         | 14 ++++-
 .../forms/EditGroupForm/EditGroupForm.js      |  1 +
 ...Field.js => LocalizedExerciseFormField.js} |  6 +--
 .../LocalizedGroupFormField.js                | 51 +++++++++++++++++++
 .../LocalizedTextsFormField.js                | 33 +++++++-----
 .../widgets/Sidebar/MenuGroup/MenuGroup.js    | 18 +++++--
 6 files changed, 101 insertions(+), 22 deletions(-)
 rename src/components/forms/LocalizedTextsFormField/{LocalizedTextFormField.js => LocalizedExerciseFormField.js} (90%)
 create mode 100644 src/components/forms/LocalizedTextsFormField/LocalizedGroupFormField.js

diff --git a/src/components/Groups/GroupDetail/GroupDetail.js b/src/components/Groups/GroupDetail/GroupDetail.js
index 710a3275d..df879e5a8 100644
--- a/src/components/Groups/GroupDetail/GroupDetail.js
+++ b/src/components/Groups/GroupDetail/GroupDetail.js
@@ -9,7 +9,10 @@ import Box from '../../widgets/Box';
 import SupervisorsList from '../../Users/SupervisorsList';
 import { MaybeSucceededIcon } from '../../icons';
 import GroupTree from '../GroupTree';
-import { getLocalizedName } from '../../../helpers/getLocalizedData';
+import {
+  getLocalizedName,
+  getLocalizedDescription
+} from '../../../helpers/getLocalizedData';
 
 const GroupDetail = ({
   group: {
@@ -43,7 +46,14 @@ const GroupDetail = ({
                   defaultMessage="Group description"
                 />
               }
-              description={<ReactMarkdown source={description} />}
+              description={
+                <ReactMarkdown
+                  source={getLocalizedDescription(
+                    { description, localizedTexts },
+                    locale
+                  )}
+                />
+              }
               type="primary"
               collapsable
               noPadding
diff --git a/src/components/forms/EditGroupForm/EditGroupForm.js b/src/components/forms/EditGroupForm/EditGroupForm.js
index 5187e174e..d82e3686c 100644
--- a/src/components/forms/EditGroupForm/EditGroupForm.js
+++ b/src/components/forms/EditGroupForm/EditGroupForm.js
@@ -86,6 +86,7 @@ const EditGroupForm = ({
       name="localizedTexts"
       localizedTexts={localizedTexts}
       component={LocalizedTextsFormField}
+      isGroup={true}
     />
 
     <Field
diff --git a/src/components/forms/LocalizedTextsFormField/LocalizedTextFormField.js b/src/components/forms/LocalizedTextsFormField/LocalizedExerciseFormField.js
similarity index 90%
rename from src/components/forms/LocalizedTextsFormField/LocalizedTextFormField.js
rename to src/components/forms/LocalizedTextsFormField/LocalizedExerciseFormField.js
index 34e6606d0..4e8d5d6b5 100644
--- a/src/components/forms/LocalizedTextsFormField/LocalizedTextFormField.js
+++ b/src/components/forms/LocalizedTextsFormField/LocalizedExerciseFormField.js
@@ -8,7 +8,7 @@ import {
   TextField
 } from '../Fields';
 
-const LocalizedTextFormField = ({ prefix }) =>
+const LocalizedExerciseFormField = ({ prefix }) =>
   <div>
     <Field
       name={`${prefix}.name`}
@@ -55,8 +55,8 @@ const LocalizedTextFormField = ({ prefix }) =>
     />
   </div>;
 
-LocalizedTextFormField.propTypes = {
+LocalizedExerciseFormField.propTypes = {
   prefix: PropTypes.string.isRequired
 };
 
-export default LocalizedTextFormField;
+export default LocalizedExerciseFormField;
diff --git a/src/components/forms/LocalizedTextsFormField/LocalizedGroupFormField.js b/src/components/forms/LocalizedTextsFormField/LocalizedGroupFormField.js
new file mode 100644
index 000000000..a7b72322e
--- /dev/null
+++ b/src/components/forms/LocalizedTextsFormField/LocalizedGroupFormField.js
@@ -0,0 +1,51 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { FormattedMessage } from 'react-intl';
+import { Field } from 'redux-form';
+import {
+  MarkdownTextAreaField,
+  LanguageSelectField,
+  TextField
+} from '../Fields';
+
+const LocalizedGroupFormField = ({ prefix }) =>
+  <div>
+    <Field
+      name={`${prefix}.name`}
+      component={TextField}
+      label={
+        <FormattedMessage
+          id="app.editGroupForm.localized.name"
+          defaultMessage="Name:"
+        />
+      }
+    />
+
+    <Field
+      name={`${prefix}.locale`}
+      component={LanguageSelectField}
+      label={
+        <FormattedMessage
+          id="app.editGroupForm.localized.locale"
+          defaultMessage="The language:"
+        />
+      }
+    />
+
+    <Field
+      name={`${prefix}.description`}
+      component={MarkdownTextAreaField}
+      label={
+        <FormattedMessage
+          id="app.editGroupForm.description"
+          defaultMessage="Group description:"
+        />
+      }
+    />
+  </div>;
+
+LocalizedGroupFormField.propTypes = {
+  prefix: PropTypes.string.isRequired
+};
+
+export default LocalizedGroupFormField;
diff --git a/src/components/forms/LocalizedTextsFormField/LocalizedTextsFormField.js b/src/components/forms/LocalizedTextsFormField/LocalizedTextsFormField.js
index cce4d5e8b..68f054bcd 100644
--- a/src/components/forms/LocalizedTextsFormField/LocalizedTextsFormField.js
+++ b/src/components/forms/LocalizedTextsFormField/LocalizedTextsFormField.js
@@ -2,45 +2,52 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { TabbedArrayField } from '../Fields';
-import LocalizedTextFormField from './LocalizedTextFormField';
+import LocalizedExerciseFormField from './LocalizedExerciseFormField';
+import LocalizedGroupFormField from './LocalizedGroupFormField';
 
-const LocalizedTextsFormField = ({ localizedTexts = [], ...props }) => (
+const LocalizedTextsFormField = ({
+  localizedTexts = [],
+  isGroup = false,
+  ...props
+}) =>
   <TabbedArrayField
     {...props}
     getTitle={i =>
       localizedTexts && localizedTexts[i] && localizedTexts[i].locale
         ? localizedTexts[i].locale
         : <FormattedMessage
-            id="app.editAssignmentForm.newLocale"
+            id="app.editLocalizedTextForm.newLocale"
             defaultMessage="New language"
           />}
-    ContentComponent={LocalizedTextFormField}
+    ContentComponent={
+      isGroup ? LocalizedGroupFormField : LocalizedExerciseFormField
+    }
     emptyMessage={
       <FormattedMessage
-        id="app.editAssignmentForm.localized.noLanguage"
-        defaultMessage="There is currently no text in any language for this assignment."
+        id="app.editLocalizedTextForm.localized.noLanguage"
+        defaultMessage="There is currently no text in any language."
       />
     }
     addMessage={
       <FormattedMessage
-        id="app.editAssignmentForm.addLanguage"
+        id="app.editLocalizedTextForm.addLanguage"
         defaultMessage="Add language variant"
       />
     }
     removeQuestion={
       <FormattedMessage
-        id="app.editAssignmentForm.localized.reallyRemoveQuestion"
-        defaultMessage="Do you really want to delete the assignmenet in this language?"
+        id="app.editLocalizedTextForm.localized.reallyRemoveQuestion"
+        defaultMessage="Do you really want to delete this localization?"
       />
     }
-    id="localized-assignments"
+    id="localized-texts"
     add
     remove
-  />
-);
+  />;
 
 LocalizedTextsFormField.propTypes = {
-  localizedTexts: PropTypes.array
+  localizedTexts: PropTypes.array,
+  isGroup: PropTypes.bool
 };
 
 export default LocalizedTextsFormField;
diff --git a/src/components/widgets/Sidebar/MenuGroup/MenuGroup.js b/src/components/widgets/Sidebar/MenuGroup/MenuGroup.js
index 095100e49..ce717a189 100644
--- a/src/components/widgets/Sidebar/MenuGroup/MenuGroup.js
+++ b/src/components/widgets/Sidebar/MenuGroup/MenuGroup.js
@@ -1,11 +1,13 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
+import { injectIntl } from 'react-intl';
 import classNames from 'classnames';
 import Icon from 'react-fontawesome';
 import MenuItem from '../MenuItem';
 import LoadingMenuItem from '../LoadingMenuItem';
 import { isLoading } from '../../../../redux/helpers/resourceManager';
+import { getLocalizedName } from '../../../../helpers/getLocalizedData';
 
 class MenuGroup extends Component {
   componentWillMount = () =>
@@ -43,7 +45,8 @@ class MenuGroup extends Component {
       createLink,
       currentPath,
       notifications,
-      forceOpen = false
+      forceOpen = false,
+      intl: { locale }
     } = this.props;
 
     const dropdownStyles = {
@@ -91,7 +94,13 @@ class MenuGroup extends Component {
                 ? <LoadingMenuItem key={key} />
                 : <MenuItem
                     key={key}
-                    title={item.getIn(['data', 'name'])}
+                    title={getLocalizedName(
+                      {
+                        name: item.getIn(['data', 'name']),
+                        localizedTexts: item.getIn(['data', 'localizedTexts'])
+                      },
+                      locale
+                    )}
                     icon="circle-o"
                     currentPath={currentPath}
                     notificationsCount={itemsNotificationsCount(item)}
@@ -112,11 +121,12 @@ MenuGroup.propTypes = {
   currentPath: PropTypes.string,
   forceOpen: PropTypes.bool,
   createLink: PropTypes.func.isRequired,
-  notifications: PropTypes.object
+  notifications: PropTypes.object,
+  intl: PropTypes.shape({ locale: PropTypes.string.isRequired }).isRequired
 };
 
 MenuGroup.contextTypes = {
   isActive: PropTypes.func
 };
 
-export default MenuGroup;
+export default injectIntl(MenuGroup);