admin/ota-admin-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'release/0.9.0'

Browse Source
This commit is contained in:
jwu-fisker
2023-06-14 08:45:22 -07:00
parent faf0d7e75a 9f414d11a1
commit 10118add11
15 changed files with 1168 additions and 651 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
src/components/App/__snapshots__/App.test.js.snap
View File

@@ -4380,7 +4380,7 @@ exports[`App Route /package-deploy authenticated 1`] = `
data-testid="mocked-vehicleprovider"
>
<div
class="makeStyles-paper-0 makeStyles-tableSize-0"
class="makeStyles-paper-0"
>
<table
class="MuiTable-root"
@@ -10389,6 +10389,43 @@ exports[`App Route /vehicle-add authenticated 1`] = `
Data Logger Enabled
</span>
</label>
<label
class="MuiFormControlLabel-root"
>
<span
aria-disabled="false"
class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-0 MuiCheckbox-root MuiCheckbox-colorSecondary MuiIconButton-colorSecondary"
>
<span
class="MuiIconButton-label"
>
<input
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 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
/>
</svg>
</span>
<span
class="MuiTouchRipple-root"
/>
</span>
<span
class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
>
DTC Enabled
</span>
</label>
</div>
<div
class="MuiFormControl-root MuiTextField-root MuiFormControl-marginNormal MuiFormControl-fullWidth"
@@ -12267,7 +12304,7 @@ exports[`App Route /vehicles authenticated 1`] = `
/>
</div>
<div
class="makeStyles-paper-0 makeStyles-tableSize-0"
class="makeStyles-paper-0"
>
<table
class="MuiTable-root"

37
src/components/Cars/Add/__snapshots__/index.test.jsx.snap
View File

@@ -518,6 +518,43 @@ exports[`VehicleAddForm Render 1`] = `
Data Logger Enabled
</span>
</label>
<label
class="MuiFormControlLabel-root"
>
<span
aria-disabled="false"
class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-0 MuiCheckbox-root MuiCheckbox-colorSecondary MuiIconButton-colorSecondary"
>
<span
class="MuiIconButton-label"
>
<input
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 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
/>
</svg>
</span>
<span
class="MuiTouchRipple-root"
/>
</span>
<span
class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
>
DTC Enabled
</span>
</label>
</div>
<div
class="MuiFormControl-root MuiTextField-root MuiFormControl-marginNormal MuiFormControl-fullWidth"

14
src/components/Cars/Add/index.jsx
View File

@@ -38,6 +38,7 @@ const MainForm = () => {
const [dataLoggerEnabled, setDataLoggerEnabled] = useState(false);
const [maxMemBufferSize, setMaxMemBufferSize] = useState(0);
const [maxDiskBufferSize, setMaxDiskBufferSize] = useState(0);
const [dtcEnabled, setDTCEnabled] = useState(false);
useEffect(() => {
setTitle("Add Vehicle");
@@ -65,6 +66,10 @@ const MainForm = () => {
setDataLoggerEnabled(event.target.checked);
}
const onDtcEnabledChange = (event) => {
setDTCEnabled(event.target.checked);
}
const onMaxMemBufferSizeChange = (event) => {
setMaxMemBufferSize(event.target.value);
}
@@ -84,7 +89,8 @@ const MainForm = () => {
enabled: canbusEnabled,
data_logger_enabled: canbusEnabled ? dataLoggerEnabled : false,
max_mem_buffer_size: canbusEnabled ? parseInt(maxMemBufferSize) : 0,
max_disk_buffer_size: canbusEnabled && dataLoggerEnabled ? parseInt(maxDiskBufferSize) : 0
max_disk_buffer_size: canbusEnabled && dataLoggerEnabled ? parseInt(maxDiskBufferSize) : 0,
dtc_enabled: dtcEnabled
}
};
@@ -166,6 +172,12 @@ const MainForm = () => {
disabled={!canbusEnabled}
/>
} label="Data Logger Enabled" />
<FormControlLabel control={
<Checkbox
checked={dtcEnabled}
onChange={onDtcEnabledChange}
/>
} label="DTC Enabled" />
</FormGroup>
<TextField
id="max_disk_buffer_size"

2
src/components/Cars/List/__snapshots__/index.test.jsx.snap
View File

@@ -127,7 +127,7 @@ exports[`VehicleTable Render 1`] = `
/>
</div>
<div
class="makeStyles-paper-0 makeStyles-tableSize-0"
class="makeStyles-paper-0"
>
<table
class="MuiTable-root"

2
src/components/Cars/Update/__snapshots__/index.test.jsx.snap
View File

@@ -919,7 +919,7 @@ exports[`VehicleUpdate Render 1`] = `
<span
class="MuiTypography-root MuiFormControlLabel-label MuiTypography-body1"
>
Data Logger Enabled
DTC Enabled
</span>
</label>
</div>

5
src/components/Cars/Update/index.jsx
View File

@@ -150,7 +150,7 @@ const MainForm = () => {
data_logger_enabled: canbusEnabled ? dataLoggerEnabled : false,
max_mem_buffer_size: canbusEnabled ? parseInt(maxMemBufferSize) : 0,
max_disk_buffer_size: canbusEnabled && dataLoggerEnabled ? parseInt(maxDiskBufferSize) : 0,
dtc_enabled: canbusEnabled ? dtcEnabled : false
dtc_enabled: dtcEnabled
},
debug_mask: debugMaskEl.current?.value
};
@@ -382,9 +382,8 @@ const MainForm = () => {
<Checkbox
checked={dtcEnabled}
onChange={onDtcEnabledChange}
disabled={!canbusEnabled}
/>
} label="Data Logger Enabled" />
} label="DTC Enabled" />
</FormGroup>
<TextField
id="max_disk_buffer_size"

