From 2b95bab38b8374c5040bb94bc7d3b6d674de8300 Mon Sep 17 00:00:00 2001
From: John Wu <76966357+jwu-fisker@users.noreply.github.com>
Date: Tue, 10 Aug 2021 18:11:14 -0700
Subject: [PATCH] CEC-381 Install messages and update styling (#76)

* Styling

* Handle install messages

* Update progress

* Display download and install status
---
 .../App/__snapshots__/App.test.js.snap        | 779 +++++++++---------
 src/components/Cars/SendCommand/index.jsx     |  15 +-
 src/components/Cars/SendCommandBulk/index.jsx |  10 +-
 src/components/Contexts/CarUpdatesContext.jsx |  39 +-
 src/components/Layouts/MenuDrawer.jsx         |   4 +-
 src/components/Manifest/Deploy/index.jsx      |   7 +-
 src/components/Manifest/List/index.jsx        |  19 +-
 src/components/useStyles.jsx                  |   7 +-
 8 files changed, 477 insertions(+), 403 deletions(-)

diff --git a/src/components/App/__snapshots__/App.test.js.snap b/src/components/App/__snapshots__/App.test.js.snap
index f2dbf63..0d7a7a5 100644
--- a/src/components/App/__snapshots__/App.test.js.snap
+++ b/src/components/App/__snapshots__/App.test.js.snap
@@ -6,10 +6,10 @@ exports[`App Route / authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-612"
+      class="makeStyles-root-625"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-613 makeStyles-appBarShift-614 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-626 makeStyles-appBarShift-627 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -22,7 +22,7 @@ exports[`App Route / authenticated 1`] = `
             </h6>
           </div>
           <div
-            class="makeStyles-rightToolbar-622"
+            class="makeStyles-rightToolbar-636"
             color="inherit"
           >
             <button
@@ -45,17 +45,17 @@ exports[`App Route / authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-617"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-630"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-618 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-631 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-619"
+            class="makeStyles-drawerHeader-632 makeStyles-drawerHeaderLogo-633"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-628"
+              class="makeStyles-logo-642"
               src="fisker-badge.svg"
             />
           </div>
@@ -266,16 +266,16 @@ exports[`App Route / authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-620 makeStyles-contentShift-621"
+        class="makeStyles-content-634 makeStyles-contentShift-635"
       >
         <div
-          class="makeStyles-drawerHeader-619"
+          class="makeStyles-drawerHeader-632"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-601"
+            class="makeStyles-paper-614"
           >
             <div
               data-testid="mocked-vehicleprovider"
@@ -415,7 +415,7 @@ exports[`App Route / unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-22"
+        class="makeStyles-content-23"
       >
         <div
           class="makeStyles-drawerHeader-21"
@@ -456,10 +456,10 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-992"
+      class="makeStyles-root-1013"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-993 makeStyles-appBarShift-994 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1014 makeStyles-appBarShift-1015 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -472,7 +472,7 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
             </h6>
           </div>
           <div
-            class="makeStyles-rightToolbar-1002"
+            class="makeStyles-rightToolbar-1024"
             color="inherit"
           >
             <button
@@ -495,17 +495,17 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-997"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1018"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-998 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1019 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-999"
+            class="makeStyles-drawerHeader-1020 makeStyles-drawerHeaderLogo-1021"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-1008"
+              class="makeStyles-logo-1030"
               src="fisker-badge.svg"
             />
           </div>
@@ -716,10 +716,10 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-1000 makeStyles-contentShift-1001"
+        class="makeStyles-content-1022 makeStyles-contentShift-1023"
       >
         <div
-          class="makeStyles-drawerHeader-999"
+          class="makeStyles-drawerHeader-1020"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
@@ -731,11 +731,11 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
               data-testid="mocked-updatesprovider"
             >
               <div
-                class="makeStyles-paper-981"
+                class="makeStyles-paper-1002"
               >
                 <form
                   action="{onSubmit}"
-                  class="makeStyles-form-983"
+                  class="makeStyles-form-1004"
                   novalidate=""
                 >
                   <p
@@ -747,13 +747,13 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
                     Description
                   </p>
                   <div
-                    class="MuiGrid-root makeStyles-root-992 MuiGrid-container MuiGrid-spacing-xs-2"
+                    class="MuiGrid-root makeStyles-root-1013 MuiGrid-container MuiGrid-spacing-xs-2"
                   >
                     <div
                       class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-10"
                     >
                       <div
-                        class="MuiFormControl-root makeStyles-margin-1005 makeStyles-textField-1006"
+                        class="MuiFormControl-root makeStyles-margin-1027 makeStyles-textField-1028"
                       >
                         <label
                           class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
@@ -803,7 +803,7 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
                         </div>
                       </div>
                       <div
-                        class="makeStyles-labelInline-987"
+                        class="makeStyles-labelInline-1008"
                       >
                         0 Selected
                       </div>
@@ -813,7 +813,7 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
                       style="text-align: right;"
                     >
                       <button
-                        class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-formControl-985 MuiButton-containedPrimary Mui-disabled MuiButton-fullWidth Mui-disabled"
+                        class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-formControl-1006 MuiButton-containedPrimary Mui-disabled MuiButton-fullWidth Mui-disabled"
                         disabled=""
                         tabindex="-1"
                         type="submit"
@@ -827,7 +827,7 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
                     </div>
                   </div>
                   <div
-                    class="makeStyles-paper-981"
+                    class="makeStyles-paper-1002"
                     style="height: 700px; width: 100%;"
                   >
                     <table
@@ -845,14 +845,14 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
                           >
                             <span
                               aria-disabled="false"
-                              class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-1025 MuiCheckbox-root MuiCheckbox-colorSecondary MuiIconButton-colorSecondary"
+                              class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-1047 MuiCheckbox-root MuiCheckbox-colorSecondary MuiIconButton-colorSecondary"
                             >
                               <span
                                 class="MuiIconButton-label"
                               >
                                 <input
                                   aria-label="select all desserts"
-                                  class="PrivateSwitchBase-input-1028"
+                                  class="PrivateSwitchBase-input-1050"
                                   data-indeterminate="false"
                                   type="checkbox"
                                   value=""
@@ -886,7 +886,7 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
                             >
                               VIN
                               <span
-                                class="makeStyles-hiddenSortSpan-1004"
+                                class="makeStyles-hiddenSortSpan-1026"
                               >
                                 sorted ascending
                               </span>
@@ -1166,10 +1166,10 @@ exports[`App Route /carupdate-deploy unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-152"
+      class="makeStyles-root-155"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-153 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-156 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -1182,21 +1182,21 @@ exports[`App Route /carupdate-deploy unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-160"
+        class="makeStyles-content-164"
       >
         <div
-          class="makeStyles-drawerHeader-159"
+          class="makeStyles-drawerHeader-162"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-141"
+            class="makeStyles-paper-144"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-144 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-147 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -1223,10 +1223,10 @@ exports[`App Route /carupdate-status authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-754"
+      class="makeStyles-root-770"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-755 makeStyles-appBarShift-756 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-771 makeStyles-appBarShift-772 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -1239,7 +1239,7 @@ exports[`App Route /carupdate-status authenticated 1`] = `
             </h6>
           </div>
           <div
-            class="makeStyles-rightToolbar-764"
+            class="makeStyles-rightToolbar-781"
             color="inherit"
           >
             <button
@@ -1262,17 +1262,17 @@ exports[`App Route /carupdate-status authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-759"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-775"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-760 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-776 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-761"
+            class="makeStyles-drawerHeader-777 makeStyles-drawerHeaderLogo-778"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-770"
+              class="makeStyles-logo-787"
               src="fisker-badge.svg"
             />
           </div>
@@ -1483,10 +1483,10 @@ exports[`App Route /carupdate-status authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-762 makeStyles-contentShift-763"
+        class="makeStyles-content-779 makeStyles-contentShift-780"
       >
         <div
-          class="makeStyles-drawerHeader-761"
+          class="makeStyles-drawerHeader-777"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
@@ -1495,7 +1495,7 @@ exports[`App Route /carupdate-status authenticated 1`] = `
             data-testid="mocked-updatesprovider"
           >
             <div
-              class="makeStyles-paper-743"
+              class="makeStyles-paper-759"
               style="height: 700px; width: 100%;"
             >
               <table
@@ -1683,10 +1683,10 @@ exports[`App Route /carupdate-status unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-198"
+      class="makeStyles-root-202"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-199 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-203 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -1699,21 +1699,21 @@ exports[`App Route /carupdate-status unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-206"
+        class="makeStyles-content-211"
       >
         <div
-          class="makeStyles-drawerHeader-205"
+          class="makeStyles-drawerHeader-209"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-187"
+            class="makeStyles-paper-191"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-190 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-194 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -1740,10 +1740,10 @@ exports[`App Route /datascope authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-1042"
+      class="makeStyles-root-1064"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1043 makeStyles-appBarShift-1044 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1065 makeStyles-appBarShift-1066 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -1756,7 +1756,7 @@ exports[`App Route /datascope authenticated 1`] = `
             </h6>
           </div>
           <div
-            class="makeStyles-rightToolbar-1052"
+            class="makeStyles-rightToolbar-1075"
             color="inherit"
           >
             <button
@@ -1779,17 +1779,17 @@ exports[`App Route /datascope authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1047"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1069"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1048 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1070 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-1049"
+            class="makeStyles-drawerHeader-1071 makeStyles-drawerHeaderLogo-1072"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-1058"
+              class="makeStyles-logo-1081"
               src="fisker-badge.svg"
             />
           </div>
@@ -2000,34 +2000,34 @@ exports[`App Route /datascope authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-1050 makeStyles-contentShift-1051"
+        class="makeStyles-content-1073 makeStyles-contentShift-1074"
       >
         <div
-          class="makeStyles-drawerHeader-1049"
+          class="makeStyles-drawerHeader-1071"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-1031"
+            class="makeStyles-paper-1053"
           >
             <div
-              class="MuiGrid-root makeStyles-root-1042 MuiGrid-container MuiGrid-spacing-xs-2"
+              class="MuiGrid-root makeStyles-root-1064 MuiGrid-container MuiGrid-spacing-xs-2"
             >
               <div
                 class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
               >
                 <div
-                  class="MuiPaper-root makeStyles-grafanaContainer-1072 MuiPaper-elevation1 MuiPaper-rounded"
+                  class="MuiPaper-root makeStyles-grafanaContainer-1095 MuiPaper-elevation1 MuiPaper-rounded"
                   style="height: 150px;"
                 >
                   <h1
-                    class="makeStyles-datascopeContainerValue-1074"
+                    class="makeStyles-datascopeContainerValue-1097"
                   >
                     500
                   </h1>
                   <h2
-                    class="makeStyles-datascopeContainerText-1073"
+                    class="makeStyles-datascopeContainerText-1096"
                   >
                     Cars
                   </h2>
@@ -2037,16 +2037,16 @@ exports[`App Route /datascope authenticated 1`] = `
                 class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
               >
                 <div
-                  class="MuiPaper-root makeStyles-grafanaContainer-1072 MuiPaper-elevation1 MuiPaper-rounded"
+                  class="MuiPaper-root makeStyles-grafanaContainer-1095 MuiPaper-elevation1 MuiPaper-rounded"
                   style="height: 150px;"
                 >
                   <h1
-                    class="makeStyles-datascopeContainerValue-1074"
+                    class="makeStyles-datascopeContainerValue-1097"
                   >
                     1,234,567,890
                   </h1>
                   <h2
-                    class="makeStyles-datascopeContainerText-1073"
+                    class="makeStyles-datascopeContainerText-1096"
                   >
                     Signals Collected
                   </h2>
@@ -2056,10 +2056,10 @@ exports[`App Route /datascope authenticated 1`] = `
                 class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-12"
               >
                 <div
-                  class="MuiPaper-root makeStyles-grafanaContainer-1072 MuiPaper-elevation1 MuiPaper-rounded"
+                  class="MuiPaper-root makeStyles-grafanaContainer-1095 MuiPaper-elevation1 MuiPaper-rounded"
                 >
                   <div
-                    class="makeStyles-embeddedWrapper-1060"
+                    class="makeStyles-embeddedWrapper-1083"
                   >
                     <iframe
                       frameborder="0"
@@ -2115,10 +2115,10 @@ exports[`App Route /datascope unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-336"
+      class="makeStyles-root-343"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-337 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-344 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -2131,21 +2131,21 @@ exports[`App Route /datascope unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-344"
+        class="makeStyles-content-352"
       >
         <div
-          class="makeStyles-drawerHeader-343"
+          class="makeStyles-drawerHeader-350"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-325"
+            class="makeStyles-paper-332"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-328 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-335 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -2172,10 +2172,10 @@ exports[`App Route /datascope/battery authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-1088"
+      class="makeStyles-root-1111"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1089 makeStyles-appBarShift-1090 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1112 makeStyles-appBarShift-1113 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -2224,7 +2224,7 @@ exports[`App Route /datascope/battery authenticated 1`] = `
             </nav>
           </div>
           <div
-            class="makeStyles-rightToolbar-1098"
+            class="makeStyles-rightToolbar-1122"
             color="inherit"
           >
             <button
@@ -2247,17 +2247,17 @@ exports[`App Route /datascope/battery authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1093"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1116"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1094 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1117 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-1095"
+            class="makeStyles-drawerHeader-1118 makeStyles-drawerHeaderLogo-1119"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-1104"
+              class="makeStyles-logo-1128"
               src="fisker-badge.svg"
             />
           </div>
@@ -2468,16 +2468,16 @@ exports[`App Route /datascope/battery authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-1096 makeStyles-contentShift-1097"
+        class="makeStyles-content-1120 makeStyles-contentShift-1121"
       >
         <div
-          class="makeStyles-drawerHeader-1095"
+          class="makeStyles-drawerHeader-1118"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-1077"
+            class="makeStyles-paper-1100"
           >
             <div
               class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-2"
@@ -2490,10 +2490,10 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                   class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-12"
                 >
                   <div
-                    class="MuiPaper-root makeStyles-grafanaContainer-1118 MuiPaper-elevation1 MuiPaper-rounded"
+                    class="MuiPaper-root makeStyles-grafanaContainer-1142 MuiPaper-elevation1 MuiPaper-rounded"
                   >
                     <form
-                      class="makeStyles-formControl-1081"
+                      class="makeStyles-formControl-1104"
                     >
                       <div
                         class="MuiFormControl-root MuiTextField-root"
@@ -2519,10 +2519,10 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                           />
                           <fieldset
                             aria-hidden="true"
-                            class="PrivateNotchedOutline-root-1121 MuiOutlinedInput-notchedOutline"
+                            class="PrivateNotchedOutline-root-1145 MuiOutlinedInput-notchedOutline"
                           >
                             <legend
-                              class="PrivateNotchedOutline-legendLabelled-1123 PrivateNotchedOutline-legendNotched-1124"
+                              class="PrivateNotchedOutline-legendLabelled-1147 PrivateNotchedOutline-legendNotched-1148"
                             >
                               <span>
                                 VIN
@@ -2533,7 +2533,7 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                       </div>
                     </form>
                     <div
-                      class="MuiFormControl-root makeStyles-formControl-1081"
+                      class="MuiFormControl-root makeStyles-formControl-1104"
                     >
                       <label
                         class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-filled"
@@ -2573,10 +2573,10 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                         </svg>
                         <fieldset
                           aria-hidden="true"
-                          class="PrivateNotchedOutline-root-1121 MuiOutlinedInput-notchedOutline"
+                          class="PrivateNotchedOutline-root-1145 MuiOutlinedInput-notchedOutline"
                         >
                           <legend
-                            class="PrivateNotchedOutline-legendLabelled-1123 PrivateNotchedOutline-legendNotched-1124"
+                            class="PrivateNotchedOutline-legendLabelled-1147 PrivateNotchedOutline-legendNotched-1148"
                           >
                             <span>
                               Cell
@@ -2591,12 +2591,12 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                   class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-12"
                 >
                   <div
-                    class="MuiPaper-root makeStyles-grafanaContainer-1118 MuiPaper-elevation1 MuiPaper-rounded"
+                    class="MuiPaper-root makeStyles-grafanaContainer-1142 MuiPaper-elevation1 MuiPaper-rounded"
                   >
                     Cell Voltage 
                     1
                     <div
-                      class="makeStyles-embeddedWrapper-1106"
+                      class="makeStyles-embeddedWrapper-1130"
                     >
                       <iframe
                         frameborder="0"
@@ -2611,12 +2611,12 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                   class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-12"
                 >
                   <div
-                    class="MuiPaper-root makeStyles-grafanaContainer-1118 MuiPaper-elevation1 MuiPaper-rounded"
+                    class="MuiPaper-root makeStyles-grafanaContainer-1142 MuiPaper-elevation1 MuiPaper-rounded"
                   >
                     Cell Temperature 
                     1
                     <div
-                      class="makeStyles-embeddedWrapper-1106"
+                      class="makeStyles-embeddedWrapper-1130"
                     >
                       <iframe
                         frameborder="0"
@@ -2631,10 +2631,10 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                   class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-12"
                 >
                   <div
-                    class="MuiPaper-root makeStyles-grafanaContainer-1118 MuiPaper-elevation1 MuiPaper-rounded"
+                    class="MuiPaper-root makeStyles-grafanaContainer-1142 MuiPaper-elevation1 MuiPaper-rounded"
                   >
                     <div
-                      class="makeStyles-embeddedWrapper-1106"
+                      class="makeStyles-embeddedWrapper-1130"
                     >
                       <iframe
                         frameborder="0"
@@ -2654,10 +2654,10 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                   class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-12"
                 >
                   <div
-                    class="MuiPaper-root makeStyles-grafanaContainer-1118 MuiPaper-elevation1 MuiPaper-rounded"
+                    class="MuiPaper-root makeStyles-grafanaContainer-1142 MuiPaper-elevation1 MuiPaper-rounded"
                   >
                     <div
-                      class="makeStyles-embeddedWrapper-1106"
+                      class="makeStyles-embeddedWrapper-1130"
                     >
                       <iframe
                         frameborder="0"
@@ -2672,10 +2672,10 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                   class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-12"
                 >
                   <div
-                    class="MuiPaper-root makeStyles-grafanaContainer-1118 MuiPaper-elevation1 MuiPaper-rounded"
+                    class="MuiPaper-root makeStyles-grafanaContainer-1142 MuiPaper-elevation1 MuiPaper-rounded"
                   >
                     <div
-                      class="makeStyles-embeddedWrapper-1106"
+                      class="makeStyles-embeddedWrapper-1130"
                     >
                       <iframe
                         frameborder="0"
@@ -2690,10 +2690,10 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                   class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
                 >
                   <div
-                    class="MuiPaper-root makeStyles-grafanaContainer-1118 MuiPaper-elevation1 MuiPaper-rounded"
+                    class="MuiPaper-root makeStyles-grafanaContainer-1142 MuiPaper-elevation1 MuiPaper-rounded"
                   >
                     <div
-                      class="makeStyles-embeddedWrapper-1106"
+                      class="makeStyles-embeddedWrapper-1130"
                     >
                       <iframe
                         frameborder="0"
@@ -2708,10 +2708,10 @@ exports[`App Route /datascope/battery authenticated 1`] = `
                   class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
                 >
                   <div
-                    class="MuiPaper-root makeStyles-grafanaContainer-1118 MuiPaper-elevation1 MuiPaper-rounded"
+                    class="MuiPaper-root makeStyles-grafanaContainer-1142 MuiPaper-elevation1 MuiPaper-rounded"
                   >
                     <div
-                      class="makeStyles-embeddedWrapper-1106"
+                      class="makeStyles-embeddedWrapper-1130"
                     >
                       <iframe
                         frameborder="0"
@@ -2738,10 +2738,10 @@ exports[`App Route /datascope/battery unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-382"
+      class="makeStyles-root-390"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-383 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-391 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -2754,21 +2754,21 @@ exports[`App Route /datascope/battery unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-390"
+        class="makeStyles-content-399"
       >
         <div
-          class="makeStyles-drawerHeader-389"
+          class="makeStyles-drawerHeader-397"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-371"
+            class="makeStyles-paper-379"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-374 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-382 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -2795,10 +2795,10 @@ exports[`App Route /home authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-658"
+      class="makeStyles-root-672"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-659 makeStyles-appBarShift-660 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-673 makeStyles-appBarShift-674 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -2811,7 +2811,7 @@ exports[`App Route /home authenticated 1`] = `
             </h6>
           </div>
           <div
-            class="makeStyles-rightToolbar-668"
+            class="makeStyles-rightToolbar-683"
             color="inherit"
           >
             <button
@@ -2834,17 +2834,17 @@ exports[`App Route /home authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-663"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-677"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-664 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-678 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-665"
+            class="makeStyles-drawerHeader-679 makeStyles-drawerHeaderLogo-680"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-674"
+              class="makeStyles-logo-689"
               src="fisker-badge.svg"
             />
           </div>
@@ -3055,16 +3055,16 @@ exports[`App Route /home authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-666 makeStyles-contentShift-667"
+        class="makeStyles-content-681 makeStyles-contentShift-682"
       >
         <div
-          class="makeStyles-drawerHeader-665"
+          class="makeStyles-drawerHeader-679"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-647"
+            class="makeStyles-paper-661"
           >
             <div
               data-testid="mocked-vehicleprovider"
@@ -3188,10 +3188,10 @@ exports[`App Route /home unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-60"
+      class="makeStyles-root-61"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-61 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-62 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -3204,21 +3204,21 @@ exports[`App Route /home unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-68"
+        class="makeStyles-content-70"
       >
         <div
-          class="makeStyles-drawerHeader-67"
+          class="makeStyles-drawerHeader-68"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-49"
+            class="makeStyles-paper-50"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-52 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-53 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -3245,10 +3245,10 @@ exports[`App Route /package-create authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-1280"
+      class="makeStyles-root-1307"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1281 makeStyles-appBarShift-1282 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1308 makeStyles-appBarShift-1309 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -3297,7 +3297,7 @@ exports[`App Route /package-create authenticated 1`] = `
             </nav>
           </div>
           <div
-            class="makeStyles-rightToolbar-1290"
+            class="makeStyles-rightToolbar-1318"
             color="inherit"
           >
             <button
@@ -3320,17 +3320,17 @@ exports[`App Route /package-create authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1285"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1312"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1286 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1313 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-1287"
+            class="makeStyles-drawerHeader-1314 makeStyles-drawerHeaderLogo-1315"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-1296"
+              class="makeStyles-logo-1324"
               src="fisker-badge.svg"
             />
           </div>
@@ -3541,10 +3541,10 @@ exports[`App Route /package-create authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-1288 makeStyles-contentShift-1289"
+        class="makeStyles-content-1316 makeStyles-contentShift-1317"
       >
         <div
-          class="makeStyles-drawerHeader-1287"
+          class="makeStyles-drawerHeader-1314"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
@@ -3553,11 +3553,11 @@ exports[`App Route /package-create authenticated 1`] = `
             data-testid="mocked-manifestsprovider"
           >
             <div
-              class="makeStyles-paper-1269"
+              class="makeStyles-paper-1296"
             >
               <form
                 action="{onSubmit}"
-                class="makeStyles-form-1271"
+                class="makeStyles-form-1298"
                 novalidate=""
               >
                 <div
@@ -3593,10 +3593,10 @@ exports[`App Route /package-create authenticated 1`] = `
                     />
                     <fieldset
                       aria-hidden="true"
-                      class="PrivateNotchedOutline-root-1313 MuiOutlinedInput-notchedOutline"
+                      class="PrivateNotchedOutline-root-1341 MuiOutlinedInput-notchedOutline"
                     >
                       <legend
-                        class="PrivateNotchedOutline-legendLabelled-1315"
+                        class="PrivateNotchedOutline-legendLabelled-1343"
                       >
                         <span>
                           Package name
@@ -3639,10 +3639,10 @@ exports[`App Route /package-create authenticated 1`] = `
                     />
                     <fieldset
                       aria-hidden="true"
-                      class="PrivateNotchedOutline-root-1313 MuiOutlinedInput-notchedOutline"
+                      class="PrivateNotchedOutline-root-1341 MuiOutlinedInput-notchedOutline"
                     >
                       <legend
-                        class="PrivateNotchedOutline-legendLabelled-1315"
+                        class="PrivateNotchedOutline-legendLabelled-1343"
                       >
                         <span>
                           Version
@@ -3685,10 +3685,10 @@ exports[`App Route /package-create authenticated 1`] = `
                     />
                     <fieldset
                       aria-hidden="true"
-                      class="PrivateNotchedOutline-root-1313 MuiOutlinedInput-notchedOutline"
+                      class="PrivateNotchedOutline-root-1341 MuiOutlinedInput-notchedOutline"
                     >
                       <legend
-                        class="PrivateNotchedOutline-legendLabelled-1315"
+                        class="PrivateNotchedOutline-legendLabelled-1343"
                       >
                         <span>
                           Description
@@ -3732,10 +3732,10 @@ exports[`App Route /package-create authenticated 1`] = `
                     />
                     <fieldset
                       aria-hidden="true"
-                      class="PrivateNotchedOutline-root-1313 MuiOutlinedInput-notchedOutline"
+                      class="PrivateNotchedOutline-root-1341 MuiOutlinedInput-notchedOutline"
                     >
                       <legend
-                        class="PrivateNotchedOutline-legendLabelled-1315"
+                        class="PrivateNotchedOutline-legendLabelled-1343"
                       >
                         <span>
                           Release Notes URL
@@ -3832,7 +3832,7 @@ exports[`App Route /package-create authenticated 1`] = `
                   </div>
                 </div>
                 <button
-                  class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-1272 MuiButton-containedPrimary MuiButton-fullWidth"
+                  class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-1299 MuiButton-containedPrimary MuiButton-fullWidth"
                   tabindex="0"
                   type="submit"
                 >
@@ -3861,10 +3861,10 @@ exports[`App Route /package-create unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-566"
+      class="makeStyles-root-578"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-567 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-579 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -3877,21 +3877,21 @@ exports[`App Route /package-create unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-574"
+        class="makeStyles-content-587"
       >
         <div
-          class="makeStyles-drawerHeader-573"
+          class="makeStyles-drawerHeader-585"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-555"
+            class="makeStyles-paper-567"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-558 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-570 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -3918,10 +3918,10 @@ exports[`App Route /package-deploy authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-1230"
+      class="makeStyles-root-1256"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1231 makeStyles-appBarShift-1232 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1257 makeStyles-appBarShift-1258 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -3970,7 +3970,7 @@ exports[`App Route /package-deploy authenticated 1`] = `
             </nav>
           </div>
           <div
-            class="makeStyles-rightToolbar-1240"
+            class="makeStyles-rightToolbar-1267"
             color="inherit"
           >
             <button
@@ -3993,17 +3993,17 @@ exports[`App Route /package-deploy authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1235"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1261"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1236 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1262 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-1237"
+            class="makeStyles-drawerHeader-1263 makeStyles-drawerHeaderLogo-1264"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-1246"
+              class="makeStyles-logo-1273"
               src="fisker-badge.svg"
             />
           </div>
@@ -4214,10 +4214,10 @@ exports[`App Route /package-deploy authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-1238 makeStyles-contentShift-1239"
+        class="makeStyles-content-1265 makeStyles-contentShift-1266"
       >
         <div
-          class="makeStyles-drawerHeader-1237"
+          class="makeStyles-drawerHeader-1263"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
@@ -4232,11 +4232,11 @@ exports[`App Route /package-deploy authenticated 1`] = `
                 data-testid="mocked-carupdatesprovider"
               >
                 <div
-                  class="makeStyles-paper-1219"
+                  class="makeStyles-paper-1245"
                 >
                   <form
                     action="{onSubmit}"
-                    class="makeStyles-form-1221"
+                    class="makeStyles-form-1247"
                     novalidate=""
                   >
                     <p
@@ -4247,13 +4247,23 @@ exports[`App Route /package-deploy authenticated 1`] = `
                       .
                     </p>
                     <div
-                      class="MuiGrid-root makeStyles-root-1230 MuiGrid-container MuiGrid-spacing-xs-2"
+                      class="MuiGrid-root makeStyles-root-1256 MuiGrid-container MuiGrid-spacing-xs-2"
                     >
                       <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-10"
+                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-2"
                       >
                         <div
-                          class="MuiFormControl-root makeStyles-margin-1243 makeStyles-textField-1244"
+                          class="makeStyles-labelInline-1251"
+                        >
+                          0 Selected
+                        </div>
+                      </div>
+                      <div
+                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-8"
+                        style="text-align: center;"
+                      >
+                        <div
+                          class="MuiFormControl-root makeStyles-margin-1270 makeStyles-textField-1271"
                         >
                           <label
                             class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
@@ -4302,18 +4312,13 @@ exports[`App Route /package-deploy authenticated 1`] = `
                             </div>
                           </div>
                         </div>
-                        <div
-                          class="makeStyles-labelInline-1225"
-                        >
-                          0 Selected
-                        </div>
                       </div>
                       <div
                         class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-2"
                         style="text-align: right;"
                       >
                         <button
-                          class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-formControl-1223 MuiButton-containedPrimary Mui-disabled MuiButton-fullWidth Mui-disabled"
+                          class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-formControl-1249 MuiButton-containedPrimary Mui-disabled Mui-disabled"
                           disabled=""
                           tabindex="-1"
                           type="submit"
@@ -4327,7 +4332,7 @@ exports[`App Route /package-deploy authenticated 1`] = `
                       </div>
                     </div>
                     <div
-                      class="makeStyles-paper-1219"
+                      class="makeStyles-paper-1245"
                       style="height: 700px; width: 100%;"
                     >
                       <table
@@ -4345,14 +4350,14 @@ exports[`App Route /package-deploy authenticated 1`] = `
                             >
                               <span
                                 aria-disabled="false"
-                                class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-1263 MuiCheckbox-root MuiCheckbox-colorSecondary MuiIconButton-colorSecondary"
+                                class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-1290 MuiCheckbox-root MuiCheckbox-colorSecondary MuiIconButton-colorSecondary"
                               >
                                 <span
                                   class="MuiIconButton-label"
                                 >
                                   <input
                                     aria-label="select all desserts"
-                                    class="PrivateSwitchBase-input-1266"
+                                    class="PrivateSwitchBase-input-1293"
                                     data-indeterminate="false"
                                     type="checkbox"
                                     value=""
@@ -4386,7 +4391,7 @@ exports[`App Route /package-deploy authenticated 1`] = `
                               >
                                 VIN
                                 <span
-                                  class="makeStyles-hiddenSortSpan-1242"
+                                  class="makeStyles-hiddenSortSpan-1269"
                                 >
                                   sorted ascending
                                 </span>
@@ -4667,10 +4672,10 @@ exports[`App Route /package-deploy unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-520"
+      class="makeStyles-root-531"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-521 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-532 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -4683,21 +4688,21 @@ exports[`App Route /package-deploy unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-528"
+        class="makeStyles-content-540"
       >
         <div
-          class="makeStyles-drawerHeader-527"
+          class="makeStyles-drawerHeader-538"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-509"
+            class="makeStyles-paper-520"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-512 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-523 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -4724,10 +4729,10 @@ exports[`App Route /package-status authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-1184"
+      class="makeStyles-root-1209"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1185 makeStyles-appBarShift-1186 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1210 makeStyles-appBarShift-1211 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -4776,7 +4781,7 @@ exports[`App Route /package-status authenticated 1`] = `
             </nav>
           </div>
           <div
-            class="makeStyles-rightToolbar-1194"
+            class="makeStyles-rightToolbar-1220"
             color="inherit"
           >
             <button
@@ -4799,17 +4804,17 @@ exports[`App Route /package-status authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1189"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1214"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1190 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1215 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-1191"
+            class="makeStyles-drawerHeader-1216 makeStyles-drawerHeaderLogo-1217"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-1200"
+              class="makeStyles-logo-1226"
               src="fisker-badge.svg"
             />
           </div>
@@ -5020,10 +5025,10 @@ exports[`App Route /package-status authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-1192 makeStyles-contentShift-1193"
+        class="makeStyles-content-1218 makeStyles-contentShift-1219"
       >
         <div
-          class="makeStyles-drawerHeader-1191"
+          class="makeStyles-drawerHeader-1216"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
@@ -5035,7 +5040,7 @@ exports[`App Route /package-status authenticated 1`] = `
               data-testid="mocked-carupdatesprovider"
             >
               <div
-                class="makeStyles-paper-1173"
+                class="makeStyles-paper-1198"
                 style="height: 700px; width: 100%;"
               >
                 <table
@@ -5258,10 +5263,10 @@ exports[`App Route /package-status unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-474"
+      class="makeStyles-root-484"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-475 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-485 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -5274,21 +5279,21 @@ exports[`App Route /package-status unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-482"
+        class="makeStyles-content-493"
       >
         <div
-          class="makeStyles-drawerHeader-481"
+          class="makeStyles-drawerHeader-491"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-463"
+            class="makeStyles-paper-473"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-466 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-476 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -5315,10 +5320,10 @@ exports[`App Route /packages authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-1138"
+      class="makeStyles-root-1162"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1139 makeStyles-appBarShift-1140 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-1163 makeStyles-appBarShift-1164 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -5331,7 +5336,7 @@ exports[`App Route /packages authenticated 1`] = `
             </h6>
           </div>
           <div
-            class="makeStyles-rightToolbar-1148"
+            class="makeStyles-rightToolbar-1173"
             color="inherit"
           >
             <button
@@ -5354,17 +5359,17 @@ exports[`App Route /packages authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1143"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-1167"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1144 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-1168 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-1145"
+            class="makeStyles-drawerHeader-1169 makeStyles-drawerHeaderLogo-1170"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-1154"
+              class="makeStyles-logo-1179"
               src="fisker-badge.svg"
             />
           </div>
@@ -5575,10 +5580,10 @@ exports[`App Route /packages authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-1146 makeStyles-contentShift-1147"
+        class="makeStyles-content-1171 makeStyles-contentShift-1172"
       >
         <div
-          class="makeStyles-drawerHeader-1145"
+          class="makeStyles-drawerHeader-1169"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
@@ -5587,77 +5592,91 @@ exports[`App Route /packages authenticated 1`] = `
             data-testid="mocked-manifestsprovider"
           >
             <div
-              class="makeStyles-paper-1127"
+              class="makeStyles-paper-1151"
               style="height: 700px; width: 100%;"
             >
               <div
-                class="MuiToolbar-root MuiToolbar-regular makeStyles-tableToolbar-1153 MuiToolbar-gutters"
+                class="MuiGrid-root makeStyles-root-1162 MuiGrid-container MuiGrid-spacing-xs-2"
               >
-                <a
-                  class="makeStyles-labelInline-1133"
-                  href="/package-create"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"
-                    />
-                  </svg>
-                </a>
                 <div
-                  class="MuiFormControl-root makeStyles-margin-1151 makeStyles-textField-1152"
+                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-4"
+                  style="text-align: justify;"
                 >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
-                    data-shrink="false"
-                    for="search"
+                  <a
+                    class="makeStyles-labelInline-1157"
+                    href="/package-create"
                   >
-                    Search
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-formControl MuiInput-formControl MuiInputBase-adornedEnd"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd"
-                      id="search"
-                      type="text"
-                      value=""
-                    />
-                    <div
-                      class="MuiInputAdornment-root MuiInputAdornment-positionEnd"
+                    <svg
+                      aria-hidden="true"
+                      class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge"
+                      focusable="false"
+                      viewBox="0 0 24 24"
                     >
-                      <button
-                        aria-label="search"
-                        class="MuiButtonBase-root MuiIconButton-root"
-                        tabindex="0"
-                        type="button"
+                      <path
+                        d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"
+                      />
+                    </svg>
+                  </a>
+                </div>
+                <div
+                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-4"
+                  style="text-align: center;"
+                >
+                  <div
+                    class="MuiFormControl-root makeStyles-margin-1176 makeStyles-textField-1177"
+                  >
+                    <label
+                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
+                      data-shrink="false"
+                      for="search"
+                    >
+                      Search
+                    </label>
+                    <div
+                      class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-formControl MuiInput-formControl MuiInputBase-adornedEnd"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiInput-input MuiInputBase-inputAdornedEnd"
+                        id="search"
+                        type="text"
+                        value=""
+                      />
+                      <div
+                        class="MuiInputAdornment-root MuiInputAdornment-positionEnd"
                       >
-                        <span
-                          class="MuiIconButton-label"
+                        <button
+                          aria-label="search"
+                          class="MuiButtonBase-root MuiIconButton-root"
+                          tabindex="0"
+                          type="button"
                         >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root"
-                            focusable="false"
-                            viewBox="0 0 24 24"
+                          <span
+                            class="MuiIconButton-label"
                           >
-                            <path
-                              d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-                            />
-                          </svg>
-                        </span>
-                        <span
-                          class="MuiTouchRipple-root"
-                        />
-                      </button>
+                            <svg
+                              aria-hidden="true"
+                              class="MuiSvgIcon-root"
+                              focusable="false"
+                              viewBox="0 0 24 24"
+                            >
+                              <path
+                                d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
+                              />
+                            </svg>
+                          </span>
+                          <span
+                            class="MuiTouchRipple-root"
+                          />
+                        </button>
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-4"
+                  style="text-align: right;"
+                />
               </div>
               <table
                 class="MuiTable-root"
@@ -5681,7 +5700,7 @@ exports[`App Route /packages authenticated 1`] = `
                       >
                         ID
                         <span
-                          class="makeStyles-hiddenSortSpan-1150"
+                          class="makeStyles-hiddenSortSpan-1175"
                         >
                           sorted ascending
                         </span>
@@ -6028,10 +6047,10 @@ exports[`App Route /packages unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-428"
+      class="makeStyles-root-437"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-429 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-438 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -6044,21 +6063,21 @@ exports[`App Route /packages unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-436"
+        class="makeStyles-content-446"
       >
         <div
-          class="makeStyles-drawerHeader-435"
+          class="makeStyles-drawerHeader-444"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-417"
+            class="makeStyles-paper-426"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-420 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-429 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -6085,10 +6104,10 @@ exports[`App Route /page-not-found authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-946"
+      class="makeStyles-root-966"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-947 makeStyles-appBarShift-948 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-967 makeStyles-appBarShift-968 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -6099,7 +6118,7 @@ exports[`App Route /page-not-found authenticated 1`] = `
             />
           </div>
           <div
-            class="makeStyles-rightToolbar-956"
+            class="makeStyles-rightToolbar-977"
             color="inherit"
           >
             <button
@@ -6122,17 +6141,17 @@ exports[`App Route /page-not-found authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-951"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-971"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-952 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-972 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-953"
+            class="makeStyles-drawerHeader-973 makeStyles-drawerHeaderLogo-974"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-962"
+              class="makeStyles-logo-983"
               src="fisker-badge.svg"
             />
           </div>
@@ -6343,16 +6362,16 @@ exports[`App Route /page-not-found authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-954 makeStyles-contentShift-955"
+        class="makeStyles-content-975 makeStyles-contentShift-976"
       >
         <div
-          class="makeStyles-drawerHeader-953"
+          class="makeStyles-drawerHeader-973"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-935"
+            class="makeStyles-paper-955"
           >
             <h1
               class="MuiTypography-root MuiTypography-h2"
@@ -6373,10 +6392,10 @@ exports[`App Route /page-not-found unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-900"
+      class="makeStyles-root-919"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-901 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-920 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -6389,16 +6408,16 @@ exports[`App Route /page-not-found unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-908"
+        class="makeStyles-content-928"
       >
         <div
-          class="makeStyles-drawerHeader-907"
+          class="makeStyles-drawerHeader-926"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-889"
+            class="makeStyles-paper-908"
           >
             <h1
               class="MuiTypography-root MuiTypography-h2"
@@ -6419,10 +6438,10 @@ exports[`App Route /vehicle-add authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-704"
+      class="makeStyles-root-719"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-705 makeStyles-appBarShift-706 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-720 makeStyles-appBarShift-721 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -6471,7 +6490,7 @@ exports[`App Route /vehicle-add authenticated 1`] = `
             </nav>
           </div>
           <div
-            class="makeStyles-rightToolbar-714"
+            class="makeStyles-rightToolbar-730"
             color="inherit"
           >
             <button
@@ -6494,17 +6513,17 @@ exports[`App Route /vehicle-add authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-709"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-724"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-710 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-725 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-711"
+            class="makeStyles-drawerHeader-726 makeStyles-drawerHeaderLogo-727"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-720"
+              class="makeStyles-logo-736"
               src="fisker-badge.svg"
             />
           </div>
@@ -6715,10 +6734,10 @@ exports[`App Route /vehicle-add authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-712 makeStyles-contentShift-713"
+        class="makeStyles-content-728 makeStyles-contentShift-729"
       >
         <div
-          class="makeStyles-drawerHeader-711"
+          class="makeStyles-drawerHeader-726"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
@@ -6727,11 +6746,11 @@ exports[`App Route /vehicle-add authenticated 1`] = `
             data-testid="mocked-vehicleprovider"
           >
             <div
-              class="makeStyles-paper-693"
+              class="makeStyles-paper-708"
             >
               <form
                 action="{onSubmit}"
-                class="makeStyles-form-695"
+                class="makeStyles-form-710"
                 novalidate=""
               >
                 <div
@@ -6767,10 +6786,10 @@ exports[`App Route /vehicle-add authenticated 1`] = `
                     />
                     <fieldset
                       aria-hidden="true"
-                      class="PrivateNotchedOutline-root-737 MuiOutlinedInput-notchedOutline"
+                      class="PrivateNotchedOutline-root-753 MuiOutlinedInput-notchedOutline"
                     >
                       <legend
-                        class="PrivateNotchedOutline-legendLabelled-739"
+                        class="PrivateNotchedOutline-legendLabelled-755"
                       >
                         <span>
                           VIN
@@ -6813,10 +6832,10 @@ exports[`App Route /vehicle-add authenticated 1`] = `
                     />
                     <fieldset
                       aria-hidden="true"
-                      class="PrivateNotchedOutline-root-737 MuiOutlinedInput-notchedOutline"
+                      class="PrivateNotchedOutline-root-753 MuiOutlinedInput-notchedOutline"
                     >
                       <legend
-                        class="PrivateNotchedOutline-legendLabelled-739 PrivateNotchedOutline-legendNotched-740"
+                        class="PrivateNotchedOutline-legendLabelled-755 PrivateNotchedOutline-legendNotched-756"
                       >
                         <span>
                           Model
@@ -6860,10 +6879,10 @@ exports[`App Route /vehicle-add authenticated 1`] = `
                     />
                     <fieldset
                       aria-hidden="true"
-                      class="PrivateNotchedOutline-root-737 MuiOutlinedInput-notchedOutline"
+                      class="PrivateNotchedOutline-root-753 MuiOutlinedInput-notchedOutline"
                     >
                       <legend
-                        class="PrivateNotchedOutline-legendLabelled-739 PrivateNotchedOutline-legendNotched-740"
+                        class="PrivateNotchedOutline-legendLabelled-755 PrivateNotchedOutline-legendNotched-756"
                       >
                         <span>
                           Year
@@ -6907,10 +6926,10 @@ exports[`App Route /vehicle-add authenticated 1`] = `
                     />
                     <fieldset
                       aria-hidden="true"
-                      class="PrivateNotchedOutline-root-737 MuiOutlinedInput-notchedOutline"
+                      class="PrivateNotchedOutline-root-753 MuiOutlinedInput-notchedOutline"
                     >
                       <legend
-                        class="PrivateNotchedOutline-legendLabelled-739 PrivateNotchedOutline-legendNotched-740"
+                        class="PrivateNotchedOutline-legendLabelled-755 PrivateNotchedOutline-legendNotched-756"
                       >
                         <span>
                           Trim
@@ -6921,7 +6940,7 @@ exports[`App Route /vehicle-add authenticated 1`] = `
                   </div>
                 </div>
                 <button
-                  class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-696 MuiButton-containedPrimary MuiButton-fullWidth"
+                  class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-711 MuiButton-containedPrimary MuiButton-fullWidth"
                   tabindex="0"
                   type="submit"
                 >
@@ -6950,10 +6969,10 @@ exports[`App Route /vehicle-add unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-106"
+      class="makeStyles-root-108"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-107 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-109 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -6966,21 +6985,21 @@ exports[`App Route /vehicle-add unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-114"
+        class="makeStyles-content-117"
       >
         <div
-          class="makeStyles-drawerHeader-113"
+          class="makeStyles-drawerHeader-115"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-95"
+            class="makeStyles-paper-97"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-98 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-100 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -7007,10 +7026,10 @@ exports[`App Route /vehicle-status authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-854"
+      class="makeStyles-root-872"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-855 makeStyles-appBarShift-856 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-873 makeStyles-appBarShift-874 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -7059,7 +7078,7 @@ exports[`App Route /vehicle-status authenticated 1`] = `
             </nav>
           </div>
           <div
-            class="makeStyles-rightToolbar-864"
+            class="makeStyles-rightToolbar-883"
             color="inherit"
           >
             <button
@@ -7082,17 +7101,17 @@ exports[`App Route /vehicle-status authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-859"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-877"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-860 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-878 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-861"
+            class="makeStyles-drawerHeader-879 makeStyles-drawerHeaderLogo-880"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-870"
+              class="makeStyles-logo-889"
               src="fisker-badge.svg"
             />
           </div>
@@ -7303,10 +7322,10 @@ exports[`App Route /vehicle-status authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-862 makeStyles-contentShift-863"
+        class="makeStyles-content-881 makeStyles-contentShift-882"
       >
         <div
-          class="makeStyles-drawerHeader-861"
+          class="makeStyles-drawerHeader-879"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
@@ -7318,7 +7337,7 @@ exports[`App Route /vehicle-status authenticated 1`] = `
               data-testid="mocked-updatesprovider"
             >
               <div
-                class="makeStyles-paper-843"
+                class="makeStyles-paper-861"
                 style="height: 700px; width: 100%;"
               >
                 <table
@@ -7343,7 +7362,7 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                         >
                           ID
                           <span
-                            class="makeStyles-hiddenSortSpan-866"
+                            class="makeStyles-hiddenSortSpan-885"
                           >
                             sorted descending
                           </span>
@@ -7598,10 +7617,10 @@ exports[`App Route /vehicle-status unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-290"
+      class="makeStyles-root-296"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-291 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-297 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -7614,21 +7633,21 @@ exports[`App Route /vehicle-status unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-298"
+        class="makeStyles-content-305"
       >
         <div
-          class="makeStyles-drawerHeader-297"
+          class="makeStyles-drawerHeader-303"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-279"
+            class="makeStyles-paper-285"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-282 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-288 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
@@ -7655,10 +7674,10 @@ exports[`App Route /vehicles authenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-800"
+      class="makeStyles-root-817"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-801 makeStyles-appBarShift-802 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-818 makeStyles-appBarShift-819 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -7671,7 +7690,7 @@ exports[`App Route /vehicles authenticated 1`] = `
             </h6>
           </div>
           <div
-            class="makeStyles-rightToolbar-810"
+            class="makeStyles-rightToolbar-828"
             color="inherit"
           >
             <button
@@ -7694,17 +7713,17 @@ exports[`App Route /vehicles authenticated 1`] = `
         </div>
       </header>
       <div
-        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-805"
+        class="MuiDrawer-root MuiDrawer-docked makeStyles-drawer-822"
       >
         <div
-          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-806 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
+          class="MuiPaper-root MuiDrawer-paper makeStyles-drawerPaper-823 MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft MuiPaper-elevation0"
         >
           <div
-            class="makeStyles-drawerHeader-807"
+            class="makeStyles-drawerHeader-824 makeStyles-drawerHeaderLogo-825"
           >
             <img
               alt="Fisker Admin Portal"
-              class="makeStyles-logo-816"
+              class="makeStyles-logo-834"
               src="fisker-badge.svg"
             />
           </div>
@@ -7915,10 +7934,10 @@ exports[`App Route /vehicles authenticated 1`] = `
         </div>
       </div>
       <main
-        class="makeStyles-content-808 makeStyles-contentShift-809"
+        class="makeStyles-content-826 makeStyles-contentShift-827"
       >
         <div
-          class="makeStyles-drawerHeader-807"
+          class="makeStyles-drawerHeader-824"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
@@ -7927,17 +7946,17 @@ exports[`App Route /vehicles authenticated 1`] = `
             data-testid="mocked-vehicleprovider"
           >
             <div
-              class="makeStyles-paper-789"
+              class="makeStyles-paper-806"
               style="height: 700px; width: 100%;"
             >
               <div
-                class="MuiGrid-root makeStyles-root-800 MuiGrid-container MuiGrid-spacing-xs-2"
+                class="MuiGrid-root makeStyles-root-817 MuiGrid-container MuiGrid-spacing-xs-2"
               >
                 <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
+                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-4"
+                  style="text-align: justify;"
                 >
                   <a
-                    class="makeStyles-labelInline-795"
                     href="/vehicle-add"
                   >
                     <svg
@@ -7952,7 +7971,17 @@ exports[`App Route /vehicles authenticated 1`] = `
                     </svg>
                   </a>
                   <div
-                    class="MuiFormControl-root makeStyles-margin-813 makeStyles-textField-814"
+                    class="makeStyles-labelInline-812"
+                  >
+                    0 Selected
+                  </div>
+                </div>
+                <div
+                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-4"
+                  style="text-align: center;"
+                >
+                  <div
+                    class="MuiFormControl-root makeStyles-margin-831 makeStyles-textField-832"
                   >
                     <label
                       class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated"
@@ -8001,24 +8030,20 @@ exports[`App Route /vehicles authenticated 1`] = `
                       </div>
                     </div>
                   </div>
-                  <div
-                    class="makeStyles-labelInline-795"
-                  >
-                    0 Selected
-                  </div>
                 </div>
                 <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-6"
+                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-4"
                   style="text-align: right;"
                 >
                   <div
-                    class="makeStyles-form-791"
+                    class="makeStyles-form-808"
+                    style="margin-top: 20px;"
                   >
                     <div
-                      class="MuiFormControl-root makeStyles-formControlInline-794"
+                      class="MuiFormControl-root makeStyles-formControlInline-811"
                     >
                       <label
-                        class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-filled"
+                        class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-marginDense MuiInputLabel-outlined MuiFormLabel-filled"
                         data-shrink="true"
                         for="send-command"
                         style="background-color: White;"
@@ -8026,11 +8051,11 @@ exports[`App Route /vehicles authenticated 1`] = `
                         Command
                       </label>
                       <div
-                        class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+                        class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl MuiInputBase-marginDense MuiOutlinedInput-marginDense"
                       >
                         <select
                           aria-invalid="false"
-                          class="MuiSelect-root MuiSelect-select MuiSelect-outlined MuiInputBase-input MuiOutlinedInput-input"
+                          class="MuiSelect-root MuiSelect-select MuiSelect-outlined MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputMarginDense MuiOutlinedInput-inputMarginDense"
                           id="send-command"
                           name="send-command"
                         >
@@ -8077,11 +8102,11 @@ exports[`App Route /vehicles authenticated 1`] = `
                         </svg>
                         <fieldset
                           aria-hidden="true"
-                          class="PrivateNotchedOutline-root-833 MuiOutlinedInput-notchedOutline"
+                          class="PrivateNotchedOutline-root-851 MuiOutlinedInput-notchedOutline"
                           style="padding-left: 8px;"
                         >
                           <legend
-                            class="PrivateNotchedOutline-legend-834"
+                            class="PrivateNotchedOutline-legend-852"
                             style="width: 0.01px;"
                           >
                             <span>
@@ -8092,10 +8117,10 @@ exports[`App Route /vehicles authenticated 1`] = `
                       </div>
                     </div>
                     <div
-                      class="MuiFormControl-root makeStyles-formControlInline-794"
+                      class="MuiFormControl-root makeStyles-formControlInline-811"
                     >
                       <label
-                        class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-filled"
+                        class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-marginDense MuiInputLabel-outlined MuiFormLabel-filled"
                         data-shrink="true"
                         for="send-parameter"
                         style="background-color: White;"
@@ -8103,11 +8128,11 @@ exports[`App Route /vehicles authenticated 1`] = `
                         Parameter
                       </label>
                       <div
-                        class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl"
+                        class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-formControl MuiInputBase-marginDense MuiOutlinedInput-marginDense"
                       >
                         <select
                           aria-invalid="false"
-                          class="MuiSelect-root MuiSelect-select MuiSelect-outlined MuiInputBase-input MuiOutlinedInput-input"
+                          class="MuiSelect-root MuiSelect-select MuiSelect-outlined MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputMarginDense MuiOutlinedInput-inputMarginDense"
                           id="send-parameter"
                           name="send-parameter"
                         >
@@ -8149,11 +8174,11 @@ exports[`App Route /vehicles authenticated 1`] = `
                         </svg>
                         <fieldset
                           aria-hidden="true"
-                          class="PrivateNotchedOutline-root-833 MuiOutlinedInput-notchedOutline"
+                          class="PrivateNotchedOutline-root-851 MuiOutlinedInput-notchedOutline"
                           style="padding-left: 8px;"
                         >
                           <legend
-                            class="PrivateNotchedOutline-legend-834"
+                            class="PrivateNotchedOutline-legend-852"
                             style="width: 0.01px;"
                           >
                             <span>
@@ -8166,7 +8191,7 @@ exports[`App Route /vehicles authenticated 1`] = `
                     <span
                       aria-disabled="true"
                       aria-label="send command"
-                      class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary Mui-disabled Mui-disabled"
+                      class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary Mui-disabled MuiIconButton-sizeSmall Mui-disabled"
                       role="button"
                       tabindex="-1"
                     >
@@ -8189,7 +8214,7 @@ exports[`App Route /vehicles authenticated 1`] = `
                 </div>
               </div>
               <div
-                class="makeStyles-paper-789"
+                class="makeStyles-paper-806"
                 style="height: 700px; width: 100%;"
               >
                 <table
@@ -8207,14 +8232,14 @@ exports[`App Route /vehicles authenticated 1`] = `
                       >
                         <span
                           aria-disabled="false"
-                          class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-837 MuiCheckbox-root MuiCheckbox-colorSecondary MuiIconButton-colorSecondary"
+                          class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-855 MuiCheckbox-root MuiCheckbox-colorSecondary MuiIconButton-colorSecondary"
                         >
                           <span
                             class="MuiIconButton-label"
                           >
                             <input
                               aria-label="select all desserts"
-                              class="PrivateSwitchBase-input-840"
+                              class="PrivateSwitchBase-input-858"
                               data-indeterminate="false"
                               type="checkbox"
                               value=""
@@ -8248,7 +8273,7 @@ exports[`App Route /vehicles authenticated 1`] = `
                         >
                           VIN
                           <span
-                            class="makeStyles-hiddenSortSpan-812"
+                            class="makeStyles-hiddenSortSpan-830"
                           >
                             sorted ascending
                           </span>
@@ -8526,10 +8551,10 @@ exports[`App Route /vehicles unauthenticated 1`] = `
     data-testid="mocked-userprovider"
   >
     <div
-      class="makeStyles-root-244"
+      class="makeStyles-root-249"
     >
       <header
-        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-245 mui-00000fixed MuiPaper-elevation4"
+        class="MuiPaper-root MuiAppBar-root MuiAppBar-positionFixed MuiAppBar-colorPrimary makeStyles-appBar-250 mui-00000fixed MuiPaper-elevation4"
       >
         <div
           class="MuiToolbar-root MuiToolbar-regular MuiToolbar-gutters"
@@ -8542,21 +8567,21 @@ exports[`App Route /vehicles unauthenticated 1`] = `
         </div>
       </header>
       <main
-        class="makeStyles-content-252"
+        class="makeStyles-content-258"
       >
         <div
-          class="makeStyles-drawerHeader-251"
+          class="makeStyles-drawerHeader-256"
         />
         <main
           class="MuiContainer-root MuiContainer-maxWidthLg"
         >
           <div
-            class="makeStyles-paper-233"
+            class="makeStyles-paper-238"
             style="justify-content: center;"
           >
             <a
               aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-236 MuiButton-containedPrimary"
+              class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-241 MuiButton-containedPrimary"
               href="https://cognito.com/authorize?redirect=https://example.com/callback"
               tabindex="0"
             >
diff --git a/src/components/Cars/SendCommand/index.jsx b/src/components/Cars/SendCommand/index.jsx
index a3d67f1..5bc661e 100644
--- a/src/components/Cars/SendCommand/index.jsx
+++ b/src/components/Cars/SendCommand/index.jsx
@@ -75,8 +75,12 @@ const SendCommand = ({ vins }) => {
   }, []);
 
   return (
-    <div className={classes.form}>
-      <FormControl className={classes.formControlInline} variant="outlined">
+    <div className={`${classes.form}`} style={{ marginTop: 20 }}>
+      <FormControl
+        className={classes.formControlInline}
+        variant="outlined"
+        size="small"
+      >
         <InputLabel htmlFor="send-command" style={{ backgroundColor: "White" }}>
           Command
         </InputLabel>
@@ -97,7 +101,11 @@ const SendCommand = ({ vins }) => {
           ))}
         </Select>
       </FormControl>
-      <FormControl className={classes.formControlInline} variant="outlined">
+      <FormControl
+        className={classes.formControlInline}
+        variant="outlined"
+        size="small"
+      >
         <InputLabel
           htmlFor="send-parameter"
           style={{ backgroundColor: "White" }}
@@ -127,6 +135,7 @@ const SendCommand = ({ vins }) => {
         aria-label="send command"
         component="span"
         onClick={clickHandler}
+        size="small"
         disabled={busy || vins.length === 0}
       >
         <SendIcon fontSize="large" />
diff --git a/src/components/Cars/SendCommandBulk/index.jsx b/src/components/Cars/SendCommandBulk/index.jsx
index d3bbf3d..9aee46a 100644
--- a/src/components/Cars/SendCommandBulk/index.jsx
+++ b/src/components/Cars/SendCommandBulk/index.jsx
@@ -56,16 +56,18 @@ const MainForm = () => {
   return (
     <div className={classes.paper} style={{ height: 700, width: "100%" }}>
       <Grid container className={classes.root} spacing={2}>
-        <Grid item md={6}>
-          <Link to="/vehicle-add" className={classes.labelInline}>
+        <Grid item md={4} style={{ textAlign: "justify" }}>
+          <Link to="/vehicle-add">
             <AddCircleIcon fontSize="large" />
           </Link>
-          <SearchField classes={classes} onSearch={handleSearch} />
           <div
             className={classes.labelInline}
           >{`${selected.length} Selected`}</div>
         </Grid>
-        <Grid item md={6} style={{ textAlign: "right" }}>
+        <Grid item md={4} style={{ textAlign: "center" }}>
+          <SearchField classes={classes} onSearch={handleSearch} />
+        </Grid>
+        <Grid item md={4} style={{ textAlign: "right" }}>
           <SendCommand vins={selected} style={{ display: "flex" }} />
         </Grid>
       </Grid>
diff --git a/src/components/Contexts/CarUpdatesContext.jsx b/src/components/Contexts/CarUpdatesContext.jsx
index 9ee8854..b54aa42 100644
--- a/src/components/Contexts/CarUpdatesContext.jsx
+++ b/src/components/Contexts/CarUpdatesContext.jsx
@@ -76,10 +76,20 @@ export const CarUpdatesProvider = ({ children }) => {
   };
 
   const applyProgressStatus = (item, status) => {
-    if (status.msg === "package_download_complete") {
-      delete item.progress;
+    if (
+      status.msg === "package_download_start" ||
+      status.msg === "download_start"
+    ) {
+      item.progress = 1;
+      item.status = "downloading";
+    } else if (status.msg === "package_download_complete") {
       item.status = "downloaded";
-    } else if (status.msg === "downloading" && status.package_total > 0) {
+    } else if (
+      status.msg === "downloading" &&
+      status.package_current &&
+      status.package_total &&
+      status.package_total > 0
+    ) {
       let progress = Math.floor(
         (100 * status.package_current) / status.package_total
       );
@@ -88,8 +98,23 @@ export const CarUpdatesProvider = ({ children }) => {
       item.status = `downloading ${progress}%`;
     } else if (status.error > 0 || status.msg === "download_error") {
       item.status = "download error";
+    } else if (status.msg === "package_install_start") {
+      item.progress = 1;
+      item.status = "installing";
+    } else if (
+      status.msg === "installing" &&
+      status.installed &&
+      status.total_files &&
+      status.total_files > 0
+    ) {
+      let progress = Math.floor((100 * status.installed) / status.total_files);
+      item.progress = progress;
+      item.status = `installing ${progress}%`;
+    } else if (status.msg === "package_install_complete") {
+      item.status = "installed";
     } else {
-      item.status = "downloading";
+      delete item.progress;
+      item.status = status.msg;
     }
   };
 
@@ -97,8 +122,8 @@ export const CarUpdatesProvider = ({ children }) => {
     let items = JSON.parse(JSON.stringify(carUpdates));
 
     statuses.forEach((status) => {
-      let item = items.find((item) => status.id === item.id);
-      if (!item || status.id === 0) return;
+      let item = items.find((item) => status.car_update_id === item.id);
+      if (!item || status.car_update_id === 0) return;
       applyProgressStatus(item, status);
     });
 
@@ -113,7 +138,7 @@ export const CarUpdatesProvider = ({ children }) => {
     try {
       setBusy(true);
       const carupdateids = carUpdates.reduce((accum, update) => {
-        if (update.status !== "downloaded") accum.push(update.id);
+        if (update.status !== "installed") accum.push(update.id);
         return accum;
       }, []);
       if (carupdateids.length === 0) return;
diff --git a/src/components/Layouts/MenuDrawer.jsx b/src/components/Layouts/MenuDrawer.jsx
index 6a19ead..d66c254 100644
--- a/src/components/Layouts/MenuDrawer.jsx
+++ b/src/components/Layouts/MenuDrawer.jsx
@@ -52,7 +52,9 @@ export default function MenuDrawer({ children }) {
             paper: classes.drawerPaper,
           }}
         >
-          <div className={classes.drawerHeader}>
+          <div
+            className={`${classes.drawerHeader} ${classes.drawerHeaderLogo}`}
+          >
             <img
               src={logo}
               alt="Fisker Admin Portal"
diff --git a/src/components/Manifest/Deploy/index.jsx b/src/components/Manifest/Deploy/index.jsx
index f2d7bc2..33ae550 100644
--- a/src/components/Manifest/Deploy/index.jsx
+++ b/src/components/Manifest/Deploy/index.jsx
@@ -126,17 +126,18 @@ const MainForm = () => {
       <form className={classes.form} noValidate action="{onSubmit}">
         <Typography variant="body2">Created {createDate}.</Typography>
         <Grid container className={classes.root} spacing={2}>
-          <Grid item md={10}>
-            <SearchField classes={classes} onSearch={handleSearch} />
+          <Grid item md={2}>
             <div
               className={classes.labelInline}
             >{`${selected.length} Selected`}</div>
           </Grid>
+          <Grid item md={8} style={{ textAlign: "center" }}>
+            <SearchField classes={classes} onSearch={handleSearch} />
+          </Grid>
           <Grid item md={2} style={{ textAlign: "right" }}>
             <Button
               type="submit"
               disabled={busy || selected.length === 0}
-              fullWidth
               variant="contained"
               color="primary"
               className={classes.formControl}
diff --git a/src/components/Manifest/List/index.jsx b/src/components/Manifest/List/index.jsx
index a63b95a..3d7e0eb 100644
--- a/src/components/Manifest/List/index.jsx
+++ b/src/components/Manifest/List/index.jsx
@@ -1,13 +1,13 @@
 import React, { useEffect, useState } from "react";
 import { Link } from "react-router-dom";
 import {
+  Grid,
   Table,
   TableBody,
   TableCell,
   TableFooter,
   TablePagination,
   TableRow,
-  Toolbar,
   Tooltip,
 } from "@material-ui/core";
 import AddCircleIcon from "@material-ui/icons/AddCircle";
@@ -185,12 +185,17 @@ const MainForm = () => {
 
   return (
     <div className={classes.paper} style={{ height: 700, width: "100%" }}>
-      <Toolbar className={classes.tableToolbar}>
-        <Link to="/package-create" className={classes.labelInline}>
-          <AddCircleIcon fontSize="large" />
-        </Link>
-        <SearchField classes={classes} onSearch={handleSearch} />
-      </Toolbar>
+      <Grid container className={classes.root} spacing={2}>
+        <Grid item md={4} style={{ textAlign: "justify" }}>
+          <Link to="/package-create" className={classes.labelInline}>
+            <AddCircleIcon fontSize="large" />
+          </Link>
+        </Grid>
+        <Grid item md={4} style={{ textAlign: "center" }}>
+          <SearchField classes={classes} onSearch={handleSearch} />
+        </Grid>
+        <Grid item md={4} style={{ textAlign: "right" }}></Grid>
+      </Grid>
       <Table>
         <TableHeaderSortable
           classes={classes}
diff --git a/src/components/useStyles.jsx b/src/components/useStyles.jsx
index a653a66..06bc062 100644
--- a/src/components/useStyles.jsx
+++ b/src/components/useStyles.jsx
@@ -45,7 +45,7 @@ const useStyles = makeStyles((theme) => ({
   },
   labelInline: {
     fontSize: "1.25em",
-    margin: theme.spacing(2, 1, 1),
+    margin: theme.spacing(4, 1, 1),
     display: "inline-flex",
     boxSizing: "border-box",
     verticalAlign: "bottom",
@@ -77,6 +77,8 @@ const useStyles = makeStyles((theme) => ({
       easing: theme.transitions.easing.sharp,
       duration: theme.transitions.duration.leavingScreen,
     }),
+    color: "black",
+    backgroundColor: "white",
   },
   appBarShift: {
     width: `calc(100% - ${DRAWER_WIDTH}px)`,
@@ -107,6 +109,9 @@ const useStyles = makeStyles((theme) => ({
     ...theme.mixins.toolbar,
     justifyContent: "flex-start",
   },
+  drawerHeaderLogo: {
+    backgroundColor: "#3f51b5",
+  },
   content: {
     flexGrow: 1,
     padding: theme.spacing(3),