From 2078023ad7a803d41192703808cc5adce5e8d628 Mon Sep 17 00:00:00 2001
From: John Wu <76966357+jwu-fisker@users.noreply.github.com>
Date: Wed, 16 Jun 2021 15:56:36 -0700
Subject: [PATCH] Fix car command control (#54)

Update dashboard screen
---
 .../App/__snapshots__/App.test.js.snap        | 144 +++++++-----------
 src/components/Cars/SendCommand/index.jsx     |  25 ---
 src/components/Dashboard/index.jsx            |  44 ++++--
 3 files changed, 91 insertions(+), 122 deletions(-)

diff --git a/src/components/App/__snapshots__/App.test.js.snap b/src/components/App/__snapshots__/App.test.js.snap
index ab33c1a..713340c 100644
--- a/src/components/App/__snapshots__/App.test.js.snap
+++ b/src/components/App/__snapshots__/App.test.js.snap
@@ -1693,24 +1693,68 @@ exports[`App Route /dashboard authenticated 1`] = `
             class="makeStyles-paper-759"
           >
             <div
-              class="makeStyles-embeddedWrapper-788"
+              class="MuiGrid-root makeStyles-root-770 MuiGrid-container MuiGrid-spacing-xs-2"
             >
-              <iframe
-                frameborder="0"
-                src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=5s&panelId=6"
-                style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; width: 100%; height: 100%;"
-                title="Vehicle Connected"
-              />
+              <div
+                class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
+              >
+                <div
+                  class="makeStyles-embeddedWrapper-788"
+                >
+                  <iframe
+                    frameborder="0"
+                    src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=5s&panelId=6"
+                    style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; width: 100%; height: 100%;"
+                    title="Vehicle Connected"
+                  />
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
+              >
+                <div
+                  class="makeStyles-embeddedWrapper-788"
+                >
+                  <iframe
+                    frameborder="0"
+                    src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=30s&from=1623869272751&to=1623880072751&panelId=12"
+                    style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; width: 100%; height: 100%;"
+                    title="Signals Time Series"
+                  />
+                </div>
+              </div>
             </div>
             <div
-              class="makeStyles-embeddedWrapper-788"
+              class="MuiGrid-root makeStyles-root-770 MuiGrid-container MuiGrid-spacing-xs-2"
             >
-              <iframe
-                frameborder="0"
-                src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=5s&panelId=2"
-                style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; width: 100%; height: 100%;"
-                title="Vehicle Signals"
-              />
+              <div
+                class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
+              >
+                <div
+                  class="makeStyles-embeddedWrapper-788"
+                >
+                  <iframe
+                    frameborder="0"
+                    src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=30s&from=1623869351185&to=1623880151186&panelId=14"
+                    style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; width: 100%; height: 100%;"
+                    title="Total Signals"
+                  />
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
+              >
+                <div
+                  class="makeStyles-embeddedWrapper-788"
+                >
+                  <iframe
+                    frameborder="0"
+                    src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=5s&panelId=2"
+                    style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; width: 100%; height: 100%;"
+                    title="Vehicle Signals"
+                  />
+                </div>
+              </div>
             </div>
             <a
               aria-disabled="false"
@@ -5711,78 +5755,6 @@ exports[`App Route /vehicles-command authenticated 1`] = `
                         </fieldset>
                       </div>
                     </div>
-                    <div
-                      class="MuiFormControl-root makeStyles-formControlInline-624"
-                    >
-                      <label
-                        class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-filled"
-                        data-shrink="true"
-                        for="send-parameter"
-                        style="background-color: White;"
-                      >
-                        Parameter
-                      </label>
-                      <div
-                        class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
-                      >
-                        <select
-                          aria-invalid="false"
-                          class="MuiSelect-root MuiSelect-select MuiSelect-outlined MuiInputBase-input MuiOutlinedInput-input"
-                          id="send-parameter"
-                          name="send-parameter"
-                        >
-                          <option
-                            value="right_front"
-                          >
-                            Front right door
-                          </option>
-                          <option
-                            value="left_front"
-                          >
-                            Front left door
-                          </option>
-                          <option
-                            value="right_rear"
-                          >
-                            Rear right door
-                          </option>
-                          <option
-                            value="left_rear"
-                          >
-                            Rear left door
-                          </option>
-                          <option
-                            value="trunk"
-                          >
-                            Trunk
-                          </option>
-                        </select>
-                        <svg
-                          aria-hidden="true"
-                          class="MuiSvgIcon-root MuiSelect-icon MuiSelect-iconOutlined"
-                          focusable="false"
-                          viewBox="0 0 24 24"
-                        >
-                          <path
-                            d="M7 10l5 5 5-5z"
-                          />
-                        </svg>
-                        <fieldset
-                          aria-hidden="true"
-                          class="PrivateNotchedOutline-root-649 MuiOutlinedInput-notchedOutline"
-                          style="padding-left: 8px;"
-                        >
-                          <legend
-                            class="PrivateNotchedOutline-legend-650"
-                            style="width: 0.01px;"
-                          >
-                            <span>
-                              ​
-                            </span>
-                          </legend>
-                        </fieldset>
-                      </div>
-                    </div>
                     <span
                       aria-disabled="true"
                       aria-label="send command"
diff --git a/src/components/Cars/SendCommand/index.jsx b/src/components/Cars/SendCommand/index.jsx
index 4fad1e1..eee3b42 100644
--- a/src/components/Cars/SendCommand/index.jsx
+++ b/src/components/Cars/SendCommand/index.jsx
@@ -120,31 +120,6 @@ const SendCommand = ({ vins }) => {
           ))}
         </Select>
       </FormControl>
