PLT-7: Refactoring frontend (chunk 3)

- Tutorial components
- Claim components
- Suggestion components

web/react/components/suggestion/at_mention_provider.jsx

@@ -5,6 +5,8 @@ import SuggestionStore from '../../stores/suggestion_store.jsx';
 import UserStore from '../../stores/user_store.jsx';
 import * as Utils from '../../utils/utils.jsx';
 
+import {FormattedMessage} from 'mm-intl';
+
 const MaxUserSuggestions = 40;
 
 class AtMentionSuggestion extends React.Component {
@@ -16,11 +18,21 @@ class AtMentionSuggestion extends React.Component {
         let icon;
         if (item.username === 'all') {
             username = 'all';
-            description = 'Notifies everyone in the team';
+            description = (
+                <FormattedMessage
+                    id='suggestion.mention.all'
+                    defaultMessage='Notifies everyone in the team'
+                />
+            );
             icon = <i className='mention-img fa fa-users fa-2x' />;
         } else if (item.username === 'channel') {
             username = 'channel';
-            description = 'Notifies everyone in the channel';
+            description = (
+                <FormattedMessage
+                    id='suggestion.mention.channel'
+                    defaultMessage='Notifies everyone in the channel'
+                />
+            );
             icon = <i className='mention-img fa fa-users fa-2x' />;
         } else {
             username = item.username;

web/react/components/suggestion/search_suggestion_list.jsx

@@ -3,7 +3,8 @@
 
 import Constants from '../../utils/constants.jsx';
 import SuggestionList from './suggestion_list.jsx';
-import * as Utils from '../../utils/utils.jsx';
+
+import {FormattedMessage} from 'mm-intl';
 
 export default class SearchSuggestionList extends SuggestionList {
     componentDidUpdate(prevProps, prevState) {
@@ -19,9 +20,19 @@ export default class SearchSuggestionList extends SuggestionList {
     renderChannelDivider(type) {
         let text;
         if (type === Constants.OPEN_CHANNEL) {
-            text = 'Public ' + Utils.getChannelTerm(type) + 's';
+            text = (
+                <FormattedMessage
+                    id='suggestion.search.public'
+                    defaultMessage='Public Channels'
+                />
+            );
         } else {
-            text = 'Private ' + Utils.getChannelTerm(type) + 's';
+            text = (
+                <FormattedMessage
+                    id='suggestion.search.private'
+                    defaultMessage='Public Groups'
+                />
+            );
         }
 
         return (