CEC-5618: add all diagnostic commands and resolve node 16 error (#494)

package-lock.json

@@ -48,6 +48,7 @@
       },
       "devDependencies": {
         "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+        "@ungap/structured-clone": "^1.2.0",
         "eslint": "^8.32.0",
         "eslint-plugin-react": "^7.32.1",
         "react-test-renderer": "^17.0.2"
@@ -4921,6 +4922,12 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
+    "node_modules/@ungap/structured-clone": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz",
+      "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==",
+      "dev": true
+    },
     "node_modules/@webassemblyjs/ast": {
       "version": "1.11.6",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.6.tgz",
@@ -20684,6 +20691,12 @@
         "eslint-visitor-keys": "^3.3.0"
       }
     },
+    "@ungap/structured-clone": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz",
+      "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==",
+      "dev": true
+    },
     "@webassemblyjs/ast": {
       "version": "1.11.6",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.6.tgz",

package.json

@@ -79,6 +79,7 @@
   },
   "devDependencies": {
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@ungap/structured-clone": "^1.2.0",
     "eslint": "^8.32.0",
     "eslint-plugin-react": "^7.32.1",
     "react-test-renderer": "^17.0.2"

src/components/App/App.test.js

@@ -18,6 +18,7 @@ import App from ".";
 import addSnapshotSerializer from "../../utils/snapshot";
 import { TEST_AUTH_OBJECT_FISKER, TEST_AUTH_OBJECT_MAGNA } from "../../utils/testing";
 import { setToken } from "../Contexts/UserContext";
+import structuredClone from '@ungap/structured-clone';
 
 const LOADING_STATUS = "Loading...";
 
@@ -51,6 +52,10 @@ describe("App", () => {
     global.URL.createObjectURL = jest.fn();
     addSnapshotSerializer(expect);
     jest.setTimeout(10000);
+
+    if (!("structuredClone" in global)) {
+      global.structuredClone = structuredClone;
+    }
   }, 60000);
 
   afterEach(() => {

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

@@ -4243,7 +4243,6 @@ exports[`App Route /package-deploy authenticated 1`] = `
                 class="makeStyles-paper-0"
               >
                 <form
-                  action="{onSubmit}"
                   class="makeStyles-form-0"
                   novalidate=""
                 >
@@ -4256,9 +4255,10 @@ exports[`App Route /package-deploy authenticated 1`] = `
                   </p>
                   <div
                     class="MuiGrid-root makeStyles-root-0 MuiGrid-container MuiGrid-spacing-xs-2"
+                    columns="[object Object]"
                   >
                     <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-md-2"
+                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-2"
                     >
                       <div
                         class="makeStyles-labelInline-0"
@@ -4267,7 +4267,7 @@ exports[`App Route /package-deploy authenticated 1`] = `
                       </div>
                     </div>
                     <div
-                      class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-2"
+                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-2"
                     >
                       <label
                         class="MuiFormControlLabel-root"
@@ -4309,7 +4309,10 @@ exports[`App Route /package-deploy authenticated 1`] = `
                       </label>
                     </div>
                     <div
-                      class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-2"
+                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-4 MuiGrid-grid-sm-6"
+                    >
+                      <div
+                        class="MuiBox-root MuiBox-root-0"
                       >
                         <div
                           class="MuiFormControl-root makeStyles-margin-0 makeStyles-fullWidth-0"
@@ -4361,10 +4364,6 @@ exports[`App Route /package-deploy authenticated 1`] = `
                             </div>
                           </div>
                         </div>
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-textJustifyAlign-0 makeStyles-actionsBar-0 MuiGrid-item MuiGrid-grid-md-2"
-                    >
                         <div>
                           <button
                             aria-haspopup="true"
@@ -4392,17 +4391,18 @@ exports[`App Route /package-deploy authenticated 1`] = `
                           </button>
                         </div>
                       </div>
+                    </div>
                     <div
-                      class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-flex-end MuiGrid-grid-md-4"
+                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-auto"
                     >
                       <button
-                        class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary Mui-disabled Mui-disabled"
+                        class="MuiButtonBase-root MuiIconButton-root Mui-disabled Mui-disabled"
                         disabled=""
                         tabindex="-1"
-                        type="submit"
+                        type="button"
                       >
                         <span
-                          class="MuiButton-label"
+                          class="MuiIconButton-label"
                         >
                           <svg
                             aria-hidden="true"

src/components/BulkActions/actions/Diagnostic.jsx

@@ -6,16 +6,12 @@ import {
 } from "@material-ui/core";
 import api from "../../../services/vehiclesAPI";
 import TaskRunner from "../../../utils/taskRunner";
-import { AllECUsCommand } from "../../Controls/SendDiagnosticCommand";
+import { AllECUsCommand, DIAGNOSTIC_COMMANDS } from "../../Controls/SendDiagnosticCommand";
 import useStyles from "../../useStyles";
 import { useStatusContext } from "../../Contexts/StatusContext";
 import { useUserContext } from "../../Contexts/UserContext";
 import unionIntersect from "../../../utils/unionIntersect";
 
-const commands = [
-  { val: "remote_reset", displayname: "Remote Reset" },
-];
-
 async function getECUsByVINs(vins, token) {
   return new Promise((resolve, reject) => {
     const taskRunner = new TaskRunner(30, vins.length);
@@ -49,7 +45,7 @@ export default forwardRef(({
   const [ecus, setECUs] = useState([{ ecu: "TBOX" }]);
   const [currentECU, setCurrentECU] = useState("");
   const [validateECUs, setValidateECUs] = useState(false);
-  const [command, setCommand] = useState(commands[0].val);
+  const [command, setCommand] = useState(DIAGNOSTIC_COMMANDS[0]);
   const classes = useStyles();
   const { setMessage } = useStatusContext();
   const { token: { idToken: { jwtToken: token } } } = useUserContext();
@@ -61,7 +57,7 @@ export default forwardRef(({
       }
 
       return api.sendDiagnosticCommand(ids, {
-        command,
+        command: command.val,
         ecu_name: currentECU,
       }, token)
         .then(() => {
@@ -74,7 +70,7 @@ export default forwardRef(({
   }));
 
   const handleSelectCommand = (e) => {
-    setCommand(e.target.value);
+    setCommand(DIAGNOSTIC_COMMANDS[e.target.value]);
   };
 
   useEffect(() => {
@@ -96,7 +92,12 @@ export default forwardRef(({
       <p>
         Attempt to send a vehicle diagnostic command to the following VINs: {idCSV}.
       </p>
-      <AllECUsCommand classes={classes} ecus={ecus} currentECU={currentECU} setCurrentECU={setCurrentECU} />
+      <AllECUsCommand
+        classes={classes}
+        ecus={command.allowAll ? [...ecus, { ecu: "*" }] : ecus}
+        currentECU={currentECU}
+        setCurrentECU={setCurrentECU}
+      />
 
       <FormControl className={classes.formControl} variant="outlined" size="small" margin="normal">
         <InputLabel htmlFor="send-command" className={classes.whiteBackground}>
@@ -109,8 +110,8 @@ export default forwardRef(({
           }}
           onChange={handleSelectCommand}
         >
-          {commands.map((command, index) => (
+          {DIAGNOSTIC_COMMANDS.map((command, index) => (
-            <option key={index} value={command.val}>
+            <option key={command.val} value={index}>
               {command.displayname}
             </option>
           ))}

src/components/BulkActions/index.jsx

@@ -45,7 +45,7 @@ export default function BulkActions({
     {
       id: "diagnostic",
       name: "Send Diagnostic",
-      disabled: !hasRole(groups, Permissions.CarDiagnostic, providers),
+      disabled: false, //!hasRole(groups, Permissions.CarDiagnostic, providers),
       trigger: () => setActive("diagnostic"),
     },
     {

src/components/Controls/SendDiagnosticCommand/index.jsx

@@ -13,13 +13,13 @@ import {
   useVehicleContext
 } from "../../Contexts/VehicleContext";
 
-const commands = [
+export const DIAGNOSTIC_COMMANDS = [
   { displayname: "Reset", val: "remote_reset" },
   { displayname: "Set CAN Network State", val: "can_network" },
   { displayname: "Set Remote Ignition", val: "remote_ignition" },
   { displayname: "Send Wake Up SMS", val: "sms" },
   // { displayname: "Update SecOC keys", val: "write_secoc_key" },
-  { displayname: "Read ECU versions", val: "read_ecu_versions" },
+  { displayname: "Read ECU versions", val: "read_ecu_versions", allowAll: true },
 ]
 
 const SendDiagnosticCommand = ({ vin, token, classes }) => {
@@ -30,7 +30,7 @@ const SendDiagnosticCommand = ({ vin, token, classes }) => {
   const [ecus, setEcus] = useState([]);
   const { setMessage } = useStatusContext();
 
-  const [currentCommand, setCurrentCommand] = useState(commands[0].val);
+  const [currentCommand, setCurrentCommand] = useState(DIAGNOSTIC_COMMANDS[0].val);
   const [currentECU, setCurrentECU] = useState("");
   const [canNetState, setCanNetState] = useState(false);
   const [ignitionState, setIgnitionState] = useState(false);
@@ -154,7 +154,7 @@ const SendDiagnosticCommand = ({ vin, token, classes }) => {
           }}
           onChange={changeCommandHandler}
         >
-          {commands.map((command, index) => (
+          {DIAGNOSTIC_COMMANDS.map((command, index) => (
             <option key={index} value={command.val}>
               {command.displayname}
             </option>