possible fix for arm? :P

src/assets/stylesheets/navbar.scss

@@ -52,7 +52,7 @@ $white: #fff;
   justify-content: left;
   padding-left: 4px;
   text-align: center;
-  color: $light-blue;
+  color: $medium-blue;
   background-color: transparent;
   margin-left: 2px;
 }
@@ -113,7 +113,7 @@ $white: #fff;
   justify-content: center;
   align-items: center;
   margin: 0;
-  background-color: $dark-blue;
+  background-color: $medium-blue;
 }
 
 .navbar-settings span {

src/components/NavBar.js

@@ -46,9 +46,14 @@ export default class NavBar extends Component {
     try {
       const message = JSON.parse(event.data);
       if (message.type === "mode") {
-        let mode = JSON.parse(message.data).mode;
-        if (mode === "Idle") {
+        let mode = JSON.parse(message.data).mode.toLowerCase();
+        console.log("Current Mode: " + mode);
+        if (mode === "idle") {
+          setTimeout(() => {
+            if (mode === "idle") {
               this.closeModal("modalOpen_activeArm");
+            }
+          }, 3000);
         } else {
           this.openModal("modalOpen_activeArm");
         }

src/routes/StatisticsRoute.js

@@ -2,10 +2,6 @@ import React, { Component } from "react";
 import NavBar from "../components/NavBar";
 import StatisticsComponent from "../components/StatisticsComponent";
 import "../assets/stylesheets/app.scss";
-import {
-  Provider,
-  KeepAlive,
-} from 'react-keep-alive';
 
 export default class StatisticsRoute extends Component {
   constructor(props) {
@@ -17,11 +13,7 @@ export default class StatisticsRoute extends Component {
     return (
       <div className="container">
         <NavBar socket={this.props.socket} />
-        <Provider>
-          <KeepAlive name="Grafana">
-            <StatisticsComponent socketHandler={this.props.socket} />
-          </KeepAlive>
-        </Provider>
+        <StatisticsComponent socket={this.props.socket} />
       </div>
     );
   }