BACKLOG-12055: upgrade react-i18next and delete i18n project

README.md

@@ -33,7 +33,6 @@ This project is composed of (click on the link for there documentation):
 
 - [apollo-dx - 🚀 - Provides an apollo-client configured to connect on DX graphql API](./packages/apollo-dx)
 - [react-apollo - 🚀 - Provides helpers methods to manipulate DX nodes, based on graphQL API](./packages/react-apollo)
-- [i18next - 🌐 - Provides an i18next configuration](./packages/i18next)
 - [react-router - ✨ - A router with multiple outlets](./packages/react-router)
 - [redux - 💩 - DEPRECATED no one use it](./packages/redux)
 
@@ -95,8 +94,8 @@ Modules can also be built independently by going to packages subfolder, and use
 
 ### Publish
 
-When you make changes to javascript-components, a new version is built and published automatically. Releases and 
-publish are done thanks to [auto](https://intuit.github.io/auto/). Version are incremented according to 
+When you make changes to javascript-components, a new version is built and published automatically. Releases and
+publish are done thanks to [auto](https://intuit.github.io/auto/). Version are incremented according to
 [PR labels](https://intuit.github.io/auto/pages/autorc.html#labels).
 
 

packages/design-system-kit/package.json

@@ -26,7 +26,6 @@
         "classnames": "^2.2.6",
         "lodash": "^4.17.13",
         "prop-types": "^15.6.2",
-        "react-i18next": "^7.6.1",
         "react-number-format": "^4.2.0"
     }
 }

packages/design-system-kit/src/components/LeftNavigation/BurgerMenuButton.jsx

@@ -1,6 +1,5 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-import {translate} from 'react-i18next';
 import {Tooltip, withStyles} from '@material-ui/core';
 import {compose} from 'recompose';
 import classNames from 'classnames';
@@ -17,7 +16,7 @@ const styles = () => ({
     }
 });
 
