From bcee2da91fffcca5ac4493e65a1fb0e7d671b356 Mon Sep 17 00:00:00 2001
From: Tudor Stanciu <tudor.stanciu94@gmail.com>
Date: Thu, 24 Dec 2020 02:27:29 +0200
Subject: [PATCH] steps translation

---
 public/locales/en/translations.json                 |  5 +++++
 public/locales/ro/translations.json                 |  5 +++++
 src/components/layout/stepper/ApplicationStepper.js |  6 +++++-
 src/constants/steps.js                              |  6 +++---
 src/index.js                                        | 12 +++++-------
 5 files changed, 23 insertions(+), 11 deletions(-)

diff --git a/public/locales/en/translations.json b/public/locales/en/translations.json
index a9b85d9..90383a1 100644
--- a/public/locales/en/translations.json
+++ b/public/locales/en/translations.json
@@ -12,6 +12,11 @@
     "English": "English",
     "Romanian": "Romanian"
   },
+  "Steps": {
+    "Login": "Login",
+    "Network": "Network",
+    "Settings": "Settings"
+  },
   "Login": {
     "Username": "Username",
     "Password": "Password"
diff --git a/public/locales/ro/translations.json b/public/locales/ro/translations.json
index 2a3987a..f44da64 100644
--- a/public/locales/ro/translations.json
+++ b/public/locales/ro/translations.json
@@ -3,6 +3,11 @@
     "English": "Engleză",
     "Romanian": "Română"
   },
+  "Steps": {
+    "Login": "Autentificare",
+    "Network": "Rețea",
+    "Settings": "Setări"
+  },
   "Login": {
     "Username": "Utilizator",
     "Password": "Parolă"
diff --git a/src/components/layout/stepper/ApplicationStepper.js b/src/components/layout/stepper/ApplicationStepper.js
index 4a7fd67..a1cb099 100644
--- a/src/components/layout/stepper/ApplicationStepper.js
+++ b/src/components/layout/stepper/ApplicationStepper.js
@@ -11,6 +11,7 @@ import {
 import { useLocation, useHistory } from "react-router-dom";
 import CustomStepConnector from "./CustomStepConnector";
 import StepIcon from "./StepIcon";
+import { useTranslation } from "react-i18next";
 
 const styles = () => ({
   stepperCard: {
@@ -29,6 +30,7 @@ const ApplicationStepper = () => {
   const classes = useStyles();
   const location = useLocation();
   const history = useHistory();
+  const { t } = useTranslation();
 
   useEffect(() => {
     const step = steps.find(z => z.route === location.pathname);
@@ -59,7 +61,9 @@ const ApplicationStepper = () => {
               disabled={step.disabled}
               onClick={() => handleStepClick(step)}
             >
-              <StepLabel StepIconComponent={StepIcon}>{step.title}</StepLabel>
+              <StepLabel StepIconComponent={StepIcon}>
+                {t(step.title)}
+              </StepLabel>
             </StepButton>
           </Step>
         ))}
diff --git a/src/constants/steps.js b/src/constants/steps.js
index bcb31a2..7cc158e 100644
--- a/src/constants/steps.js
+++ b/src/constants/steps.js
@@ -3,21 +3,21 @@ import { Router, VpnKey, Settings } from "@material-ui/icons";
 const steps = [
   {
     id: 0,
-    title: "Login",
+    title: "Steps.Login",
     route: "/",
     disabled: false,
     icon: <VpnKey />
   },
   {
     id: 1,
-    title: "Network",
+    title: "Steps.Network",
     route: "/network",
     disabled: false,
     icon: <Router />
   },
   {
     id: 2,
-    title: "Settings",
+    title: "Steps.Settings",
     route: "/settings",
     disabled: false,
     icon: <Settings />
diff --git a/src/index.js b/src/index.js
index 65318d2..495d4ff 100644
--- a/src/index.js
+++ b/src/index.js
@@ -6,12 +6,10 @@ import App from "./components/App";
 import { BrowserRouter as Router } from "react-router-dom";
 
 ReactDOM.render(
-  <React.StrictMode>
-    <Router basename={process.env.PUBLIC_URL || ""}>
-      <Suspense fallback={<div>Loading...</div>}>
-        <App />
-      </Suspense>
-    </Router>
-  </React.StrictMode>,
+  <Router basename={process.env.PUBLIC_URL || ""}>
+    <Suspense fallback={<div>Loading...</div>}>
+      <App />
+    </Suspense>
+  </Router>,
   document.getElementById("root")
 );