diff --git a/src/components/App/__snapshots__/App.test.js.snap b/src/components/App/__snapshots__/App.test.js.snap index b93036c..bbdf041 100644 --- a/src/components/App/__snapshots__/App.test.js.snap +++ b/src/components/App/__snapshots__/App.test.js.snap @@ -6,10 +6,10 @@ exports[`App Route / authenticated 1`] = ` data-testid="mocked-userprovider" >
Fisker Admin Portal
@@ -190,16 +190,16 @@ exports[`App Route / authenticated 1`] = `

Fisker Admin Portal
@@ -461,178 +461,441 @@ exports[`App Route /carupdate-deploy authenticated 1`] = `
-
-

- Created - - . - -

-
-
+

+ Created + + . + No description +

-
- -
- - - + +
+
+
+
+ 0 Selected
- -
- - - -
-
-
- No Cars Selected + Deploy + +
-
- - + + + + + + + + + + + + + + + + + + +
+ + + + + + + + + + VIN + + sorted ascending + + + + + + Model + + + + + Year + + + + + Trim + + + + + Created + + + + + Updated + + +
+
+ +

@@ -648,10 +911,10 @@ exports[`App Route /carupdate-deploy unauthenticated 1`] = ` data-testid="mocked-userprovider" >
@@ -703,10 +966,10 @@ exports[`App Route /carupdate-status authenticated 1`] = ` data-testid="mocked-userprovider" >
Fisker Admin Portal
@@ -887,10 +1150,10 @@ exports[`App Route /carupdate-status authenticated 1`] = `
-
- - - - - - - - - - - - + + + + + + + + + - - - - -
- ID - - Vehicle - - Status - - Created - - Updated -
+ Vehicle + + Status + + Created + + Updated +
-
-
+

+ 0-0 of 0 +

+
+ + +
+
+ + + +
@@ -1092,10 +1350,10 @@ exports[`App Route /carupdate-status unauthenticated 1`] = ` data-testid="mocked-userprovider" >
@@ -1147,10 +1405,10 @@ exports[`App Route /home authenticated 1`] = ` data-testid="mocked-userprovider" >
Fisker Admin Portal
@@ -1331,16 +1589,16 @@ exports[`App Route /home authenticated 1`] = `

@@ -1416,10 +1674,10 @@ exports[`App Route /package-upload authenticated 1`] = ` data-testid="mocked-userprovider" >
Fisker Admin Portal
@@ -1602,10 +1860,10 @@ exports[`App Route /package-upload authenticated 1`] = `
Fisker Admin Portal
@@ -2106,16 +2364,16 @@ exports[`App Route /page-not-found authenticated 1`] = `