-export const BurgerMenuButton = ({classes, isDrawerOpen, t}) => {
+export const BurgerMenuButton = ({classes, isDrawerOpen, title}) => {
     function openMenu() {
         const clickEvent = window.top.document.createEvent('MouseEvents');
         clickEvent.initEvent('click', true, true);
@@ -33,7 +32,7 @@ export const BurgerMenuButton = ({classes, isDrawerOpen, t}) => {
     }
 
     return (
-        <Tooltip title={t('label.tooltip.burgerMenu')}
+        <Tooltip title={title}
                  placement="right"
         >
             <div className={classNames(classes.menuButton)}
@@ -46,14 +45,13 @@ export const BurgerMenuButton = ({classes, isDrawerOpen, t}) => {
 BurgerMenuButton.propTypes = {
     isDrawerOpen: PropTypes.bool,
     classes: PropTypes.object.isRequired,
-    t: PropTypes.func.isRequired
+    title: PropTypes.string.isRequired
 };
 
 BurgerMenuButton.defaultProps = {
     isDrawerOpen: false
 };
 
 export default compose(
-    translate('design-system-kit'),
     withStyles(styles, {name: 'DxBurgerMenuButton'})
 )(BurgerMenuButton);

packages/design-system-kit/src/components/LeftNavigation/LeftDrawerContent/LeftDrawerListItems.jsx

@@ -3,7 +3,6 @@ import {List, ListItem, Typography, withStyles} from '@material-ui/core';
 import {ChevronRight, ExpandMore} from '@material-ui/icons';
 import React from 'react';
 import {lodash as _} from 'lodash';
-import {translate} from 'react-i18next';
 import {DisplayActions, toIconComponent} from '@jahia/react-material';
 import {compose} from 'recompose';
 
@@ -16,7 +15,7 @@ const styles = theme => ({
     }
 });
 
-export const LeftDrawerListItems = ({context, actionPath, classes, t}) => (
+export const LeftDrawerListItems = ({context, actionPath, classes}) => (
     <DisplayActions target={context.menu}
                     context={{...context.originalContext, parent: context}}
                     render={actionProps => {
@@ -48,15 +47,15 @@ export const LeftDrawerListItems = ({context, actionPath, classes, t}) => (
                                     {icon}
                                     &nbsp;
                                     <Typography color="textPrimary">
-                                        {t(actionContext.buttonLabel)}
+                                        {actionContext.buttonLabel}
                                     </Typography>
                                 </ListItem>
                                 <List disablePadding classes={{root: classes.nested}}>
                                     {actionContext.menu && actionContext.open &&
                                     <LeftDrawerListItems context={actionContext}
                                                          actionPath={actionPath + '/' + actionContext.key}
                                                          classes={classes}
-                                                         t={t}/>}
+                                                         />}
                                 </List>
                             </React.Fragment>
                         );
@@ -66,11 +65,9 @@ export const LeftDrawerListItems = ({context, actionPath, classes, t}) => (
 LeftDrawerListItems.propTypes = {
     actionPath: PropTypes.string.isRequired,
     context: PropTypes.object.isRequired,
-    classes: PropTypes.object.isRequired,
-    t: PropTypes.func.isRequired
+    classes: PropTypes.object.isRequired
 };
 
 export default compose(
-    translate(),
     withStyles(styles)
 )(LeftDrawerListItems);

packages/design-system-kit/src/components/LeftNavigation/LeftMenuItem.jsx

@@ -2,7 +2,6 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import {Badge, Button, Typography, withStyles} from '@material-ui/core';
 import {compose} from 'recompose';
-import {translate} from 'react-i18next';
 import {toIconComponent} from '@jahia/react-material';
 
 const styles = theme => ({
@@ -46,7 +45,7 @@ const styles = theme => ({
     }
 });
 
-export const LeftMenuItem = ({classes, t, drawer, context}) => {
+export const LeftMenuItem = ({classes, drawer, context}) => {
     const {onClick, buttonLabel, buttonIcon, badge} = context;
 
     let icon = toIconComponent(buttonIcon, drawer ? {classes: {root: classes.colorOpen}} : {classes: {root: classes.colorClosed}});
@@ -57,7 +56,7 @@ export const LeftMenuItem = ({classes, t, drawer, context}) => {
             <Typography className={drawer ? classes.typographyIcon : classes.typographyIconLight}
                         data-sel-role="left-menu-item-text"
             >
-                {t(buttonLabel)}
+                {buttonLabel}
             </Typography>
         </React.Fragment>
     );
@@ -81,11 +80,9 @@ LeftMenuItem.propTypes = {
     context: PropTypes.object.isRequired,
     // eslint-disable-next-line react/boolean-prop-naming
     drawer: PropTypes.bool.isRequired,
-    classes: PropTypes.object.isRequired,
-    t: PropTypes.func.isRequired
+    classes: PropTypes.object.isRequired
 };
 
 export default compose(
-    translate(),
     withStyles(styles, {withTheme: true})
 )(LeftMenuItem);

packages/design-system-kit/src/components/LeftNavigation/LeftNavigation.jsx

@@ -57,7 +57,7 @@ const styles = theme => ({
     }
 });
 
-export const LeftNavigation = ({context, classes, actionsTarget, secondaryActionsTarget, drawer}) => {
+export const LeftNavigation = ({context, classes, actionsTarget, secondaryActionsTarget, drawer, burgerIconTitle}) => {
     let actionContext = {
         ...context,
         drawer
@@ -71,7 +71,7 @@ export const LeftNavigation = ({context, classes, actionsTarget, secondaryAction
         >
             <List className={classes.list} component="nav">
                 <ListItem button className={classes.menuBurger}>
-                    <BurgerMenuButton isDrawerOpen={drawer.drawerOpen}/>
+                    <BurgerMenuButton title={burgerIconTitle} isDrawerOpen={drawer.drawerOpen}/>
                 </ListItem>
                 <DisplayActions target={actionsTarget}
                                 context={actionContext}
@@ -110,6 +110,7 @@ LeftNavigation.propTypes = {
     secondaryActionsTarget: PropTypes.string.isRequired,
     context: PropTypes.object.isRequired,
     drawer: PropTypes.object.isRequired,
+    burgerIconTitle: PropTypes.string.isRequired,
     classes: PropTypes.object.isRequired
 };