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

Merge branch 'release/0.0.3'

Browse Source
This commit is contained in:
jwu-fisker
2022-09-28 09:01:19 -07:00
parent 56043dc375
commit a1ac3888fa
31 changed files with 959 additions and 437 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -28,6 +28,7 @@ exports[`FleetDetailsTab Render 1`] = `
Name
</b>
:
Test Fleet
</p>
<p>
<b>
@@ -91,13 +92,13 @@ exports[`FleetDetailsTab Render 1`] = `
>
<a
class=""
href="/fleet-update?name=undefined"
href="/fleet-update?name=Test Fleet"
style="margin: 5px;"
title="Update \\"undefined\\""
title="Update \\"Test Fleet\\""
>
<svg
aria-hidden="true"
aria-label="Update \\"undefined\\""
aria-label="Update \\"Test Fleet\\""
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
@@ -110,11 +111,11 @@ exports[`FleetDetailsTab Render 1`] = `
<a
class=""
href="/"
title="Delete \\"undefined\\""
title="Delete \\"Test Fleet\\""
>
<svg
aria-hidden="true"
aria-label="Delete \\"undefined\\""
aria-label="Delete \\"Test Fleet\\""
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
@@ -126,6 +127,7 @@ exports[`FleetDetailsTab Render 1`] = `
</a>
</div>
</div>
<div />
</div>
</div>
</div>

5
src/components/Fleets/Status/Details/index.jsx
View File

