diff --git a/src/components/BulkActions/actions/UpdateFlashpackNumbers.jsx b/src/components/BulkActions/actions/UpdateFlashpackNumbers.jsx index 675c02e..07e6318 100644 --- a/src/components/BulkActions/actions/UpdateFlashpackNumbers.jsx +++ b/src/components/BulkActions/actions/UpdateFlashpackNumbers.jsx @@ -20,7 +20,7 @@ export default forwardRef(({ if (data.error) { setMessage(`${data.error}: ${data.message}`); } else if (selectAll) { - setMessage(`Updating flashpack number all VINs in ${fleet}`); + setMessage(`Updating flashpack numbers for all VINs in fleet: ${fleet}`); } else if (ids.length === 1) { setMessage(`Updating flashpack number for ${ids[0]}`); } else { diff --git a/src/components/Contexts/FleetContext.jsx b/src/components/Contexts/FleetContext.jsx index b2c2313..a231bc6 100644 --- a/src/components/Contexts/FleetContext.jsx +++ b/src/components/Contexts/FleetContext.jsx @@ -26,6 +26,8 @@ export const FleetProvider = ({ children }) => { const [fleetCANFilters, setFleetCANFilters] = useState([]); const [totalFleetCANFilters, setTotalFleetCANFilters] = useState(0); + const [fleetFlashpackInfo, setFleetFlashpackInfo] = useState([]); + const addFleet = async (f, token) => { try { setBusy(true); @@ -351,6 +353,25 @@ export const FleetProvider = ({ children }) => { } }; + const getFleetFlashpackInfo = async (name, token) => { + try { + setBusy(true); + + validateFleetName(name); + + const result = await api.getFlashpackVersionInfoFleet(name, token); + if (result.error) { + throw new Error(`Get flashpack version fleet into error. ${result.message}`); + } + + setFleetFlashpackInfo(result); + + return result; + } finally { + setBusy(false); + } + } + useEffect(() => { setCarUpdateIds(() => fleetVehicles .filter((vehicle) => vehicle.car_update_status && vehicle.car_update_status !== "installed") @@ -384,7 +405,10 @@ export const FleetProvider = ({ children }) => { getFleetCANFilters, addFleetCANFilter, updateFleetCANFilter, - deleteFleetCANFilter + deleteFleetCANFilter, + + fleetFlashpackInfo, + getFleetFlashpackInfo, }} > {children} diff --git a/src/components/Fleets/Status/Details/__snapshots__/index.test.jsx.snap b/src/components/Fleets/Status/Details/__snapshots__/index.test.jsx.snap index 42882d6..ba3efa4 100644 --- a/src/components/Fleets/Status/Details/__snapshots__/index.test.jsx.snap +++ b/src/components/Fleets/Status/Details/__snapshots__/index.test.jsx.snap @@ -198,6 +198,27 @@ exports[`FleetDetailsTab Render 1`] = ` +
+
+
+
+

+ + Flashpack Information + +

+
+
+
+
diff --git a/src/components/Fleets/Status/Details/index.jsx b/src/components/Fleets/Status/Details/index.jsx index 12243de..fcfa057 100644 --- a/src/components/Fleets/Status/Details/index.jsx +++ b/src/components/Fleets/Status/Details/index.jsx @@ -3,6 +3,11 @@ import { Redirect } from "react-router"; import { Link } from 'react-router-dom'; import { Grid, + Table, + TableBody, + TableCell, + TableFooter, + TableRow, Tooltip, } from "@material-ui/core"; import EditIcon from "@material-ui/icons/Edit" @@ -16,11 +21,23 @@ import useStyles from "../../../useStyles"; import { logger } from "../../../../services/monitoring"; import DeleteConfirmation from "../../../DeleteConfirmation"; import BulkActions from "../../../BulkActions"; +import TableHeaderSortable from "../../../Table/HeaderSortable"; + +const tableColumns = [ + { + id: "flashpack", + label: "Flashpack", + }, + { + id: "vehicles", + label: "# of Vehicles in Fleet", + }, +]; const MainForm = ({ name }) => { const classes = useStyles(); const { setMessage } = useStatusContext(); - const { fleet, getFleet, deleteFleet } = useFleetContext(); + const { fleet, getFleet, deleteFleet, fleetFlashpackInfo, getFleetFlashpackInfo } = useFleetContext(); const [redirect, setRedirect] = useState(null); const [showDeleteModal, setShowDeleteModal] = useState(false) const { token: { idToken: { jwtToken: token } } } = useUserContext(); @@ -32,6 +49,7 @@ const MainForm = ({ name }) => { try { if (!name || !token) return; await getFleet(name, token); + await getFleetFlashpackInfo(name, token); } catch (e) { setMessage(e.message); logger.warn(e.stack); @@ -104,6 +122,43 @@ const MainForm = ({ name }) => { + +
+ + +

+ Flashpack Information +

+
+
+ {fleetFlashpackInfo && ( + { return null }} + /> + + { + fleetFlashpackInfo.data && Object.entries(fleetFlashpackInfo.data).map(([flashpack, occurrences]) => ( + + {flashpack} + {occurrences.toString()} + + )) + } + + + + {!fleetFlashpackInfo || fleetFlashpackInfo.length === 0 ? ( + No flashpack info for fleet + ) : <>} + + +
)} +
+
setShowDeleteModal(false)} deleteFunction={onDelete} /> ); diff --git a/src/components/Fleets/Status/__snapshots__/DetailsTab.test.jsx.snap b/src/components/Fleets/Status/__snapshots__/DetailsTab.test.jsx.snap index 7c78bb6..13d7706 100644 --- a/src/components/Fleets/Status/__snapshots__/DetailsTab.test.jsx.snap +++ b/src/components/Fleets/Status/__snapshots__/DetailsTab.test.jsx.snap @@ -206,6 +206,27 @@ exports[`DetailsTab Render 1`] = ` +
+
+
+
+

+ + Flashpack Information + +

+
+
+
+
diff --git a/src/components/Fleets/Status/__snapshots__/index.test.jsx.snap b/src/components/Fleets/Status/__snapshots__/index.test.jsx.snap index 1253e9b..159542b 100644 --- a/src/components/Fleets/Status/__snapshots__/index.test.jsx.snap +++ b/src/components/Fleets/Status/__snapshots__/index.test.jsx.snap @@ -295,6 +295,27 @@ exports[`FleetStatus Render 1`] = ` +
+
+
+
+

+ + Flashpack Information + +

+
+
+
+
diff --git a/src/services/fleetsAPI.js b/src/services/fleetsAPI.js index 29ce100..5cf8b10 100644 --- a/src/services/fleetsAPI.js +++ b/src/services/fleetsAPI.js @@ -143,6 +143,17 @@ const fleetsAPI = { }) .then(fetchRespHandler) .catch(errorHandler), + + getFlashpackVersionInfoFleet: async (name, token) => + fetch(`${API_ENDPOINT}/flashpack_version_info_fleet/${name}`, { + method: "GET", + headers: Object.assign( + { "Content-Type": "application/json" }, + getAuthHeaderOptions(token) + ), + }) + .then(fetchRespHandler) + .catch(errorHandler), }; export default fleetsAPI;