-      <FormControl className={classes.formControlInline} variant="outlined">
-        <InputLabel
-          htmlFor="send-parameter"
-          style={{ backgroundColor: "White" }}
-        >
-          Parameter
-        </InputLabel>
-        <Select
-          native
-          value={parameter}
-          variant="outlined"
-          inputProps={{
-            name: "send-parameter",
-            id: "send-parameter",
-          }}
-          onChange={changeParametersHandler}
-          disabled={parameters.length === 0}
-        >
-          {parameters.map((item) => (
-            <option key={item.value} value={item.value}>
-              {item.label}
-            </option>
-          ))}
-        </Select>
-      </FormControl>
       <IconButton
         color="primary"
         aria-label="send command"
diff --git a/src/components/Dashboard/index.jsx b/src/components/Dashboard/index.jsx
index 3e16a83..52996c0 100644
--- a/src/components/Dashboard/index.jsx
+++ b/src/components/Dashboard/index.jsx
@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { Button, Link } from "@material-ui/core";
+import { Button, Grid, Link } from "@material-ui/core";
 import CreateIcon from "@material-ui/icons/Create";
 
 import { useStatusContext } from "../Contexts/StatusContext";
@@ -17,16 +17,38 @@ const Dashboard = () => {
 
   return (
     <div className={classes.paper}>
-      <ResponsiveIFrame
-        classes={classes}
-        src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=5s&panelId=6"
-        title="Vehicle Connected"
-      />
-      <ResponsiveIFrame
-        classes={classes}
-        src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=5s&panelId=2"
-        title="Vehicle Signals"
-      />
+      <Grid container className={classes.root} spacing={2}>
+        <Grid item md={6}>
+          <ResponsiveIFrame
+            classes={classes}
+            src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=5s&panelId=6"
+            title="Vehicle Connected"
+          />
+        </Grid>
+        <Grid item md={6}>
+          <ResponsiveIFrame
+            classes={classes}
+            src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=30s&from=1623869272751&to=1623880072751&panelId=12"
+            title="Signals Time Series"
+          />
+        </Grid>
+      </Grid>
+      <Grid container className={classes.root} spacing={2}>
+        <Grid item md={6}>
+          <ResponsiveIFrame
+            classes={classes}
+            src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=30s&from=1623869351185&to=1623880151186&panelId=14"
+            title="Total Signals"
+          />
+        </Grid>
+        <Grid item md={6}>
+          <ResponsiveIFrame
+            classes={classes}
+            src="https://grafana.fiskerdps.com/d-solo/1VTVJ_qGk/dashboard?orgId=2&refresh=5s&panelId=2"
+            title="Vehicle Signals"
+          />
+        </Grid>
+      </Grid>
       <Button
         style={{ marginTop: 10 }}
         aria-label="create"