From a5c29a472109b7deb099cd2268b2c259230cb118 Mon Sep 17 00:00:00 2001
From: John Wu <76966357+jwu-fisker@users.noreply.github.com>
Date: Thu, 15 Jun 2023 14:39:21 -0700
Subject: [PATCH] CEC-4572 tweak digital twin display and form (#362)

* CEC-4572 tweak form

* update snapshots

* Clean up

* Hide DTC tab
---
 .../App/__snapshots__/App.test.js.snap        |  99 +++++------
 .../Details/__snapshots__/index.test.jsx.snap |  75 +++++----
 src/components/Cars/Status/Details/index.jsx  |  73 +++++----
 .../__snapshots__/DetailsTab.test.jsx.snap    |  75 +++++----
 .../Status/__snapshots__/index.test.jsx.snap  | 100 +++++-------
 src/components/Cars/Status/index.jsx          |   4 +-
 .../Update/__snapshots__/index.test.jsx.snap  | 154 +++++++++---------
 src/components/Cars/Update/index.jsx          |  46 +++---
 8 files changed, 300 insertions(+), 326 deletions(-)

diff --git a/src/components/App/__snapshots__/App.test.js.snap b/src/components/App/__snapshots__/App.test.js.snap
index d5f2921..28e0e1e 100644
--- a/src/components/App/__snapshots__/App.test.js.snap
+++ b/src/components/App/__snapshots__/App.test.js.snap
@@ -11266,24 +11266,6 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                         class="MuiTouchRipple-root"
                       />
                     </button>
-                    <button
-                      aria-controls="tabpanel-10"
-                      aria-selected="false"
-                      class="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit"
-                      id="tab-10"
-                      role="tab"
-                      tabindex="-1"
-                      type="button"
-                    >
-                      <span
-                        class="MuiTab-wrapper"
-                      >
-                        DTC Timeline
-                      </span>
-                      <span
-                        class="MuiTouchRipple-root"
-                      />
-                    </button>
                   </div>
                   <span
                     class="PrivateTabIndicator-root-0 PrivateTabIndicator-colorSecondary-0 MuiTabs-indicator"
@@ -11386,21 +11368,25 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                           </p>
                           <p>
                             <b>
-                              Log Level
+                              Tags
                             </b>
                             : 
-                            info
+                            none
                           </p>
                         </div>
                         <div
                           class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
                         >
-                          <b>
-                            CANBus
-                          </b>
                           <p>
                             <b>
-                              Enabled
+                              Log Level
+                            </b>
+                            : 
+                            info
+                          </p>
+                          <p>
+                            <b>
+                              CANBus Enabled
                             </b>
                             : 
                             true
@@ -11414,7 +11400,7 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                           </p>
                           <p>
                             <b>
-                              Enabled
+                              Data Logger Enabled
                             </b>
                             : 
                             true
@@ -11433,15 +11419,12 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                             : 
                             3
                           </p>
-                        </div>
-                        <div
-                          class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
-                        >
                           <p>
                             <b>
-                              DebugMask
+                              DTC Enabled
                             </b>
                             : 
+                            false
                           </p>
                         </div>
                         <div
@@ -11449,7 +11432,7 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                         >
                           <p>
                             <b>
-                              Tags
+                              Debug Mask
                             </b>
                             : 
                           </p>
@@ -11457,24 +11440,6 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                         <div
                           class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
                         >
-                          <a
-                            class=""
-                            href="/vehicle-update?vin=FISKER123"
-                            style="margin: 5px;"
-                            title="Update \\"FISKER123\\""
-                          >
-                            <svg
-                              aria-hidden="true"
-                              aria-label="Update \\"FISKER123\\""
-                              class="MuiSvgIcon-root"
-                              focusable="false"
-                              viewBox="0 0 24 24"
-                            >
-                              <path
-                                d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
-                              />
-                            </svg>
-                          </a>
                           <label
                             class="MuiFormControlLabel-root"
                           >
@@ -11509,18 +11474,18 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                             <span
                               class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
                             >
-                              FORCE CONFIG PUSH
+                              Force Config Update
                             </span>
                           </label>
                           <a
                             class=""
                             href="/vehicle-status/FISKER123"
-                            title="Push Config \\"FISKER123\\""
+                            title="Push Config Update to \\"FISKER123\\""
                           >
                             <svg
                               aria-hidden="true"
-                              aria-label="Push Config \\"FISKER123\\""
-                              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                              aria-label="Push Config Update to \\"FISKER123\\""
+                              class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-tzssek-MuiSvgIcon-root"
                               data-testid="UploadIcon"
                               focusable="false"
                               viewBox="0 0 24 24"
@@ -11531,6 +11496,28 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                             </svg>
                           </a>
                         </div>
+                        <div
+                          class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
+                        >
+                          <a
+                            class=""
+                            href="/vehicle-update?vin=FISKER123"
+                            style="margin: 5px;"
+                            title="Update \\"FISKER123\\""
+                          >
+                            <svg
+                              aria-hidden="true"
+                              aria-label="Update \\"FISKER123\\""
+                              class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge"
+                              focusable="false"
+                              viewBox="0 0 24 24"
+                            >
+                              <path
+                                d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
+                              />
+                            </svg>
+                          </a>
+                        </div>
                       </div>
                       <div />
                       <div />
@@ -11593,12 +11580,6 @@ exports[`App Route /vehicle-status authenticated 1`] = `
               id="tabpanel-9"
               role="tabpanel"
             />
-            <div
-              aria-labelledby="tab-10"
-              hidden=""
-              id="tabpanel-10"
-              role="tabpanel"
-            />
           </div>
         </main>
       </main>
diff --git a/src/components/Cars/Status/Details/__snapshots__/index.test.jsx.snap b/src/components/Cars/Status/Details/__snapshots__/index.test.jsx.snap
index fb68c0c..7cadd4e 100644
--- a/src/components/Cars/Status/Details/__snapshots__/index.test.jsx.snap
+++ b/src/components/Cars/Status/Details/__snapshots__/index.test.jsx.snap
@@ -89,21 +89,25 @@ exports[`VehicleDetailsTab Render 1`] = `
                 </p>
                 <p>
                   <b>
-                    Log Level
+                    Tags
                   </b>
                   : 
-                  info
+                  none
                 </p>
               </div>
               <div
                 class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
               >
-                <b>
-                  CANBus
-                </b>
                 <p>
                   <b>
-                    Enabled
+                    Log Level
+                  </b>
+                  : 
+                  info
+                </p>
+                <p>
+                  <b>
+                    CANBus Enabled
                   </b>
                   : 
                   true
@@ -117,7 +121,7 @@ exports[`VehicleDetailsTab Render 1`] = `
                 </p>
                 <p>
                   <b>
-                    Enabled
+                    Data Logger Enabled
                   </b>
                   : 
                   true
@@ -136,15 +140,12 @@ exports[`VehicleDetailsTab Render 1`] = `
                   : 
                   3
                 </p>
-              </div>
-              <div
-                class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
-              >
                 <p>
                   <b>
-                    DebugMask
+                    DTC Enabled
                   </b>
                   : 
+                  false
                 </p>
               </div>
               <div
@@ -152,7 +153,7 @@ exports[`VehicleDetailsTab Render 1`] = `
               >
                 <p>
                   <b>
-                    Tags
+                    Debug Mask
                   </b>
                   : 
                 </p>
@@ -160,24 +161,6 @@ exports[`VehicleDetailsTab Render 1`] = `
               <div
                 class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
               >
-                <a
-                  class=""
-                  href="/vehicle-update?vin=TESTVIN1234567890"
-                  style="margin: 5px;"
-                  title="Update \\"TESTVIN1234567890\\""
-                >
-                  <svg
-                    aria-hidden="true"
-                    aria-label="Update \\"TESTVIN1234567890\\""
-                    class="MuiSvgIcon-root"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
-                    />
-                  </svg>
-                </a>
                 <label
                   class="MuiFormControlLabel-root"
                 >
@@ -212,18 +195,18 @@ exports[`VehicleDetailsTab Render 1`] = `
                   <span
                     class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
                   >
-                    FORCE CONFIG PUSH
+                    Force Config Update
                   </span>
                 </label>
                 <a
                   class=""
                   href="/"
-                  title="Push Config \\"TESTVIN1234567890\\""
+                  title="Push Config Update to \\"TESTVIN1234567890\\""
                 >
                   <svg
                     aria-hidden="true"
-                    aria-label="Push Config \\"TESTVIN1234567890\\""
-                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                    aria-label="Push Config Update to \\"TESTVIN1234567890\\""
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-tzssek-MuiSvgIcon-root"
                     data-testid="UploadIcon"
                     focusable="false"
                     viewBox="0 0 24 24"
@@ -234,6 +217,28 @@ exports[`VehicleDetailsTab Render 1`] = `
                   </svg>
                 </a>
               </div>
+              <div
+                class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
+              >
+                <a
+                  class=""
+                  href="/vehicle-update?vin=TESTVIN1234567890"
+                  style="margin: 5px;"
+                  title="Update \\"TESTVIN1234567890\\""
+                >
+                  <svg
+                    aria-hidden="true"
+                    aria-label="Update \\"TESTVIN1234567890\\""
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
+                    />
+                  </svg>
+                </a>
+              </div>
             </div>
             <div />
             <div />
diff --git a/src/components/Cars/Status/Details/index.jsx b/src/components/Cars/Status/Details/index.jsx
index 99b8bf7..cb8a973 100644
--- a/src/components/Cars/Status/Details/index.jsx
+++ b/src/components/Cars/Status/Details/index.jsx
@@ -1,4 +1,4 @@
-import { Grid, Tooltip, Checkbox, FormControlLabel } from "@material-ui/core";
+import { Checkbox, FormControlLabel, Grid, Tooltip } from "@material-ui/core";
 import DeleteIcon from "@material-ui/icons/Delete";
 import EditIcon from "@material-ui/icons/Edit";
 import UploadIcon from '@mui/icons-material/Upload';
@@ -114,23 +114,26 @@ const MainForm = ({ vin }) => {
           <p>
             <b>Info Source</b>: {vehicle.info_source}
           </p>
-          {vehicle.log_level != null && (
+          <p>
+            <b>Tags</b>: {vehicle.tags ? vehicle.tags.join(", ") : "none" }
+          </p>
+        </Grid>
+        <Grid item md={12} className={classes.textCenterAlign}>
+        {vehicle.log_level != null && (
             <p>
               <b>Log Level</b>: {vehicle.log_level}
             </p>
           )}
-        </Grid>
         {vehicle.canbus && (
-          <Grid item md={12} className={classes.textCenterAlign}>
-            <b>CANBus</b>
+          <>
             <p>
-              <b>Enabled</b>: {vehicle.canbus.enabled.toString()}
+              <b>CANBus Enabled</b>: {vehicle.canbus.enabled.toString()}
             </p>
             <p>
               <b>Max Memory Buffer Size</b>: {vehicle.canbus.max_mem_buffer_size ?? "Default"}
             </p>
             <p>
-              <b>Enabled</b>: {vehicle.canbus.data_logger_enabled.toString()}
+              <b>Data Logger Enabled</b>: {vehicle.canbus.data_logger_enabled.toString()}
             </p>
             <p>
               <b>Max Disk Buffer Size</b>: {vehicle.canbus.max_disk_buffer_size ?? "Default"}
@@ -138,19 +141,40 @@ const MainForm = ({ vin }) => {
             <p>
               <b>Filters</b>: {vehicle.canbus.filters ? vehicle.canbus.filters.length : 0}
             </p>
-          </Grid>
+            <p>
+              <b>DTC Enabled</b>: { (vehicle.canbus.dtc_enabled || false).toString() }
+            </p>
+          </>
         )}
+          </Grid>
         {showDebugMask && (
           <Grid item md={12} className={classes.textCenterAlign}>
             <p>
-              <b>DebugMask</b>: {vehicle.debug_mask}
+              <b>Debug Mask</b>: {vehicle.debug_mask}
             </p>
           </Grid>
         )}
         <Grid item md={12} className={classes.textCenterAlign}>
-          <p>
-            <b>Tags</b>: {vehicle.tags}
-          </p>
+          <RoleWrap
+              groups={groups}
+              providers={providers}
+              rolesPerProvider={Permissions.FiskerCreate}
+            >
+            <FormControlLabel
+                  label="Force Config Update"
+                  control={
+                    <Checkbox
+                      checked={forced}
+                      onChange={onForcedChange}
+                    />
+                  }
+                />
+            <Tooltip key={`push-config-${vin}`} title={`Push Config Update to "${vin}"`}>
+              <Link to="#" onClick={() => setShowUploadConfigModal(true)}  >
+                <UploadIcon aria-label={`Push Config Update to "${vin}"`} fontSize="large" />
+              </Link>
+            </Tooltip>
+          </RoleWrap>
         </Grid>
         <Grid item md={12} className={classes.textCenterAlign}>
           <RoleWrap
@@ -160,31 +184,10 @@ const MainForm = ({ vin }) => {
           >
             <Tooltip key={`update-${vin}`} title={`Update "${vin}"`}>
               <Link to={`/vehicle-update?vin=${vin}`} style={{ margin: 5 }}>
-                <EditIcon aria-label={`Update "${vin}"`} />
+                <EditIcon aria-label={`Update "${vin}"`} fontSize="large" />
               </Link>
             </Tooltip>
           </RoleWrap>
-          <RoleWrap
-            groups={groups}
-            providers={providers}
-            rolesPerProvider={Permissions.FiskerCreate}
-          >
-            <FormControlLabel
-                  label="FORCE CONFIG PUSH"
-                  control={
-                    <Checkbox
-                      checked={forced}
-                      onChange={onForcedChange}
-                    />
-                  }
-                />
-            <Tooltip key={`push-config-${vin}`} title={`Push Config "${vin}"`}>
-              <Link to="#" onClick={() => setShowUploadConfigModal(true)}>
-                <UploadIcon aria-label={`Push Config "${vin}"`} />
-              </Link>
-            </Tooltip>
-          </RoleWrap>
-
           <RoleWrap
             groups={groups}
             providers={providers}
@@ -192,7 +195,7 @@ const MainForm = ({ vin }) => {
           >
             <Tooltip key={`delete-${vin}`} title={`Delete "${vin}"`}>
               <Link to="#" onClick={() => setShowDeleteModal(true)}>
-                <DeleteIcon aria-label={`Delete "${vin}"`} />
+                <DeleteIcon aria-label={`Delete "${vin}"`} fontSize="large" />
               </Link>
             </Tooltip>
           </RoleWrap>
diff --git a/src/components/Cars/Status/__snapshots__/DetailsTab.test.jsx.snap b/src/components/Cars/Status/__snapshots__/DetailsTab.test.jsx.snap
index 58bfd4f..fedbdd8 100644
--- a/src/components/Cars/Status/__snapshots__/DetailsTab.test.jsx.snap
+++ b/src/components/Cars/Status/__snapshots__/DetailsTab.test.jsx.snap
@@ -97,21 +97,25 @@ exports[`DetailsTab Render 1`] = `
                   </p>
                   <p>
                     <b>
-                      Log Level
+                      Tags
                     </b>
                     : 
-                    info
+                    none
                   </p>
                 </div>
                 <div
                   class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
                 >
-                  <b>
-                    CANBus
-                  </b>
                   <p>
                     <b>
-                      Enabled
+                      Log Level
+                    </b>
+                    : 
+                    info
+                  </p>
+                  <p>
+                    <b>
+                      CANBus Enabled
                     </b>
                     : 
                     true
@@ -125,7 +129,7 @@ exports[`DetailsTab Render 1`] = `
                   </p>
                   <p>
                     <b>
-                      Enabled
+                      Data Logger Enabled
                     </b>
                     : 
                     true
@@ -144,15 +148,12 @@ exports[`DetailsTab Render 1`] = `
                     : 
                     3
                   </p>
-                </div>
-                <div
-                  class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
-                >
                   <p>
                     <b>
-                      DebugMask
+                      DTC Enabled
                     </b>
                     : 
+                    false
                   </p>
                 </div>
                 <div
@@ -160,7 +161,7 @@ exports[`DetailsTab Render 1`] = `
                 >
                   <p>
                     <b>
-                      Tags
+                      Debug Mask
                     </b>
                     : 
                   </p>
@@ -168,24 +169,6 @@ exports[`DetailsTab Render 1`] = `
                 <div
                   class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
                 >
-                  <a
-                    class=""
-                    href="/vehicle-update?vin=TESTVIN1234567890"
-                    style="margin: 5px;"
-                    title="Update \\"TESTVIN1234567890\\""
-                  >
-                    <svg
-                      aria-hidden="true"
-                      aria-label="Update \\"TESTVIN1234567890\\""
-                      class="MuiSvgIcon-root"
-                      focusable="false"
-                      viewBox="0 0 24 24"
-                    >
-                      <path
-                        d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
-                      />
-                    </svg>
-                  </a>
                   <label
                     class="MuiFormControlLabel-root"
                   >
@@ -220,18 +203,18 @@ exports[`DetailsTab Render 1`] = `
                     <span
                       class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
                     >
-                      FORCE CONFIG PUSH
+                      Force Config Update
                     </span>
                   </label>
                   <a
                     class=""
                     href="/testroute/TESTVIN1234567890"
-                    title="Push Config \\"TESTVIN1234567890\\""
+                    title="Push Config Update to \\"TESTVIN1234567890\\""
                   >
                     <svg
                       aria-hidden="true"
-                      aria-label="Push Config \\"TESTVIN1234567890\\""
-                      class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                      aria-label="Push Config Update to \\"TESTVIN1234567890\\""
+                      class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-tzssek-MuiSvgIcon-root"
                       data-testid="UploadIcon"
                       focusable="false"
                       viewBox="0 0 24 24"
@@ -242,6 +225,28 @@ exports[`DetailsTab Render 1`] = `
                     </svg>
                   </a>
                 </div>
+                <div
+                  class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
+                >
+                  <a
+                    class=""
+                    href="/vehicle-update?vin=TESTVIN1234567890"
+                    style="margin: 5px;"
+                    title="Update \\"TESTVIN1234567890\\""
+                  >
+                    <svg
+                      aria-hidden="true"
+                      aria-label="Update \\"TESTVIN1234567890\\""
+                      class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge"
+                      focusable="false"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
+                      />
+                    </svg>
+                  </a>
+                </div>
               </div>
               <div />
               <div />
diff --git a/src/components/Cars/Status/__snapshots__/index.test.jsx.snap b/src/components/Cars/Status/__snapshots__/index.test.jsx.snap
index a4a0c43..7eb546e 100644
--- a/src/components/Cars/Status/__snapshots__/index.test.jsx.snap
+++ b/src/components/Cars/Status/__snapshots__/index.test.jsx.snap
@@ -213,24 +213,6 @@ exports[`CarStatus Render 1`] = `
                       class="MuiTouchRipple-root"
                     />
                   </button>
-                  <button
-                    aria-controls="tabpanel-10"
-                    aria-selected="false"
-                    class="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit"
-                    id="tab-10"
-                    role="tab"
-                    tabindex="-1"
-                    type="button"
-                  >
-                    <span
-                      class="MuiTab-wrapper"
-                    >
-                      DTC Timeline
-                    </span>
-                    <span
-                      class="MuiTouchRipple-root"
-                    />
-                  </button>
                 </div>
                 <span
                   class="PrivateTabIndicator-root-0 PrivateTabIndicator-colorSecondary-0 MuiTabs-indicator"
@@ -325,48 +307,30 @@ exports[`CarStatus Render 1`] = `
                         </b>
                         : 
                       </p>
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
-                    >
-                      <p>
-                        <b>
-                          DebugMask
-                        </b>
-                        : 
-                      </p>
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
-                    >
                       <p>
                         <b>
                           Tags
                         </b>
                         : 
+                        none
+                      </p>
+                    </div>
+                    <div
+                      class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
+                    />
+                    <div
+                      class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
+                    >
+                      <p>
+                        <b>
+                          Debug Mask
+                        </b>
+                        : 
                       </p>
                     </div>
                     <div
                       class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
                     >
-                      <a
-                        class=""
-                        href="/vehicle-update?vin=TESTVIN1234567890"
-                        style="margin: 5px;"
-                        title="Update \\"TESTVIN1234567890\\""
-                      >
-                        <svg
-                          aria-hidden="true"
-                          aria-label="Update \\"TESTVIN1234567890\\""
-                          class="MuiSvgIcon-root"
-                          focusable="false"
-                          viewBox="0 0 24 24"
-                        >
-                          <path
-                            d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
-                          />
-                        </svg>
-                      </a>
                       <label
                         class="MuiFormControlLabel-root"
                       >
@@ -401,18 +365,18 @@ exports[`CarStatus Render 1`] = `
                         <span
                           class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
                         >
-                          FORCE CONFIG PUSH
+                          Force Config Update
                         </span>
                       </label>
                       <a
                         class=""
                         href="/"
-                        title="Push Config \\"TESTVIN1234567890\\""
+                        title="Push Config Update to \\"TESTVIN1234567890\\""
                       >
                         <svg
                           aria-hidden="true"
-                          aria-label="Push Config \\"TESTVIN1234567890\\""
-                          class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                          aria-label="Push Config Update to \\"TESTVIN1234567890\\""
+                          class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-tzssek-MuiSvgIcon-root"
                           data-testid="UploadIcon"
                           focusable="false"
                           viewBox="0 0 24 24"
@@ -423,6 +387,28 @@ exports[`CarStatus Render 1`] = `
                         </svg>
                       </a>
                     </div>
+                    <div
+                      class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
+                    >
+                      <a
+                        class=""
+                        href="/vehicle-update?vin=TESTVIN1234567890"
+                        style="margin: 5px;"
+                        title="Update \\"TESTVIN1234567890\\""
+                      >
+                        <svg
+                          aria-hidden="true"
+                          aria-label="Update \\"TESTVIN1234567890\\""
+                          class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
+                          />
+                        </svg>
+                      </a>
+                    </div>
                   </div>
                   <div />
                   <div />
@@ -484,12 +470,6 @@ exports[`CarStatus Render 1`] = `
             id="tabpanel-9"
             role="tabpanel"
           />
-          <div
-            aria-labelledby="tab-10"
-            hidden=""
-            id="tabpanel-10"
-            role="tabpanel"
-          />
         </div>
       </div>
     </div>
diff --git a/src/components/Cars/Status/index.jsx b/src/components/Cars/Status/index.jsx
index b30bb13..9e4a0b7 100644
--- a/src/components/Cars/Status/index.jsx
+++ b/src/components/Cars/Status/index.jsx
@@ -19,7 +19,6 @@ import ECUsTab from "./ECUsTab";
 import FleetsTab from "./FleetsTab";
 import RemoteCommandsTab from "./RemoteCommandsTab";
 import TRexLogsTab from "./TRexLogsTab";
-import DTCTimeline from "../../DTCTimeline/DTCTimeline";
 
 const tabHashes = ["details", "updates", "filters"];
 
@@ -74,12 +73,13 @@ const TabViews = [
     component: SelfServeTab,
     rolesPerProvider: Permissions.FiskerRead,
   },
+  /*
   {
     label: "DTC Timeline",
     component: DTCTimeline,
     rolesPerProvider: Permissions.FiskerMagnaRead,
   }
-
+  */
 ];
 
 const filterTabs = (data, groups, providers) => {
diff --git a/src/components/Cars/Update/__snapshots__/index.test.jsx.snap b/src/components/Cars/Update/__snapshots__/index.test.jsx.snap
index ee2b41a..8bab667 100644
--- a/src/components/Cars/Update/__snapshots__/index.test.jsx.snap
+++ b/src/components/Cars/Update/__snapshots__/index.test.jsx.snap
@@ -434,6 +434,43 @@ exports[`VehicleUpdate Render 1`] = `
                   </fieldset>
                 </div>
               </div>
+              <div
+                class="MuiFormControl-root MuiTextField-root MuiFormControl-marginNormal MuiFormControl-fullWidth"
+              >
+                <label
+                  class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined"
+                  data-shrink="true"
+                  for="tag"
+                  id="tag-label"
+                >
+                  Tags (comma separated, alphanumeric and - only)
+                </label>
+                <div
+                  class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="MuiInputBase-input MuiOutlinedInput-input"
+                    id="tag"
+                    maxlength="1024"
+                    name="tags"
+                    type="text"
+                    value=""
+                  />
+                  <fieldset
+                    aria-hidden="true"
+                    class="PrivateNotchedOutline-root-0 MuiOutlinedInput-notchedOutline"
+                  >
+                    <legend
+                      class="PrivateNotchedOutline-legendLabelled-0 PrivateNotchedOutline-legendNotched-0"
+                    >
+                      <span>
+                        Tags (comma separated, alphanumeric and - only)
+                      </span>
+                    </legend>
+                  </fieldset>
+                </div>
+              </div>
               <label
                 class="MuiFormLabel-root"
                 id="demo-row-radio-buttons-group-label"
@@ -884,44 +921,6 @@ exports[`VehicleUpdate Render 1`] = `
                     Data Logger Enabled
                   </span>
                 </label>
-                <label
-                  class="MuiFormControlLabel-root"
-                >
-                  <span
-                    aria-disabled="false"
-                    class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-0 MuiCheckbox-root MuiCheckbox-colorSecondary PrivateSwitchBase-checked-0 Mui-checked MuiIconButton-colorSecondary"
-                  >
-                    <span
-                      class="MuiIconButton-label"
-                    >
-                      <input
-                        checked=""
-                        class="PrivateSwitchBase-input-0"
-                        data-indeterminate="false"
-                        type="checkbox"
-                        value=""
-                      />
-                      <svg
-                        aria-hidden="true"
-                        class="MuiSvgIcon-root"
-                        focusable="false"
-                        viewBox="0 0 24 24"
-                      >
-                        <path
-                          d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
-                        />
-                      </svg>
-                    </span>
-                    <span
-                      class="MuiTouchRipple-root"
-                    />
-                  </span>
-                  <span
-                    class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
-                  >
-                    DTC Enabled
-                  </span>
-                </label>
               </div>
               <div
                 class="MuiFormControl-root MuiTextField-root MuiFormControl-marginNormal MuiFormControl-fullWidth"
@@ -969,6 +968,44 @@ exports[`VehicleUpdate Render 1`] = `
                   </fieldset>
                 </div>
               </div>
+              <label
+                class="MuiFormControlLabel-root"
+              >
+                <span
+                  aria-disabled="false"
+                  class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-0 MuiCheckbox-root MuiCheckbox-colorSecondary PrivateSwitchBase-checked-0 Mui-checked MuiIconButton-colorSecondary"
+                >
+                  <span
+                    class="MuiIconButton-label"
+                  >
+                    <input
+                      checked=""
+                      class="PrivateSwitchBase-input-0"
+                      data-indeterminate="false"
+                      type="checkbox"
+                      value=""
+                    />
+                    <svg
+                      aria-hidden="true"
+                      class="MuiSvgIcon-root"
+                      focusable="false"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
+                      />
+                    </svg>
+                  </span>
+                  <span
+                    class="MuiTouchRipple-root"
+                  />
+                </span>
+                <span
+                  class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
+                >
+                  DTC Enabled
+                </span>
+              </label>
               <div
                 class="MuiFormControl-root MuiTextField-root MuiFormControl-marginNormal MuiFormControl-fullWidth"
               >
@@ -978,7 +1015,7 @@ exports[`VehicleUpdate Render 1`] = `
                   for="debug_mask"
                   id="debug_mask-label"
                 >
-                  DebugMask
+                  Debug Mask
                 </label>
                 <div
                   class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
@@ -1000,44 +1037,7 @@ exports[`VehicleUpdate Render 1`] = `
                       class="PrivateNotchedOutline-legendLabelled-0 PrivateNotchedOutline-legendNotched-0"
                     >
                       <span>
-                        DebugMask
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-              <div
-                class="MuiFormControl-root MuiTextField-root MuiFormControl-marginNormal MuiFormControl-fullWidth"
-              >
-                <label
-                  class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined"
-                  data-shrink="true"
-                  for="tag"
-                  id="tag-label"
-                >
-                  Tags (comma separated, alphanumeric and - only)
-                </label>
-                <div
-                  class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                >
-                  <input
-                    aria-invalid="false"
-                    class="MuiInputBase-input MuiOutlinedInput-input"
-                    id="tag"
-                    maxlength="1024"
-                    name="tags"
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden="true"
-                    class="PrivateNotchedOutline-root-0 MuiOutlinedInput-notchedOutline"
-                  >
-                    <legend
-                      class="PrivateNotchedOutline-legendLabelled-0 PrivateNotchedOutline-legendNotched-0"
-                    >
-                      <span>
-                        Tags (comma separated, alphanumeric and - only)
+                        Debug Mask
                       </span>
                     </legend>
                   </fieldset>
diff --git a/src/components/Cars/Update/index.jsx b/src/components/Cars/Update/index.jsx
index dc7c141..25ab193 100644
--- a/src/components/Cars/Update/index.jsx
+++ b/src/components/Cars/Update/index.jsx
@@ -337,6 +337,22 @@ const MainForm = () => {
           fullWidth
           inputRef={infoSourceEl}
         />
+        <TextField
+          id="tag"
+          name="tags"
+          label='Tags (comma separated, alphanumeric and - only)'
+          InputLabelProps={{
+            shrink: true
+          }}
+          defaultValue=""
+          variant="outlined"
+          margin="normal"
+          inputProps={{
+            maxLength: "1024",
+          }}
+          fullWidth
+          inputRef={tagsEl}
+        />
         <FormLabel id="demo-row-radio-buttons-group-label">Log Level</FormLabel>
         <RadioGroup
           row
@@ -384,12 +400,6 @@ const MainForm = () => {
               disabled={!canbusEnabled}
             />
           } label="Data Logger Enabled" />
-          <FormControlLabel control={
-            <Checkbox
-              checked={dtcEnabled}
-              onChange={onDtcEnabledChange}
-            />
-          } label="DTC Enabled" />
         </FormGroup>
         <TextField
           id="max_disk_buffer_size"
@@ -407,11 +417,17 @@ const MainForm = () => {
           required
           fullWidth
         />
+        <FormControlLabel control={
+          <Checkbox
+            checked={dtcEnabled}
+            onChange={onDtcEnabledChange}
+          />
+        } label="DTC Enabled" />
         {showDebugMask && (
           <TextField
             id="debug_mask"
             name="debug_mask"
-            label="DebugMask"
+            label="Debug Mask"
             InputLabelProps={{
               shrink: true
             }}
@@ -425,22 +441,6 @@ const MainForm = () => {
             inputRef={debugMaskEl}
           />
         )}
-        <TextField
-          id="tag"
-          name="tags"
-          label='Tags (comma separated, alphanumeric and - only)'
-          InputLabelProps={{
-            shrink: true
-          }}
-          defaultValue=""
-          variant="outlined"
-          margin="normal"
-          inputProps={{
-            maxLength: "1024",
-          }}
-          fullWidth
-          inputRef={tagsEl}
-        />
         <Button
           type="submit"
           disabled={busy}