feat(translation): Implement new translation interface

[mehranhatami]

Now we can use this API like this:

import { localize, renderMessage, Message, PluralMessage } from 'redux-i18n';

class AddCollection extends React.Component {
  static contextTypes = {
    t: PropTypes.func.isRequired,
  };

  static propTypes = {
    translateMessage: PropTypes.func.isRequired,
    translatePluralMessage: PropTypes.func.isRequired,
  };

  render() {
    return (
      <React.Fragment>
        <div className={style.Content}>
          <Message text="Collection name" description="The name of a user collection which could have different access levels" />
          <Message text="Collection name : {collectionName}" values={{ collectionName: 'Mehran Collection' }} description="The name of a user collection" />
          <PluralMessage
            texts={[
              'The user was successfully added to the group {group}',
              '{count} users were successfully added to the group {group}',
            ]}
            pluralCondition="count"
            values={{ group: 'Oneflow Group', count: 1 }}
            description="The name of a user collection"
          />
          <PluralMessage
            texts={[
              'The user was successfully added to the group {group}',
              '{count} users were successfully added to the group {group}',
            ]}
            pluralCondition="count"
            values={{ group: 'Oneflow Group', count: 11 }}
            description="The name of a user collection"
          />
          <Field
            name="name"
            label={<Message text="Collection name" description="Input field for the collection name" />}
            placeholder={this.props.translateMessage({
              text: 'Enter collection name',
              description: 'Input field for the placeholder of collection name field in AddCollection page',
            })}
            component={TextField}
            validate={this.validations}
            maxLength={50}
          />
        </div>
        <div className={style.Content}>
          <Field
            name="description"
            label={this.context.t('Description')}
            placeholder={this.props.translatePluralMessage({
              texts: ['Enter a description for this collection', 'Enter a description for these collections'],
              pluralCondition: 'count',
              values: {
                count: 11,
              },
              description: 'Each collection has a description and this message is to ask the user for one',
            })}
            component={TextArea}
            validateFields={[]}
            maxLength={300}
          />
        </div>
      </React.Fragment>
    );
  }
}

export default addEntityForm(localize()(AddCollection));