CEC-4100: Added push config changes to vin (#338)

src/components/Cars/Status/Details/index.jsx

@@ -1,6 +1,7 @@
 import { Grid, Tooltip } from "@material-ui/core";
 import DeleteIcon from "@material-ui/icons/Delete";
 import EditIcon from "@material-ui/icons/Edit";
+import UploadIcon from '@mui/icons-material/Upload';
 import clsx from "clsx";
 import React, { useEffect, useState } from "react";
 import { Redirect } from "react-router";
@@ -16,14 +17,16 @@ import {
 } from "../../../Contexts/VehicleContext";
 import { RoleWrap } from "../../../Controls/RoleWrap";
 import DeleteConfirmation from "../../../DeleteConfirmation";
+import GeneralConfirmation from "../../../GeneralConfirmation";
 import useStyles from "../../../useStyles";
 
 const MainForm = ({ vin }) => {
   const classes = useStyles();
   const { setMessage } = useStatusContext();
-  const { vehicle, getVehicle, deleteVehicle } = useVehicleContext();
+  const { vehicle, getVehicle, deleteVehicle, uploadConfig } = useVehicleContext();
   const [redirect, setRedirect] = useState(null);
   const [showDeleteModal, setShowDeleteModal] = useState(false);
+  const [showUploadConfigModal, setShowUploadConfigModal] = useState(false);
   const {
     token: {
       idToken: { jwtToken: token },
@@ -59,6 +62,16 @@ const MainForm = ({ vin }) => {
     }
   };
 
+  const onUploadConfig = async () => {
+    try {
+      await uploadConfig(vin, token);
+      setMessage(`Config Uploaded ${vin}`);
+    } catch (e) {
+      setMessage(e.message);
+      logger.warn(e.stack);
+    }
+  }
+
   if (redirect && redirect.length > 0) {
     return <Redirect to={redirect} />;
   }
@@ -142,6 +155,18 @@ const MainForm = ({ vin }) => {
               </Link>
             </Tooltip>
           </RoleWrap>
+          <RoleWrap
+            groups={groups}
+            providers={providers}
+            rolesPerProvider={Permissions.FiskerCreate}
+          >
+            <Tooltip key={`push-config-${vin}`} title={`Push Config "${vin}"`}>
+              <Link to="#" onClick={() => setShowUploadConfigModal(true)}>
+                <UploadIcon aria-label={`Push Config "${vin}"`} />
+              </Link>
+            </Tooltip>
+          </RoleWrap>
+
           <RoleWrap
             groups={groups}
             providers={providers}
@@ -161,6 +186,13 @@ const MainForm = ({ vin }) => {
         close={() => setShowDeleteModal(false)}
         deleteFunction={onDelete}
       />
+      <GeneralConfirmation
+        message={"push config update to:" + vin}
+        open={showUploadConfigModal}
+        close={() => setShowUploadConfigModal(false)}
+        actionFunction={onUploadConfig}
+        title="Send Update"
+      />
     </div>
   );
 };