From 521fe872daaa6fab5aa9d3372d3b4adac905c7d1 Mon Sep 17 00:00:00 2001
From: Chris L <stylesuxx@gmail.com>
Date: Sun, 7 Mar 2021 02:44:35 +0100
Subject: [PATCH] Added missing translations for ECS settings. Resolves #1

---
 src/Components/CommonSettings/index.jsx | 10 ++--
 src/Components/Log/index.jsx            |  4 +-
 src/Components/Statusbar/index.jsx      | 52 ++++++++++++++++++++
 src/Containers/App/index.jsx            | 65 +++----------------------
 src/index.jsx                           |  7 +--
 src/translations/en/common.json         |  5 ++
 src/utils/FourWay.js                    |  2 +-
 7 files changed, 75 insertions(+), 70 deletions(-)
 create mode 100644 src/Components/Statusbar/index.jsx

diff --git a/src/Components/CommonSettings/index.jsx b/src/Components/CommonSettings/index.jsx
index c3171d29a..d0555fe88 100644
--- a/src/Components/CommonSettings/index.jsx
+++ b/src/Components/CommonSettings/index.jsx
@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import {
-  useTranslation, 
+  useTranslation,
 } from 'react-i18next';
 
 import {
@@ -26,12 +26,12 @@ function CommonSettings({
   escs,
   onSettingsUpdate,
 }) {
+  const { t } = useTranslation('common');
+
   if(escs.length === 0) {
     return null;
   }
 
-  const { t } = useTranslation('common');
-
   const master = getMaster(escs);
   //const availableSettings = master.settings;
   const allSettings = getAllSettings(escs);
@@ -50,7 +50,7 @@ function CommonSettings({
 
   function handleCheckboxChange(e) {
     const {
-      name, checked, 
+      name, checked,
     } = e.target;
     currentSettings[name] = checked ? 1 : 0;
 
@@ -59,7 +59,7 @@ function CommonSettings({
 
   function handleSelectChange(e) {
     const {
-      name, value, 
+      name, value,
     } = e.target;
     currentSettings[name] = value;
 
diff --git a/src/Components/Log/index.jsx b/src/Components/Log/index.jsx
index 897cf5995..ef462084c 100644
--- a/src/Components/Log/index.jsx
+++ b/src/Components/Log/index.jsx
@@ -2,10 +2,10 @@ import PropTypes from 'prop-types';
 import React from 'react';
 
 import {
-  useTranslation, 
+  useTranslation,
 } from 'react-i18next';
 import {
-  useState, 
+  useState,
 } from 'react';
 import './style.css';
 
diff --git a/src/Components/Statusbar/index.jsx b/src/Components/Statusbar/index.jsx
new file mode 100644
index 000000000..a4f62fb43
--- /dev/null
+++ b/src/Components/Statusbar/index.jsx
@@ -0,0 +1,52 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+import {
+  useTranslation,
+} from 'react-i18next';
+
+
+function Statusbar({
+  packetErrors,
+  version,
+}) {
+  const { t } = useTranslation('common');
+
+  return (
+    <div id="status-bar">
+      <div>
+        <span>
+          {t('statusbarPortUtilization')}
+        </span>
+
+        <span className="port_usage_down">
+          D: 0%
+        </span>
+
+        <span className="port_usage_up">
+          U: 0%
+        </span>
+      </div>
+
+      <div>
+        <span>
+          {t('statusbarPacketError')}
+        </span>
+
+        <span className="packet-error">
+          {packetErrors}
+        </span>
+      </div>
+
+      <div className="version">
+        {version}
+      </div>
+    </div>
+  );
+}
+
+Statusbar.propTypes = {
+  packetErrors: PropTypes.number.isRequired,
+  version: PropTypes.string.isRequired,
+};
+
+export default Statusbar;
diff --git a/src/Containers/App/index.jsx b/src/Containers/App/index.jsx
index f1145504d..cae6f7bdd 100644
--- a/src/Containers/App/index.jsx
+++ b/src/Containers/App/index.jsx
@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types';
 import React, {
   Component,
 } from 'react';
@@ -9,6 +10,7 @@ import PortPicker from '../../Components/PortPicker';
 import Log from '../../Components/Log';
 import Buttonbar from '../../Components/Buttonbar';
 import FirmwareSelector from '../../Components/FirmwareSelector';
+import Statusbar from '../../Components/Statusbar';
 
 import Serial from '../../utils/Serial';
 import {
@@ -726,69 +728,14 @@ class App extends Component {
             />
           </div>
 
-          {/*
-          <div className="tab_container">
-            <div id="tabs">
-              <ul className="mode-disconnected">
-                <li className="tab_landing">
-                  <a
-                    href="#"
-                    i18n="tabLanding"
-                    className="tabicon ic_welcome"
-                    i18n_title="tabLanding">
-                  </a>
-                </li>
-              </ul>
-              <ul className="mode-connected">
-                <li className="tab_esc">
-                  <a
-                    href="#"
-                    i18n="tabESC"
-                    className="tabicon ic_cli"
-                    i18n_title="tabESC"></a>
-                </li>
-              </ul>
-            </div>
-
-            <div className="clear-both"></div>
-          </div>
-          */}
-
           <div id="content">
             <MainContent />
           </div>
 
-          <div id="status-bar">
-            <div>
-              <span i18n="statusbarPortUtilization" />
-
-              <span className="port_usage_down">
-                D: 0%
-              </span>
-
-              <span className="port_usage_up">
-                U: 0%
-              </span>
-            </div>
-
-            <div>
-              <span i18n="statusbarPacketError" />
-
-              <span className="packet-error">
-                {packetErrors}
-              </span>
-            </div>
-
-            <div className="version">
-              {version}
-            </div>
-          </div>
-
-          <div id="cache">
-            <div className="data-loading">
-              <p i18n="waitingForData" />
-            </div>
-          </div>
+          <Statusbar
+            packetErrors={packetErrors}
+            version={version}
+          />
         </div>
       </div>
     );
diff --git a/src/index.jsx b/src/index.jsx
index 11e877d80..6f52e14ce 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -31,9 +31,10 @@ ReactDOM.render(
             Bluejay ESC Configurator
           </title>
 
-          <description>
-            Flash your BLHELI_S ESC&apos;s with Bluejay directly from an up to date browser supporting the Web Serial APi.
-          </description>
+          <meta
+            content="Flash your BLHELI_S ESC&apos;s with Bluejay directly from an up to date browser supporting the Web Serial APi."
+            name="description"
+          />
         </Helmet>
 
         <App />
diff --git a/src/translations/en/common.json b/src/translations/en/common.json
index 5c0444566..50fce1448 100644
--- a/src/translations/en/common.json
+++ b/src/translations/en/common.json
@@ -21,6 +21,11 @@
   "escBeaconStrength": "Beacon Strength",
   "escStartupBeep": "Staartup Beep",
   "escDithering": "Dithering",
+  "escMotorDirection": "Motor Direction",
+  "escPPMMinThrottle": "PPM Min Throttle",
+  "escPPMMaxThrottle": "PPM Max Throttle",
+  "statusbarPortUtilization": "Port utilization:",
+  "statusbarPacketError": "Packet error:",
   "_RPM Power Protection (Rampup)": "RPM Power Protection (Rampup)",
   "_Minimum Startup Power (Boost)": "Minimum Startup Power (Boost)",
   "_Maximum Startup Power (Protection)": "Maximum Startup Power (Protection)",
diff --git a/src/utils/FourWay.js b/src/utils/FourWay.js
index 71d5fe6d1..8e9a0386b 100644
--- a/src/utils/FourWay.js
+++ b/src/utils/FourWay.js
@@ -293,7 +293,7 @@ class FourWay {
     });
   }
 
-  sendMessagePromised(command, params = [0], address = 0, timeout = 5000) {
+  sendMessagePromised(command, params = [0], address = 0) {
     const self = this;
 
     const process = async (resolve) => {