Migrate react-i18next translate components

scm-ui/ui-webapp/src/containers/App.tsx

@@ -1,10 +1,9 @@
 import React, { Component } from "react";
 import Main from "./Main";
 import { connect } from "react-redux";
-import { translate } from "react-i18next";
+import { WithTranslation, withTranslation } from "react-i18next";
 import { withRouter } from "react-router-dom";
 import { fetchMe, getFetchMeFailure, getMe, isAuthenticated, isFetchMePending } from "../modules/auth";
-
 import { ErrorPage, Footer, Header, Loading, PrimaryNavigation } from "@scm-manager/ui-components";
 import { Links, Me } from "@scm-manager/ui-types";
 import {
@@ -14,7 +13,7 @@ import {
   isFetchIndexResourcesPending
 } from "../modules/indexResource";
 
-type Props = {
+type Props = WithTranslation & {
   me: Me;
   authenticated: boolean;
   error: Error;
@@ -24,9 +23,6 @@ type Props = {
 
   // dispatcher functions
   fetchMe: (link: string) => void;
-
-  // context props
-  t: (p: string) => string;
 };
 
 class App extends Component<Props> {
@@ -86,5 +82,5 @@ export default withRouter(
   connect(
     mapStateToProps,
     mapDispatchToProps
-  )(translate("commons")(App))
+  )(withTranslation("commons")(App))
 );

scm-ui/ui-webapp/src/containers/ChangeUserPassword.tsx

@@ -6,13 +6,12 @@ import {
   PasswordConfirmation,
   SubmitButton
 } from "@scm-manager/ui-components";
-import { translate } from "react-i18next";
+import { WithTranslation, withTranslation } from "react-i18next";
 import { Me } from "@scm-manager/ui-types";
 import { changePassword } from "../modules/changePassword";
 
-type Props = {
+type Props = WithTranslation & {
   me: Me;
-  t: (p: string) => string;
 };
 
 type State = {
@@ -150,4 +149,4 @@ class ChangeUserPassword extends React.Component<Props, State> {
   };
 }
 
-export default translate("commons")(ChangeUserPassword);
+export default withTranslation("commons")(ChangeUserPassword);

scm-ui/ui-webapp/src/containers/Index.tsx

@@ -1,9 +1,8 @@
 import React, { Component } from "react";
 import App from "./App";
 import { connect } from "react-redux";
-import { translate } from "react-i18next";
+import { WithTranslation, withTranslation } from "react-i18next";
 import { withRouter } from "react-router-dom";
-
 import { Loading, ErrorBoundary } from "@scm-manager/ui-components";
 import {
   fetchIndexResources,
@@ -16,16 +15,13 @@ import { IndexResources } from "@scm-manager/ui-types";
 import ScrollToTop from "./ScrollToTop";
 import IndexErrorPage from "./IndexErrorPage";
 
-type Props = {
+type Props = WithTranslation & {
   error: Error;
   loading: boolean;
   indexResources: IndexResources;
 
   // dispatcher functions
   fetchIndexResources: () => void;
-
-  // context props
-  t: (p: string) => string;
 };
 
 type State = {
@@ -93,5 +89,5 @@ export default withRouter(
   connect(
     mapStateToProps,
     mapDispatchToProps
-  )(translate("commons")(Index))
+  )(withTranslation("commons")(Index))
 );

scm-ui/ui-webapp/src/containers/IndexErrorPage.tsx

@@ -1,10 +1,9 @@
 import React from "react";
-import { translate, TFunction } from "react-i18next";
+import { withTranslation, WithTranslation } from "react-i18next";
 import { ErrorPage } from "@scm-manager/ui-components";
 
-type Props = {
+type Props = WithTranslation & {
   error: Error;
-  t: TFunction;
 };
 
 class IndexErrorPage extends React.Component<Props> {
@@ -14,4 +13,4 @@ class IndexErrorPage extends React.Component<Props> {
   }
 }
 
-export default translate("commons")(IndexErrorPage);
+export default withTranslation("commons")(IndexErrorPage);

scm-ui/ui-webapp/src/containers/Login.tsx

@@ -2,7 +2,6 @@ import React from "react";
 import { connect } from "react-redux";
 import { Redirect, withRouter } from "react-router-dom";
 import { compose } from "redux";
-import { translate } from "react-i18next";
 import styled from "styled-components";
 import { getLoginFailure, isAuthenticated, isLoginPending, login } from "../modules/auth";
 import { getLoginInfoLink, getLoginLink } from "../modules/indexResource";
@@ -19,7 +18,6 @@ type Props = {
   login: (link: string, username: string, password: string) => void;
 
   // context props
-  t: (p: string) => string;
   from: any;
   location: any;
 };

scm-ui/ui-webapp/src/containers/Logout.tsx

@@ -1,13 +1,13 @@
 import React from "react";
 import { connect } from "react-redux";
-import { translate } from "react-i18next";
+import { WithTranslation, withTranslation } from "react-i18next";
 import { Redirect } from "react-router-dom";
 
 import { logout, isAuthenticated, isLogoutPending, getLogoutFailure, isRedirecting } from "../modules/auth";
 import { Loading, ErrorPage } from "@scm-manager/ui-components";
 import { getLogoutLink } from "../modules/indexResource";
 
-type Props = {
+type Props = WithTranslation & {
   authenticated: boolean;
   loading: boolean;
   redirecting: boolean;
@@ -16,9 +16,6 @@ type Props = {
 
   // dispatcher functions
   logout: (link: string) => void;
-
-  // context props
-  t: (p: string) => string;
 };
 
 class Logout extends React.Component<Props> {
@@ -62,4 +59,4 @@ const mapDispatchToProps = dispatch => {
 export default connect(
   mapStateToProps,
   mapDispatchToProps
-)(translate("commons")(Logout));
+)(withTranslation("commons")(Logout));

scm-ui/ui-webapp/src/containers/Profile.tsx

@@ -1,21 +1,19 @@
 import React from "react";
-
 import { Route, withRouter } from "react-router-dom";
 import { getMe } from "../modules/auth";
 import { compose } from "redux";
 import { connect } from "react-redux";
-import { translate } from "react-i18next";
+import { WithTranslation, withTranslation } from "react-i18next";
 import { Me } from "@scm-manager/ui-types";
 import { ErrorPage, Page, Navigation, SubNavigation, Section, NavLink } from "@scm-manager/ui-components";
 import ChangeUserPassword from "./ChangeUserPassword";
 import ProfileInfo from "./ProfileInfo";
 import { ExtensionPoint } from "@scm-manager/ui-extensions";
 
-type Props = {
+type Props = WithTranslation & {
   me: Me;
 
   // Context props
-  t: (p: string) => string;
   match: any;
 };
 type State = {};
@@ -87,7 +85,7 @@ const mapStateToProps = state => {
 };
 
 export default compose(
-  translate("commons"),
+  withTranslation("commons"),
   connect(mapStateToProps),
   withRouter
 )(Profile);

scm-ui/ui-webapp/src/containers/ProfileInfo.tsx

@@ -1,13 +1,10 @@
 import React from "react";
-import { translate } from "react-i18next";
+import { WithTranslation, withTranslation } from "react-i18next";
 import { Me } from "@scm-manager/ui-types";
 import { MailLink, AvatarWrapper, AvatarImage } from "@scm-manager/ui-components";
 
-type Props = {
+type Props = WithTranslation & {
   me: Me;
-
-  // Context props
-  t: (p: string) => string;
 };
 
 class ProfileInfo extends React.Component<Props> {
@@ -69,4 +66,4 @@ class ProfileInfo extends React.Component<Props> {
   }
 }
 
-export default translate("commons")(ProfileInfo);
+export default withTranslation("commons")(ProfileInfo);