CEC-1256/CEC-1330 data logger for vehicles/fleets and details tabs for vehicles/fleets (#136)

* forms for fleet can filters

* unit tests for fleet filters

* removing warnings

* updating regex

* added fleet details page

* fleet pages

* smoothed out bugs

* fleets done

* working update, delete vehicles

* finished mocks, still need snapshots and context tests

* contexts done

* snapshot tests

* updating code smells

* smells

src/components/Cars/Status/index.jsx

@@ -4,6 +4,7 @@ import { useLocation } from "react-router-dom";
 import clsx from "clsx";
 import { Box, Tab, Tabs } from "@material-ui/core";
 
+import CarDetailsTab from "./DetailsTab";
 import CarUpdatesTab from "./CarUpdatesTab";
 import CANFiltersTab from "./CANFiltersTab";
 import TabPanel from "../../Controls/TabPanel";
@@ -11,6 +12,7 @@ import { useStatusContext } from "../../Contexts/StatusContext";
 import useStyles from "../../useStyles";
 
 const tabHashes = [
+  "details",
   "updates",
   "filters"
 ]
@@ -43,7 +45,7 @@ const CarStatus = () => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [vin]);
 
-  const handleTabChange = (event, newIndex) => {
+  const handleTabChange = (_event, newIndex) => {
     setTabIndex(newIndex);
   };
 
@@ -51,16 +53,21 @@ const CarStatus = () => {
     <div className={clsx(classes.paper, classes.tableSize)}>
       <Box className={classes.tableToolbar} sx={{ borderBottom: 1, borderColor: 'divider' }}>
         <Tabs value={tabIndex} onChange={handleTabChange} aria-label="car tabs" indicatorColor="secondary">
-          <Tab label="Car Updates" {...tabProps(0)} />
-          <Tab label="CAN Filters" {...tabProps(1)} />
+          <Tab label="Details" {...tabProps(0)} />
+          <Tab label="Car Updates" {...tabProps(1)} />
+          <Tab label="CAN Filters" {...tabProps(2)} />
         </Tabs>
       </Box>
 
       <TabPanel value={tabIndex} index={0}>
-        <CarUpdatesTab />
+        <CarDetailsTab />
       </TabPanel>
 
       <TabPanel value={tabIndex} index={1}>
+        <CarUpdatesTab />
+      </TabPanel>
+
+      <TabPanel value={tabIndex} index={2}>
         <CANFiltersTab />
       </TabPanel>
     </div >