Merge branch 'release/0.9.0'

package.json

@@ -6,13 +6,14 @@
     "@datadog/browser-logs": "^3.11.0",
     "@date-io/date-fns": "1.x",
     "@date-io/moment": "1.x",
-    "@emotion/react": "^11.9.0",
+    "@emotion/react": "^11.11.0",
-    "@emotion/styled": "^11.8.1",
+    "@emotion/styled": "^11.11.0",
     "@material-ui/core": "^4.12.4",
     "@material-ui/icons": "^4.11.3",
     "@material-ui/lab": "^4.0.0-alpha.61",
     "@material-ui/pickers": "^3.3.10",
-    "@mui/material": "^5.10.14",
+    "@mui/icons-material": "^5.11.16",
+    "@mui/material": "^5.13.1",
     "@superset-ui/embedded-sdk": "^0.1.0-alpha.8",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^12.1.4",
@@ -83,7 +84,7 @@
     "coverageThreshold": {
       "global": {
         "branches": 39,
-        "functions": 47,
+        "functions": 46,
         "lines": 55,
         "statements": 55
       }

src/components/App/__snapshots__/App.test.js.snap

@@ -11428,9 +11428,28 @@ exports[`App Route /vehicle-status authenticated 1`] = `
                               />
                             </svg>
                           </a>
+                          <a
+                            class=""
+                            href="/vehicle-status/FISKER123"
+                            title="Push Config \\"FISKER123\\""
+                          >
+                            <svg
+                              aria-hidden="true"
+                              aria-label="Push Config \\"FISKER123\\""
+                              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                              data-testid="UploadIcon"
+                              focusable="false"
+                              viewBox="0 0 24 24"
+                            >
+                              <path
+                                d="M5 20h14v-2H5v2zm0-10h4v6h6v-6h4l-7-7-7 7z"
+                              />
+                            </svg>
+                          </a>
                         </div>
                       </div>
                       <div />
+                      <div />
                     </div>
                   </div>
                 </div>

src/components/CANSelfServe/SelfServe/index.jsx

@@ -16,7 +16,7 @@ const MainForm = ({ id }) => {
   const [selectedStartDate, setSelectedStartDate] = useState(new Date(Date.now() - 24 * 60 * 60 * 1000));
   const [selectedEndDate, setSelectedEndDate] = useState(new Date());
   const [selectedCanSignals, setSelectedCanSignals] = useState([]);
-
+  const [selectAllCanSignals, setSelectAllCanSignals] = useState(false);
 
   const {
     token: {
@@ -29,8 +29,8 @@ const MainForm = ({ id }) => {
     let timestamp_start = Date.parse(selectedStartDate.toUTCString()) / 1000
     let timestamp_end = Date.parse(selectedEndDate.toUTCString()) / 1000
     try {
-      await getDynamicColumnCANSignals(id, timestamp_start, timestamp_end, selectedCanSignals, token)
+      await getDynamicColumnCANSignals(id, timestamp_start, timestamp_end, selectedCanSignals, selectAllCanSignals, token)
-    } catch(e){
+    } catch (e) {
       setMessage(e.message);
       logger.error(e.stack)
     }
@@ -74,12 +74,14 @@ const MainForm = ({ id }) => {
   const handleSelectedItemsChange = (event) => {
     const { value } = event.target;
     if (value.some(item => item === "Select All")) {
+      setSelectAllCanSignals(true);
       if (selectedCanSignals.length === canSignals.length) {
         setSelectedCanSignals([]);
       } else {
         setSelectedCanSignals(canSignals.map(signal => signal.signal_name));
       }
     } else {
+      setSelectAllCanSignals(false);
       setSelectedCanSignals(value);
     }
   };

src/components/Cars/Status/Details/__snapshots__/index.test.jsx.snap

@@ -168,9 +168,28 @@ exports[`VehicleDetailsTab Render 1`] = `
                     />
                   </svg>
                 </a>
+                <a
+                  class=""
+                  href="/"
+                  title="Push Config \\"TESTVIN1234567890\\""
+                >
+                  <svg
+                    aria-hidden="true"
+                    aria-label="Push Config \\"TESTVIN1234567890\\""
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                    data-testid="UploadIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M5 20h14v-2H5v2zm0-10h4v6h6v-6h4l-7-7-7 7z"
+                    />
+                  </svg>
+                </a>
               </div>
             </div>
             <div />
+            <div />
           </div>
         </div>
       </div>

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>
   );
 };

src/components/Cars/Status/__snapshots__/DetailsTab.test.jsx.snap