@@ -14,12 +14,14 @@ import { useStatusContext } from "../../../Contexts/StatusContext";
import { FleetProvider, useFleetContext } from "../../../Contexts/FleetContext"
import useStyles from "../../../useStyles";
import { logger } from "../../../../services/monitoring";
import DeleteConfirmation from "../../../DeleteConfirmation";
const MainForm = ({ name }) => {
const classes = useStyles();
const { setMessage } = useStatusContext();
const { fleet, getFleet, deleteFleet } = useFleetContext();
const [redirect, setRedirect] = useState(null);
const [showDeleteModal, setShowDeleteModal] = useState(false)
const { token: { idToken: { jwtToken: token } } } = useUserContext();
useEffect(() => {
@@ -77,12 +79,13 @@ const MainForm = ({ name }) => {
</Link>
</Tooltip>
<Tooltip key={`delete-${name}`} title={`Delete "${name}"`}>
<Link to="#" onClick={onDelete}>
<Link to="#" onClick={() => setShowDeleteModal(true)}>
<DeleteIcon aria-label={`Delete "${name}"`} />
</Link>
</Tooltip>
</Grid>
</Grid>
<DeleteConfirmation message={name} open={showDeleteModal} close={()=> setShowDeleteModal(false)} deleteFunction={onDelete}/>
</div >
);
};

8
src/components/Fleets/Status/Details/index.test.jsx
View File

@@ -4,6 +4,7 @@ jest.mock("../../../Contexts/UserContext");
import { render, waitFor } from "@testing-library/react";
import { BrowserRouter } from "react-router-dom";
import routeData from "react-router";
import { FleetProvider } from "../../../Contexts/FleetContext";
import { StatusProvider } from "../../../Contexts/StatusContext";
@@ -18,7 +19,7 @@ const renderFleetDetailsTab = async () => {
<StatusProvider>
<UserProvider>
<BrowserRouter>
<MainForm />
<MainForm name="Test Fleet"/>
</BrowserRouter>
</UserProvider>
</StatusProvider>
@@ -35,6 +36,11 @@ describe("FleetDetailsTab", () => {
addSnapshotSerializer(expect);
});
beforeEach(() => {
// Does not work if placed in beforeAll
jest.spyOn(routeData, 'useParams').mockReturnValue({ name: "Test Fleet" })
})
it("Render", async () => {
setToken(TEST_AUTH_OBJECT);
const container = await renderFleetDetailsTab();

105
src/components/Fleets/Status/Vehicles/Table/__snapshots__/index.test.jsx.snap
View File

@@ -153,23 +153,26 @@ exports[`FleetVehiclesTable Render 1`] = `
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345678\\""
>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345678"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
<div>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345678\\""
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345678"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<div />
</div>
</td>
</tr>
<tr
@@ -187,23 +190,26 @@ exports[`FleetVehiclesTable Render 1`] = `
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345679\\""
>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345679"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
<div>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345679\\""
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345679"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<div />
</div>
</td>
</tr>
<tr
@@ -221,23 +227,26 @@ exports[`FleetVehiclesTable Render 1`] = `
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345670\\""
>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345670"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
<div>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345670\\""
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345670"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<div />
</div>
</td>
</tr>
</tbody>

68
src/components/Fleets/Status/Vehicles/Table/index.jsx
View File

@@ -1,5 +1,5 @@
import React, { useEffect, useState } from "react";
import { Link } from 'react-router-dom';
import { Link } from "react-router-dom";
import {
Grid,
Table,
@@ -15,24 +15,28 @@ import DeleteIcon from "@material-ui/icons/Delete";
import clsx from "clsx";
import TableHeaderSortable from "../../../../Table/HeaderSortable";
import { useUserContext } from "../../../../Contexts/UserContext"
import { useUserContext } from "../../../../Contexts/UserContext";
import { useStatusContext } from "../../../../Contexts/StatusContext";
import { FleetProvider, useFleetContext } from "../../../../Contexts/FleetContext"
import {
FleetProvider,
useFleetContext,
} from "../../../../Contexts/FleetContext";
import useStyles from "../../../../useStyles";
import SearchField from "../../../../Controls/SearchField";
import { logger } from "../../../../../services/monitoring";
import { Roles, hasRole } from "../../../../../utils/roles";
import {useLocalStorage} from "../../../../useLocalStorage";
import { useLocalStorage } from "../../../../useLocalStorage";
import DeleteConfirmation from "../../../../DeleteConfirmation";
const tableColumns = [
{
id: "vin",
label: "VIN"
label: "VIN",
},
{
id: "",
label: "Actions"
}
label: "Actions",
},
];
const PAGE_SIZE = "FLEET_STATUS_VEHICLES_TABLE_PAGE_SIZE";
@@ -43,10 +47,21 @@ const MainForm = ({ name }) => {
const [orderBy, setOrderBy] = useState("id");
const [order, setOrder] = useState("desc");
const [search, setSearch] = useState("");
const [showDeleteModal, setShowDeleteModal] = useState(false);
const classes = useStyles();
const { setMessage } = useStatusContext();
const { fleetVehicles, totalFleetVehicles, getFleetVehicles, deleteFleetVehicle } = useFleetContext();
const { token: { idToken: { jwtToken: token } }, groups } = useUserContext();
const {
fleetVehicles,
totalFleetVehicles,
getFleetVehicles,
deleteFleetVehicle,
} = useFleetContext();
const {
token: {
idToken: { jwtToken: token },
},
groups,
} = useUserContext();
const handleSearch = (query) => {
setSearch(query);
@@ -103,7 +118,7 @@ const MainForm = ({ name }) => {
const onDelete = async (vin) => {
try {
await deleteFleetVehicle(name, { vin: vin }, token);
setMessage(`Deleted ${vin}`)
setMessage(`Deleted ${vin}`);
} catch (e) {
setMessage(e.message);
logger.warn(e.stack);
@@ -116,8 +131,8 @@ const MainForm = ({ name }) => {
actions.push({
tip: `Delete "${vin}"`,
id: vin,
icon: <DeleteIcon aria-label={`Delete ${vin}`} />
})
icon: <DeleteIcon aria-label={`Delete ${vin}`} />,
});
}
if (actions.length === 0) return ["No actions"];
@@ -132,11 +147,19 @@ const MainForm = ({ name }) => {
);
} else {
return (
<Tooltip key={`delete-${action.id}`} title={action.tip}>
<Link to="#" onClick={() => onDelete(action.id)}>
{action.icon}
</Link>
</Tooltip>
<div>
<Tooltip key={`delete-${action.id}`} title={action.tip}>
<Link to="#" onClick={() => onDelete(action.id)}>
{action.icon}
</Link>
</Tooltip>
<DeleteConfirmation
message={action.id}
open={showDeleteModal}
close={() => setShowDeleteModal(false)}
deleteFunction={() => onDelete(action.id)}
/>
</div>
);
}
});
@@ -146,12 +169,15 @@ const MainForm = ({ name }) => {
<div className={clsx(classes.paper, classes.tableSize)}>
<Grid container className={classes.root} spacing={2}>
<Grid item md={4} className={classes.textJustifyAlign}>
<Link to={`/fleet/${name}/vehicle-add`} className={classes.labelInline}>
<Link
to={`/fleet/${name}/vehicle-add`}
className={classes.labelInline}
>
<AddCircleIcon fontSize="large" />
</Link>
</Grid>
<Grid item md={8} align="right" className={classes.textCenterAlign}>
<SearchField classes={classes} onSearch={handleSearch}/>
<SearchField classes={classes} onSearch={handleSearch} />
</Grid>
</Grid>
<Table>
@@ -163,7 +189,7 @@ const MainForm = ({ name }) => {
onSortRequest={handleSort}
/>
<TableBody>
{fleetVehicles.map(vin => (
{fleetVehicles.map((vin) => (
<TableRow key={vin}>
<TableCell align="center">
<Link to={`/vehicle-status/${vin}`}>{vin}</Link>
@@ -190,7 +216,7 @@ const MainForm = ({ name }) => {
</TableRow>
</TableFooter>
</Table>
</div >
</div>
);
};

1
src/components/Fleets/Status/__snapshots__/DetailsTab.test.jsx.snap
View File

@@ -135,6 +135,7 @@ exports[`DetailsTab Render 1`] = `
</a>
</div>
</div>
<div />
</div>
</div>
</div>

105
src/components/Fleets/Status/__snapshots__/VehiclesTab.test.jsx.snap
View File

@@ -152,23 +152,26 @@ exports[`VehiclesTab Render 1`] = `
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345678\\""
>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345678"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
<div>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345678\\""
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345678"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<div />
</div>
</td>
</tr>
<tr
@@ -186,23 +189,26 @@ exports[`VehiclesTab Render 1`] = `
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345679\\""
>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345679"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
<div>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345679\\""
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345679"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<div />
</div>
</td>
</tr>
<tr
@@ -220,23 +226,26 @@ exports[`VehiclesTab Render 1`] = `
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345670\\""
>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345670"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
<div>
<a
class=""
href="/"
title="Delete \\"USWESTVIN12345670\\""
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<svg
aria-hidden="true"
aria-label="Delete USWESTVIN12345670"
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
/>
</svg>
</a>
<div />
</div>
</td>
</tr>
</tbody>

12
src/components/Fleets/Status/__snapshots__/index.test.jsx.snap
View File

@@ -124,6 +124,7 @@ exports[`FleetStatus Render 1`] = `
Name
</b>
:
Fleet Name
</p>
<p>
<b>
@@ -187,13 +188,13 @@ exports[`FleetStatus Render 1`] = `
>
<a
class=""
href="/fleet-update?name=undefined"
href="/fleet-update?name=Fleet Name"
style="margin: 5px;"
title="Update \\"undefined\\""
title="Update \\"Fleet Name\\""
>
<svg
aria-hidden="true"
aria-label="Update \\"undefined\\""
aria-label="Update \\"Fleet Name\\""
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
@@ -206,11 +207,11 @@ exports[`FleetStatus Render 1`] = `
<a
class=""
href="/"
title="Delete \\"undefined\\""
title="Delete \\"Fleet Name\\""
>
<svg
aria-hidden="true"
aria-label="Delete \\"undefined\\""
aria-label="Delete \\"Fleet Name\\""
class="MuiSvgIcon-root"
focusable="false"
viewBox="0 0 24 24"
@@ -222,6 +223,7 @@ exports[`FleetStatus Render 1`] = `
</a>
</div>
</div>
<div />
</div>
</div>
</div>

6
src/components/Fleets/Status/index.test.jsx
View File

@@ -7,6 +7,7 @@ jest.mock("@material-ui/core/utils/unstable_useId", () =>
import { render, waitFor } from "@testing-library/react";
import { BrowserRouter } from "react-router-dom";
import routeData from "react-router";
import { FleetProvider } from "../../Contexts/FleetContext";
import { StatusProvider } from "../../Contexts/StatusContext";
@@ -38,6 +39,11 @@ describe("FleetStatus", () => {
addSnapshotSerializer(expect);
});
beforeEach(() => {
// Does not work if placed in beforeAll
jest.spyOn(routeData, 'useParams').mockReturnValue({ name: "Fleet Name" })
})
it("Render", async () => {
setToken(TEST_AUTH_OBJECT);
const container = await renderCarStatus();