CEC-4590 - Fleet settings match Vehicle settings (#366)

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

@@ -86,6 +86,23 @@ exports[`FleetDetailsTab Render 1`] = `
                   : 
                   3
                 </p>
+                <p>
+                  <b>
+                    DTC Enabled
+                  </b>
+                  : 
+                  false
+                </p>
+              </div>
+              <div
+                class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
+              >
+                <p>
+                  <b>
+                    Debug Mask
+                  </b>
+                  : 
+                </p>
               </div>
               <div
                 class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"

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

@@ -24,6 +24,8 @@ const MainForm = ({ name }) => {
   const [showDeleteModal, setShowDeleteModal] = useState(false)
   const { token: { idToken: { jwtToken: token } } } = useUserContext();
 
+  const showDebugMask = (process.env.REACT_APP_ENABLE_DEBUGMASK === "1");
+
   useEffect(() => {
     (async () => {
       try {
@@ -70,6 +72,14 @@ const MainForm = ({ name }) => {
             <p><b>Enabled</b>: {fleet.canbus.data_logger_enabled.toString()}</p>
             <p><b>Max Disk Buffer Size</b>: {fleet.canbus.max_disk_buffer_size ?? "Default"}</p>
             <p><b>Filters</b>: {fleet.canbus.filters ? fleet.canbus.filters.length : 0}</p>
+            <p><b>DTC Enabled</b>: {(fleet.canbus.dtc_enabled || false).toString()}</p>
+          </Grid>
+        )}
+        {showDebugMask && (
+          <Grid item md={12} className={classes.textCenterAlign}>
+            <p>
+              <b>Debug Mask</b>: {fleet.debug_mask}
+            </p>
           </Grid>
         )}
         <Grid item md={12} className={classes.textCenterAlign}>
@@ -85,7 +95,7 @@ const MainForm = ({ name }) => {
           </Tooltip>
         </Grid>
       </Grid>
-      <DeleteConfirmation message={name} open={showDeleteModal} close={()=> setShowDeleteModal(false)} deleteFunction={onDelete}/>
+      <DeleteConfirmation message={name} open={showDeleteModal} close={() => setShowDeleteModal(false)} deleteFunction={onDelete} />
     </div >
   );
 };

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

@@ -94,6 +94,23 @@ exports[`DetailsTab Render 1`] = `
                     : 
                     3
                   </p>
+                  <p>
+                    <b>
+                      DTC Enabled
+                    </b>
+                    : 
+                    false
+                  </p>
+                </div>
+                <div
+                  class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
+                >
+                  <p>
+                    <b>
+                      Debug Mask
+                    </b>
+                    : 
+                  </p>
                 </div>
                 <div
                   class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"

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

@@ -182,6 +182,23 @@ exports[`FleetStatus Render 1`] = `
                           : 
                           3
                         </p>
+                        <p>
+                          <b>
+                            DTC Enabled
+                          </b>
+                          : 
+                          false
+                        </p>
+                      </div>
+                      <div
+                        class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"
+                      >
+                        <p>
+                          <b>
+                            Debug Mask
+                          </b>
+                          : 
+                        </p>
                       </div>
                       <div
                         class="MuiGrid-root makeStyles-textCenterAlign-0 MuiGrid-item MuiGrid-grid-md-12"

src/components/Fleets/Update/__snapshots__/index.test.jsx.snap

@@ -565,6 +565,81 @@ exports[`FleetUpdate Render 1`] = `
                   </fieldset>
                 </div>
               </div>
+              <label
+                class="MuiFormControlLabel-root"
+              >
+                <span
+                  aria-disabled="false"
+                  class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-0 MuiCheckbox-root MuiCheckbox-colorSecondary PrivateSwitchBase-checked-0 Mui-checked MuiIconButton-colorSecondary"
+                >
+                  <span
+                    class="MuiIconButton-label"
+                  >
+                    <input
+                      checked=""
+                      class="PrivateSwitchBase-input-0"
+                      data-indeterminate="false"
+                      type="checkbox"
+                      value=""
+                    />
+                    <svg
+                      aria-hidden="true"
+                      class="MuiSvgIcon-root"
+                      focusable="false"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
+                      />
+                    </svg>
+                  </span>
+                  <span
+                    class="MuiTouchRipple-root"
+                  />
+                </span>
+                <span
+                  class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
+                >
+                  DTC Enabled
+                </span>
+              </label>
+              <div
+                class="MuiFormControl-root MuiTextField-root MuiFormControl-marginNormal MuiFormControl-fullWidth"
+              >
+                <label
+                  class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined"
+                  data-shrink="true"
+                  for="debug_mask"
+                  id="debug_mask-label"
+                >
+                  Debug Mask
+                </label>
+                <div
+                  class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="MuiInputBase-input MuiOutlinedInput-input"
+                    id="debug_mask"
+                    maxlength="255"
+                    name="debug_mask"
+                    type="text"
+                    value=""
+                  />
+                  <fieldset
+                    aria-hidden="true"
+                    class="PrivateNotchedOutline-root-0 MuiOutlinedInput-notchedOutline"
+                  >
+                    <legend
+                      class="PrivateNotchedOutline-legendLabelled-0 PrivateNotchedOutline-legendNotched-0"
+                    >
+                      <span>
+                        Debug Mask
+                      </span>
+                    </legend>
+                  </fieldset>
+                </div>
+              </div>
               <button
                 class="MuiButtonBase-root MuiButton-root MuiButton-contained makeStyles-submit-0 MuiButton-containedPrimary MuiButton-fullWidth"
                 tabindex="0"

src/components/Fleets/Update/index.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import { Redirect } from "react-router";
 import { useLocation } from "react-router-dom";
 import {
@@ -38,6 +38,10 @@ const MainForm = () => {
   const [dataLoggerEnabled, setDataLoggerEnabled] = useState(false);
   const [maxMemBufferSize, setMaxMemBufferSize] = useState(0);
   const [maxDiskBufferSize, setMaxDiskBufferSize] = useState(0);
+  const [dtcEnabled, setDTCEnabled] = useState(true);
+  const debugMaskEl = useRef(null);
+
+  const showDebugMask = (process.env.REACT_APP_ENABLE_DEBUGMASK === "1");
 
   useEffect(() => {
     setTitle("Update Fleet");
@@ -78,7 +82,13 @@ const MainForm = () => {
       setMaxDiskBufferSize(
         fleet.canbus.max_disk_buffer_size ?? maxDiskBufferSize
       );
+      setDTCEnabled(fleet.canbus.dtc_enabled ?? dtcEnabled);
     }
+
+    if (showDebugMask) {
+      debugMaskEl.current.value = fleet.debug_mask ?? ""
+    }
+
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [fleet]);
 
@@ -98,6 +108,10 @@ const MainForm = () => {
     setDataLoggerEnabled(event.target.checked);
   };
 
+  const onDtcEnabledChange = (event) => {
+    setDTCEnabled(event.target.checked);
+  }
+
   const onMaxMemBufferSizeChange = (event) => {
     setMaxMemBufferSize(event.target.value);
   };
@@ -116,11 +130,10 @@ const MainForm = () => {
           enabled: canbusEnabled,
           data_logger_enabled: canbusEnabled ? dataLoggerEnabled : false,
           max_mem_buffer_size: canbusEnabled ? parseInt(maxMemBufferSize) : 0,
-          max_disk_buffer_size:
+          max_disk_buffer_size: canbusEnabled && dataLoggerEnabled ? parseInt(maxDiskBufferSize) : 0,
-            canbusEnabled && dataLoggerEnabled
+          dtc_enabled: dtcEnabled
-              ? parseInt(maxDiskBufferSize)
-              : 0,
         },
+        debug_mask: debugMaskEl.current?.value
       };
 
       const result = await updateFleet(oldName, formData, token);
@@ -226,6 +239,30 @@ const MainForm = () => {
           required
           fullWidth
         />
+        <FormControlLabel control={
+          <Checkbox
+            checked={dtcEnabled}
+            onChange={onDtcEnabledChange}
+          />
+        } label="DTC Enabled" />
+        {showDebugMask && (
+          <TextField
+            id="debug_mask"
+            name="debug_mask"
+            label="Debug Mask"
+            InputLabelProps={{
+              shrink: true
+            }}
+            defaultValue=""
+            variant="outlined"
+            margin="normal"
+            inputProps={{
+              maxLength: "255",
+            }}
+            fullWidth
+            inputRef={debugMaskEl}
+          />
+        )}
         <Button
           type="submit"
           disabled={busy}