+`; + +exports[`App Route /updates unauthenticated 1`] = ` + +`; + +exports[`App Route /vehicle-add authenticated 1`] = ` + +`; + +exports[`App Route /vehicle-add unauthenticated 1`] = ` +
+
+
+
+
+
+
+
+
+
+
+
+
+`; + +exports[`App Route /vehicle-status authenticated 1`] = ` +
+
+
+
+
+
+ Vehicle FISKER123 Details +
+ +
+
+ +
+
+
+
+
ID sorted descending @@ -3034,1758 +4283,7 @@ exports[`App Route /updates authenticated 1`] = ` role="button" tabindex="0" > - Version - - - - - - - - - - - - - -
- - Created - - - - Actions -
-
-
-
-
-
-
-
-
-`; - -exports[`App Route /updates unauthenticated 1`] = ` -
-
-
-
-
-
-
-
-
-
-
-
-
-`; - -exports[`App Route /vehicle-add authenticated 1`] = ` -
-
-
-
-
-
- Add Vehicle -
- -
-
- -
-
-
-
-
-
-
- -
- - -
-
-
- -
- - -
-
-
- -
- - -
-
- -
-
-
-
-
-
-
-
-`; - -exports[`App Route /vehicle-add unauthenticated 1`] = ` -
-
-
-
-
-
-
-
-
-
-
-
-
-`; - -exports[`App Route /vehicle-status authenticated 1`] = ` -
-
-
-
-
-
- Vehicle FISKER123 Details -
- -
-
- -
-
-
-
-
-
-
- - - - - - - - - - - - - - - - -
- - ID - - sorted descending - - - - - - Name - - - - - Status - - - - - Created - - - - - Updated - - -
-
-
-
-
-
- -
- - - -
-
-
- -
- - - -
-
- - - - - - -
-
-
-
-
-
-
-
-
-
-
-`; - -exports[`App Route /vehicle-status unauthenticated 1`] = ` -
-
-
-
-
-
-
-
-
-
-
-
-
-`; - -exports[`App Route /vehicles authenticated 1`] = ` -
-
-
-
-
-
- Vehicles -
- -
-
- -
-
-
-
-
-
-
- -
- -
- -
-
-
-
-
- - - - - - -
- - VIN - - sorted ascending - - - - - - Model - - - - - Year - - - - - Trim + Status
`; -exports[`App Route /vehicles unauthenticated 1`] = ` +exports[`App Route /vehicle-status unauthenticated 1`] = `
+`; + +exports[`App Route /vehicles unauthenticated 1`] = ` + +`; + +exports[`App Route /vehicles-command authenticated 1`] = ` +
+
+
+
+
+
+ Send Command +
+ +
+
+ +
+
+
+
+
+
+
+ +
+ +
+ +
+
+
+
+ 0 Selected +
+
+
+
+
+ +
+ + + +
+
+
+ +
+ + + +
+
+ + + + + +
+
+
+
VIN sorted ascending @@ -5623,181 +5920,6 @@ exports[`App Route /vehicles-command authenticated 1`] = `
-
-
- -
- - - -
-
-
- -
- - - -
-
- - - - - -
@@ -5813,10 +5935,10 @@ exports[`App Route /vehicles-command unauthenticated 1`] = ` data-testid="mocked-userprovider" >
diff --git a/src/components/CarUpdates/Deploy/index.jsx b/src/components/CarUpdates/Deploy/index.jsx index 8974c78..f9a7100 100644 --- a/src/components/CarUpdates/Deploy/index.jsx +++ b/src/components/CarUpdates/Deploy/index.jsx @@ -1,15 +1,17 @@ import React, { useEffect, useState } from "react"; import { useParams, Redirect } from "react-router"; -import { Button, Typography } from "@material-ui/core"; +import { Button, Grid, Typography } from "@material-ui/core"; import { UpdatesProvider, useUpdatesContext, } from "../../Contexts/UpdatesContext"; +import { VehicleProvider } from "../../Contexts/VehicleContext"; import { useUserContext } from "../../Contexts/UserContext"; import { useStatusContext } from "../../Contexts/StatusContext"; -import CarSelection from "../../Cars/CarSelection"; import useStyles from "../../useStyles"; import { tsLocalDateTimeString } from "../../../utils/dates"; +import SearchField from "../../Controls/SearchField"; +import CarSelectionTable from "../../Cars/CarSelectionTable"; const MainForm = () => { const { packageid } = useParams(); @@ -24,20 +26,41 @@ const MainForm = () => { const [version, setVersion] = useState(""); const [description, setDescription] = useState(""); const [createDate, setCreateDate] = useState(""); - const [selectedVehicles, setSelectedVehicles] = useState([]); + const [selected, setSelected] = useState([]); + const [search, setSearch] = useState(""); const [redirect, setRedirect] = useState(""); const classes = useStyles(); + const handleSearch = (search) => { + setSelected([]); + setSearch(search); + }; + + const handleSelectAll = (cars) => { + setSelected(cars); + }; + + const handleSelect = (event, key) => { + let newSelected; + if (event.target.checked) { + newSelected = [...selected]; + newSelected.push(key); + } else { + newSelected = selected.filter((vin) => vin !== key); + } + setSelected(newSelected); + }; + const onSubmit = async (event) => { try { event.preventDefault(); const data = { package_id: parseInt(packageid), - vins: selectedVehicles, + vins: selected, }; await createCarUpdates(data, token); setMessage( - `Deployed ${packageName} ${version} to ${selectedVehicles.length} cars` + `Deployed ${packageName} ${version} to ${selected.length} cars` ); setRedirect(`/carupdate-status/${packageid}`); } catch (e) { @@ -80,30 +103,48 @@ const MainForm = () => {
- Created {createDate}. {description} + Created {createDate}. {description || "No description"} -
- - + + + +
{`${selected.length} Selected`}
+
+ + + +
+
); }; const UpdatePackageDeployForm = () => ( - - - + + + + + ); export default UpdatePackageDeployForm; diff --git a/src/components/CarUpdates/Status/index.jsx b/src/components/CarUpdates/Status/index.jsx index c44b9a9..5ca0779 100644 --- a/src/components/CarUpdates/Status/index.jsx +++ b/src/components/CarUpdates/Status/index.jsx @@ -1,11 +1,11 @@ import React, { useEffect, useState } from "react"; import { useParams } from "react-router"; +import { Link } from "react-router-dom"; import { LinearProgress, Table, TableBody, TableCell, - TableContainer, TableFooter, TableHead, TablePagination, @@ -20,14 +20,12 @@ import { useUserContext } from "../../Contexts/UserContext"; import { useStatusContext } from "../../Contexts/StatusContext"; import useStyles from "../../useStyles"; import { LocalDateTimeString } from "../../../utils/dates"; -import VehicleStatus from "../../Cars/StatusModal"; const MainForm = () => { const { packageid } = useParams(); const classes = useStyles(); const [pageSize, setPageSize] = useState(10); const [pageIndex, setPageIndex] = useState(0); - const [viewVIN, setViewVIN] = useState(null); const { getCarUpdates, carUpdates, @@ -99,75 +97,58 @@ const MainForm = () => { setPageIndex(0); }; - const handleViewVIN = (event) => { - event.preventDefault(); - setViewVIN(event.target.innerHTML); - }; - - const handleCloseViewVIN = (event) => { - setViewVIN(null); - }; - return (
- - - - - ID - Vehicle - Status - Created - Updated +
+ + + ID + Vehicle + Status + Created + Updated + + + + {carUpdates.map((row) => ( + + {row.id} + + {row.vin} + + + {row.status} + {row.progress > 0 && ( + + )} + + + {LocalDateTimeString(row.created)} + + + {LocalDateTimeString(row.updated)} + - - - {carUpdates.map((row) => ( - - {row.id} - - - {row.vin} - - - - {row.status} - {row.progress > 0 && ( - - )} - - - {LocalDateTimeString(row.created)} - - - {LocalDateTimeString(row.updated)} - - - ))} - - - - - - -
-
- + ))} + + + + + + +
); }; diff --git a/src/components/Cars/Add/index.jsx b/src/components/Cars/Add/index.jsx index f00e28f..0b7c8b6 100644 --- a/src/components/Cars/Add/index.jsx +++ b/src/components/Cars/Add/index.jsx @@ -21,6 +21,7 @@ const MainForm = () => { const vinEl = useRef(null); const modelEl = useRef(null); const yearEl = useRef(null); + const trimEl = useRef(null); useEffect(() => { setTitle("Add Vehicle"); @@ -34,6 +35,7 @@ const MainForm = () => { vin: vinEl.current.value, model: modelEl.current.value, year: parseInt(yearEl.current.value), + trim: trimEl.current.value, }; const result = await addVehicle(formData, token); @@ -91,6 +93,21 @@ const MainForm = () => { fullWidth inputRef={yearEl} /> +