@@ -176,9 +176,28 @@ exports[`DetailsTab Render 1`] = `
                       />
                     </svg>
                   </a>
+                  <a
+                    class=""
+                    href="/testroute/TESTVIN1234567890"
+                    title="Push Config \\"TESTVIN1234567890\\""
+                  >
+                    <svg
+                      aria-hidden="true"
+                      aria-label="Push Config \\"TESTVIN1234567890\\""
+                      class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                      data-testid="UploadIcon"
+                      focusable="false"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M5 20h14v-2H5v2zm0-10h4v6h6v-6h4l-7-7-7 7z"
+                      />
+                    </svg>
+                  </a>
                 </div>
               </div>
               <div />
+              <div />
             </div>
           </div>
         </div>

src/components/Cars/Status/__snapshots__/index.test.jsx.snap

@@ -357,9 +357,28 @@ exports[`CarStatus Render 1`] = `
                           />
                         </svg>
                       </a>
+                      <a
+                        class=""
+                        href="/"
+                        title="Push Config \\"TESTVIN1234567890\\""
+                      >
+                        <svg
+                          aria-hidden="true"
+                          aria-label="Push Config \\"TESTVIN1234567890\\""
+                          class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                          data-testid="UploadIcon"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M5 20h14v-2H5v2zm0-10h4v6h6v-6h4l-7-7-7 7z"
+                          />
+                        </svg>
+                      </a>
                     </div>
                   </div>
                   <div />
+                  <div />
                 </div>
               </div>
             </div>

src/components/Contexts/CANSignalsExportContext.jsx

@@ -23,14 +23,20 @@ export const CANSignalsExportProvider = ({ children }) => {
     }
   };
 