11
src/components/Contexts/FleetContext.jsx
View File

@@ -122,14 +122,17 @@ export const FleetProvider = ({ children }) => {
}
};
const addFleetVehicle = async (name, vehicle, token) => {
const addFleetVehicles = async (name, vehicles, token) => {
try {
setBusy(true);
validateFleetName(name);
validateVIN(vehicle.vin);
const result = await api.addFleetVehicle(name, vehicle, token);
for (const vin of vehicles.vins) {
validateVIN(vin);
}
const result = await api.addFleetVehicles(name, vehicles, token);
if (result.error) {
throw new Error(`Add fleet vehicle error. ${result.message}`);
}
@@ -250,7 +253,7 @@ export const FleetProvider = ({ children }) => {
fleetVehicles,
totalFleetVehicles,
getFleetVehicles,
addFleetVehicle,
addFleetVehicles,
deleteFleetVehicle,
fleetCANFilters,

14
src/components/Contexts/FleetContext.test.jsx
View File

@@ -391,14 +391,14 @@ describe("FleetContext", () => {
});
});
describe("addFleetVehicle", () => {
describe("addFleetVehicles", () => {
beforeEach(async () => {
const TestComp = () => {
const { busy, addFleetVehicle } = useFleetContext();
const { busy, addFleetVehicles } = useFleetContext();
const { message, setMessage } = useStatusContext();
const add = async (name, vehicle) => {
try {
await addFleetVehicle(name, vehicle);
await addFleetVehicles(name, vehicle);
} catch (e) {
setMessage(e.message);
}
@@ -417,8 +417,8 @@ describe("FleetContext", () => {
onClick={() => add({})}
/>
<button
data-testid="addFleetVehicle"
onClick={() => add("US-TEST", { vin: "TESTVIN1234567890" })}
data-testid="addFleetVehicles"
onClick={() => add("US-TEST", { vins: ["TESTVIN1234567890"] })}
/>
</>
);
@@ -456,8 +456,8 @@ describe("FleetContext", () => {
checkBaseResults("Invalid name", "false");
});
it("addFleetVehicle", async () => {
fireEvent.click(screen.getByTestId("addFleetVehicle"));
it("addFleetVehicles", async () => {
fireEvent.click(screen.getByTestId("addFleetVehicles"));
await waitFor(() =>
expect(screen.getByTestId("busy").innerHTML).toEqual("false")
);

2
src/components/Contexts/__mocks__/FleetContext.jsx
View File

@@ -63,7 +63,7 @@ export const useFleetContext = () => ({
fleetVehicles,
totalFleetVehicles,
getFleetVehicles: jest.fn(),
addFleetVehicle: jest.fn(),
addFleetVehicles: jest.fn(),
deleteFleetVehicle: jest.fn(),
fleetCANFilters,

2
src/components/Controls/CarSelectionTable/index.jsx
View File

@@ -132,7 +132,7 @@ const CarSelectionTable = (props) => {
}, [search]);
return (
<div className={clsx(classes.paper, classes.tableSize)}>
<div className={clsx(classes.paper)}>
<Table>
<TableHeaderSortable
classes={classes}

1436
src/components/Fleets/Status/Vehicles/Add/__snapshots__/index.test.jsx.snap
View File

File diff suppressed because it is too large Load Diff

237
src/components/Fleets/Status/Vehicles/Add/index.jsx
View File

@@ -1,6 +1,7 @@
import React, { useEffect, useRef, useState } from "react";
import React, { useEffect, useState } from "react";
import { Redirect, useParams } from "react-router";
import {
Box,
Button,
Checkbox,
FormControlLabel,
@@ -8,7 +9,11 @@ import {
FormLabel,
Radio,
RadioGroup,
TextField
TextField,
Accordion,
AccordionSummary,
AccordionDetails,
Typography,
} from "@material-ui/core";
import useStyles from "../../../../useStyles";
@@ -19,11 +24,14 @@ import {
import { useStatusContext } from "../../../../Contexts/StatusContext";
import { useUserContext } from "../../../../Contexts/UserContext";
import { logger } from "../../../../../services/monitoring";
import { VehicleProvider } from "../../../../Contexts/VehicleContext";
import CarSelectionTable from "../../../../Controls/CarSelectionTable";
import SearchField from "../../../../Controls/SearchField";
const MainForm = () => {
const { name } = useParams();
const { setMessage, setTitle, setSitePath } = useStatusContext();
const { addFleetVehicle, busy } = useFleetContext();
const { addFleetVehicles, busy } = useFleetContext();
const {
token: {
idToken: { jwtToken: token },
@@ -32,7 +40,8 @@ const MainForm = () => {
const classes = useStyles();
const [redirect, setRedirect] = useState(null);
const vinEl = useRef(null);
const [vins, setVins] = useState([]);
const [search, setSearch] = useState("");
const [selectedLogLevel, setSelectedLogLevel] = useState("info");
const [canbusEnabled, setCANBusEnabled] = useState(true);
const [dataLoggerEnabled, setDataLoggerEnabled] = useState(false);
@@ -58,6 +67,30 @@ const MainForm = () => {
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
const handleSearch = (query) => {
setVins([]);
setSearch(query);
};
const handleSelectAll = (cars) => {
setVins(cars);
};
const handleSelect = (event, key) => {
try {
let newVins;
if (event.target.checked) {
newVins = [...vins];
newVins.push(key);
} else {
newVins = vins.filter((vin) => vin !== key);
}
setVins(newVins);
} catch (e) {
logger.warn(e.stack);
}
};
const onLogLevelChange = (event) => {
setSelectedLogLevel(event.target.value);
}
@@ -79,11 +112,11 @@ const MainForm = () => {
}
const onSubmit = async (event) => {
try {
event.preventDefault();
event.preventDefault();
try {
const formData = {
vin: vinEl.current.value,
vins,
log_level: selectedLogLevel,
canbus: {
enabled: canbusEnabled,
@@ -93,9 +126,9 @@ const MainForm = () => {
}
};
const result = await addFleetVehicle(name, formData, token);
const result = await addFleetVehicles(name, formData, token);
setMessage(`Added ${result.vin}`);
setMessage(`Added ${result.vins.join(", ")}`);
setRedirect(`/fleet/${name}#vehicles`);
} catch (e) {
setMessage(e.message);
@@ -110,94 +143,106 @@ const MainForm = () => {
return (
<div className={classes.paper}>
<form className={classes.form} noValidate action="{onSubmit}">
<TextField
id="vin"
name="vin"
label="VIN"
variant="outlined"
margin="normal"
inputProps={{
maxLength: "17",
}}
required
fullWidth
inputRef={vinEl}
/>
<FormLabel id="demo-row-radio-buttons-group-label">Log Level</FormLabel>
<RadioGroup
row
aria-labelledby="demo-row-radio-buttons-group-label"
name="log-level-group"
value={selectedLogLevel}
onChange={onLogLevelChange}
margin="normal"
>
<FormControlLabel value="trace" control={<Radio />} label="Trace" />
<FormControlLabel value="debug" control={<Radio />} label="Debug" />
<FormControlLabel value="info" control={<Radio />} label="Info" />
<FormControlLabel value="warning" control={<Radio />} label="Warning" />
<FormControlLabel value="error" control={<Radio />} label="Error" />
<FormControlLabel value="critical" control={<Radio />} label="Critical" />
</RadioGroup>
<FormLabel id="demo-row-radio-buttons-group-label">CAN Bus</FormLabel>
<FormGroup>
<FormControlLabel control={
<Checkbox
checked={canbusEnabled}
onChange={onCANBusChange}
/>
} label="CAN Bus Enabled" />
<TextField
id="max_mem_buffer_size"
name="max_mem_buffer_size"
label='Max Memory Buffer Size (0 uses default size)'
value={maxMemBufferSize}
onChange={onMaxMemBufferSizeChange}
variant="outlined"
margin="normal"
inputProps={{
maxLength: "12",
}}
type="number"
disabled={!canbusEnabled}
required
fullWidth
<SearchField classes={classes} onSearch={handleSearch}/>
<VehicleProvider sx={{ height: "auto" }}>
<CarSelectionTable
classes={classes}
token={token}
multiSelect={true}
search={{search}}
selected={vins}
onSelect={handleSelect}
onSelectAll={handleSelectAll}
/>
<FormControlLabel control={
<Checkbox
checked={dataLoggerEnabled}
onChange={onDataLoggerChange}
disabled={!canbusEnabled}
/>
} label="Data Logger Enabled" />
</FormGroup>
<TextField
id="max_disk_buffer_size"
name="max_disk_buffer_size"
label='Max Disk Buffer Size (0 uses default size)'
value={maxDiskBufferSize}
onChange={onMaxDiskBufferSizeChange}
variant="outlined"
margin="normal"
inputProps={{
maxLength: "12",
}}
type="number"
disabled={!dataLoggerEnabled}
required
fullWidth
/>
<Button
type="submit"
disabled={busy}
fullWidth
variant="contained"
color="primary"
className={classes.submit}
onClick={onSubmit}
>
{busy ? "Submitting..." : "Submit"}
</Button>
</VehicleProvider>
<Box className={classes.fleetVehicleAddSubmit}>
<Accordion>
<AccordionSummary>
<Typography>Additional Options</Typography>
</AccordionSummary>
<AccordionDetails>
<Box sx={{ width: "100%" }}>
<FormLabel id="demo-row-radio-buttons-group-label">Log Level</FormLabel>
<RadioGroup
row
aria-labelledby="demo-row-radio-buttons-group-label"
name="log-level-group"
value={selectedLogLevel}
onChange={onLogLevelChange}
margin="normal"
>
<FormControlLabel value="trace" control={<Radio />} label="Trace" />
<FormControlLabel value="debug" control={<Radio />} label="Debug" />
<FormControlLabel value="info" control={<Radio />} label="Info" />
<FormControlLabel value="warning" control={<Radio />} label="Warning" />
<FormControlLabel value="error" control={<Radio />} label="Error" />
<FormControlLabel value="critical" control={<Radio />} label="Critical" />
</RadioGroup>
<FormLabel id="demo-row-radio-buttons-group-label">CAN Bus</FormLabel>
<FormGroup>
<FormControlLabel control={
<Checkbox
checked={canbusEnabled}
onChange={onCANBusChange}
/>
} label="CAN Bus Enabled" />
<TextField
id="max_mem_buffer_size"
name="max_mem_buffer_size"
label='Max Memory Buffer Size (0 uses default size)'
value={maxMemBufferSize}
onChange={onMaxMemBufferSizeChange}
variant="outlined"
margin="normal"
inputProps={{
maxLength: "12",
}}
type="number"
disabled={!canbusEnabled}
required
fullWidth
/>
<FormControlLabel control={
<Checkbox
checked={dataLoggerEnabled}
onChange={onDataLoggerChange}
disabled={!canbusEnabled}
/>
} label="Data Logger Enabled" />
</FormGroup>
<TextField
id="max_disk_buffer_size"
name="max_disk_buffer_size"
label='Max Disk Buffer Size (0 uses default size)'
value={maxDiskBufferSize}
onChange={onMaxDiskBufferSizeChange}
variant="outlined"
margin="normal"
inputProps={{
maxLength: "12",
}}
type="number"
disabled={!dataLoggerEnabled}
required
fullWidth
/>
</Box>
</AccordionDetails>
</Accordion>
<Button
type="submit"
disabled={busy}
fullWidth
variant="contained"
color="primary"
className={classes.submit}
onClick={onSubmit}
>
{busy ? "Submitting..." : "Submit"}
</Button>
</Box>
</form>
</div>
);

8
src/components/useStyles.jsx
View File

@@ -295,6 +295,14 @@ const useStyles = makeStyles((theme) => ({
whiteSpace: "normal",
wordWrap: "break-word",
},
fleetVehicleAddSubmit: {
position: "sticky",
bottom: 0,
right: 0,
width: "100%",
padding: "16px 0",
backgroundColor: "#fafafa",
}
}));
export default useStyles;

4
src/services/__mocks__/fleetsAPI.js
View File

@@ -62,8 +62,8 @@ const fleetsAPI = {
getFleetVehicles: async () => {
return { data: vehicles };
},
addFleetVehicle: async (_name, vehicle) => {
vehicles.push(vehicle.vin);
addFleetVehicles: async (_name, vehicle) => {
vehicles.push(...vehicle.vins);
return vehicle;
},
deleteFleetVehicle: async (_name, vehicle) => {

4
src/services/fleetsAPI.js
View File

@@ -73,14 +73,14 @@ const fleetsAPI = {
.then(fetchRespHandler)
.catch(errorHandler),
addFleetVehicle: async (name, vehicle, token) =>
addFleetVehicles: async (name, vehicles, token) =>
fetch(`${API_ENDPOINT}/fleet/${name}/vehicle`, {
method: "POST",
headers: Object.assign(
{ "Content-Type": "application/json" },
getAuthHeaderOptions(token)
),
body: JSON.stringify(vehicle),
body: JSON.stringify(vehicles),
})
.then(fetchRespHandler)
.catch(errorHandler),