-  const getDynamicColumnCANSignals = async (vin, timestart, timeend, cansingals, token) => {
+  const getDynamicColumnCANSignals = async (vin, timestart, timeend, cansignals, selectall, token) => {
     try {
       setBusy(true)
       if (!vin) return;
 
       validateVIN(vin);
       if (timestart > timeend) throw new Error("Start time cannot be after end time");
-      const result = await api.getCanSignalsVin(vin, timestart, timeend, cansingals, token);
+
+      let result
+      if (selectall === true) {
+        result = await api.getCanSignalsVin(vin, timestart, timeend, [], selectall, token);
+      } else {
+        result = await api.getCanSignalsVin(vin, timestart, timeend, cansignals, false, token);
+      }
       if (result.error || !result.ok)
         throw new Error(`Get CAN signals error. ${result.message}`);
 

src/components/Contexts/VehicleContext.jsx

@@ -200,6 +200,20 @@ export const VehicleProvider = ({ children }) => {
     }
   };
 
+  const uploadConfig = async (vin, token) => {
+    try {
+      setBusy(true);
+      validateVIN(vin);
+
+      const result = await api.updateConfig(vin, token);
+      if (result.error)
+        throw new Error(`Update vehicle error. ${result.message}`);
+      return result;
+    } finally {
+      setBusy(false);
+    }
+  }
+
   const deleteVehicle = async (vin, token) => {
     try {
       setBusy(true);
@@ -285,6 +299,7 @@ export const VehicleProvider = ({ children }) => {
         updateVehicle,
         getFleets,
         getVersionLog,
+        uploadConfig
       }}
     >
       {children}

src/components/Controls/CarUpdateStatusProgress/Statuses.js

@@ -30,6 +30,7 @@ const Statuses = {
   ManifestRollback: "manifest_rollback",
   ManifestSucceeded: "manifest_succeeded",
   ManifesCanceled: "manifest_canceled",
+  ManifestCancelPending: "manifest_cancel_pending",
   PackageDownloadStarted: "package_download_start",
   PackageDownloadCompleted: "package_download_complete",
   PackageInstallStarted: "package_install_start",

src/components/Controls/CarUpdateStatusProgress/index.jsx

@@ -18,9 +18,9 @@ const PHASES = [
   },
   {
     label: "Received",
-    events: [s.ManifestAccepted, s.ManifestReceived, s.ManifestRejected],
+    events: [s.ManifestAccepted, s.ManifestReceived, s.ManifestRejected, s.ManifestError],
     progress: (msg) => {
-      if (msg === s.ManifestRejected) return ErrorStatus;
+      if (msg === s.ManifestRejected || msg === s.ManifestError) return ErrorStatus;
       return CompleteStatus;
     },
   },
@@ -67,8 +67,11 @@ const PHASES = [
   },
   {
     label: "Updated",
-    events: [s.ManifestSucceeded],
+    events: [s.ManifestSucceeded, s.CleanupFailed, s.CleanupSucceeded, s.RollbackSucceeded, s.RollbackFailed],
-    progress: (_msg, _progress) => CompleteStatus,
+    progress: (msg, _progress) => {
+      if (msg === s.ManifestSucceeded) return CompleteStatus;
+      return ErrorStatus;
+    }
   },
 ];
 

src/components/GeneralConfirmation/__snapshots__/index.test.jsx.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`General Confirmation Modal Should render 1`] = `
+<div
+  aria-hidden="true"
+>
+  <div />
+</div>
+`;

src/components/GeneralConfirmation/index.jsx

@@ -0,0 +1,37 @@
+import React from "react";
+import PropTypes from "prop-types";
+import {Dialog, DialogTitle, DialogContentText, Button, DialogActions, DialogContent} from '@material-ui/core';
+
+const GeneralConfirmation = (props) => {
+    return (
+      <div>
+      <Dialog open={props.open}
+      onClose={props.close}>
+        <DialogTitle id="alert-dialog-title">
+          {props.title}
+        </DialogTitle>
+        <DialogContent>
+          <DialogContentText id="alert-dialog-description">
+            {"Are you sure you want to : " + props.message}
+          </DialogContentText>
+        </DialogContent>
+        <DialogActions>
+          <Button onClick={props.close}>Cancel</Button>
+          <Button variant="contained" color="secondary" onClick={() => { props.close(); props.actionFunction()}} autoFocus>
+            Go
+          </Button>
+        </DialogActions>
+      </Dialog>
+      </div>
+    )
+}
+
+GeneralConfirmation.propTypes={
+  open: PropTypes.bool.isRequired, // Boolean that determines if the modal should be open
+  close: PropTypes.func.isRequired, // Function that sets the open state to false i.e. () => setOpen(false)
+  message: PropTypes.any.isRequired, // What the user will see if being confirmed for the function to run
+  actionFunction: PropTypes.func.isRequired, // Function that runs when user clicks Go
+  title: PropTypes.any.isRequired, // The title of the modal that is opened
+}
+
+export default GeneralConfirmation;

src/components/GeneralConfirmation/index.test.jsx

@@ -0,0 +1,20 @@
+jest.mock("../Contexts/UserContext");
+
+import React from "react";
+import { render, cleanup } from "@testing-library/react";
+import GeneralConfirmation from "./index";
+import addSnapshotSerializer from "../../utils/snapshot";
+
+describe("General Confirmation Modal", () => {
+  beforeAll(() => {
+    addSnapshotSerializer(expect);
+  });
+
+  it("Should render", () => {
+    const { container } = render(
+      <GeneralConfirmation open={true} close={()=>{}} message="Test Message" title="hello" actionFunction={()=>{}}/>
+    );
+    expect(container).toMatchSnapshot();
+    cleanup();
+  });
+});

src/services/CANSignalAPI.js

@@ -6,8 +6,8 @@ const API_ENDPOINT = process.env.REACT_APP_OTA_SERVICE_URL;
 
 const canSignalAPI = {
 
-  getCanSignalsVin: async (vin, timestamp_start, timestamp_end, can_signals, token) =>
+  getCanSignalsVin: async (vin, timestamp_start, timestamp_end, can_signals, select_all, token) =>
-    fetch(addQueryParams(`${API_ENDPOINT}/can_signals_export`, { vin, timestamp_start, timestamp_end, can_signals }), {
+    fetch(addQueryParams(`${API_ENDPOINT}/can_signals_export`, { vin, timestamp_start, timestamp_end, can_signals, select_all }), {
       method: "GET",
       headers: Object.assign(
         { "Content-Type": "application/json" },
@@ -17,7 +17,6 @@ const canSignalAPI = {
     })
       .catch(errorHandler),
 
-
   getCanSignalList: async (token) =>
     fetch(addQueryParams(`${API_ENDPOINT}/can_signals_list`), {
       method: "GET",

src/services/__mocks__/CANSignalAPI.js

@@ -1,11 +1,11 @@
 const canSignalList = [
-  { signal_name: "123"},
+  { signal_name: "123" },
-  { signal_name: "456"},
+  { signal_name: "456" },
-  { signal_name: "789"}
+  { signal_name: "789" }
 ];
 
 const canSignalAPI = {
-  getCanSignalsVin: async (vin, timestamp_start, timestamp_end, can_signals, token) => {
+  getCanSignalsVin: async (vin, timestamp_start, timestamp_end, can_signals, select_all, token) => {
     return { data: "fake data" };
   },
   getCanSignalList: async (token) => {

src/services/vehiclesAPI.js

@@ -173,6 +173,17 @@ const vehiclesAPI = {
       .then(fetchRespHandler)
       .catch(errorHandler),
 
+  updateConfig: async (vin, token) =>
+    fetch(`${API_ENDPOINT}/car_config/${vin}`, {
+      method: "POST",
+      headers: Object.assign(
+        { "Content-Type": "application/json" },
+        getAuthHeaderOptions(token)
+      )
+    })
+      .then(fetchRespHandler)
+      .catch(errorHandler),
+
   getCANSignals: async (vin, token) =>
     fetch(`${API_ENDPOINT}/cansignals/${vin}`, {
       method: "GET",
@@ -209,7 +220,7 @@ const vehiclesAPI = {
       .catch(errorHandler)
   },
 
-  getLogFileLink: async ({vin, year, month, day}, token) => {
+  getLogFileLink: async ({ vin, year, month, day }, token) => {
     const u = `${API_ENDPOINT}/vehicle/${vin}/trex-logs-link?year=${year}&month=${month}&day=${day}`
     return fetch(u, {
       method: "GET",