diff --git a/src/components/Cars/Status/ECUsTab.jsx b/src/components/Cars/Status/ECUsTab.jsx
index b966407..276f35a 100644
--- a/src/components/Cars/Status/ECUsTab.jsx
+++ b/src/components/Cars/Status/ECUsTab.jsx
@@ -1,13 +1,22 @@
-import { Typography } from "@material-ui/core";
+import {
+ Typography,
+ Grid,
+ FormControlLabel,
+ Checkbox,
+} from "@material-ui/core";
import clsx from "clsx";
-import React from "react";
+import React, { useState } from "react";
import { useUserContext } from "../../Contexts/UserContext";
import { VehicleProvider } from "../../Contexts/VehicleContext";
+import { useLocalStorage } from "../../useLocalStorage";
import CarECUsTable from "../../Controls/CarECUsTable";
+import SearchField from "../../Controls/SearchField";
import useStyles from "../../useStyles";
const MainForm = ({ vin }) => {
+ const [search, setSearch] = useLocalStorage("ECU_SEARCH", "");
+ const [unique, setUnique] = useState(true);
const classes = useStyles();
const {
token: {
@@ -15,12 +24,35 @@ const MainForm = ({ vin }) => {
},
} = useUserContext();
+ const handleSearch = (query) => {
+ setSearch(query);
+ };
+
+ const handleUnique = () => {
+ setUnique(unique => !unique);
+ }
+
return (
Car ECUs
-
+
+
+
+ }
+ className={classes.noWrap}
+ />
+
+
+
);
};
diff --git a/src/components/Cars/Status/__snapshots__/ECUsTab.test.jsx.snap b/src/components/Cars/Status/__snapshots__/ECUsTab.test.jsx.snap
index b37ef2e..93e63b1 100644
--- a/src/components/Cars/Status/__snapshots__/ECUsTab.test.jsx.snap
+++ b/src/components/Cars/Status/__snapshots__/ECUsTab.test.jsx.snap
@@ -16,6 +16,101 @@ exports[`ECUsTab Render 1`] = `
>
Car ECUs
+
+
+
+
+
+
@@ -264,6 +359,29 @@ exports[`ECUsTab Render 1`] = `
+
+
+ Epoch
+
+
+ |
7/14/2021 8:09:40 PM
+
+
+ |
7/14/2021 8:09:40 PM
+ |
+
+ |
{
+const CarECUsTable = ({ vin, token, classes, search, unique }) => {
const [ecus, setECUs] = useState([]);
const [total, setTotal] = useState(0);
const [pageSize, setPageSize] = useLocalStorage(PAGE_SIZE, 10);
@@ -79,6 +83,8 @@ const CarECUsTable = ({ vin, token, classes }) => {
const result = await getECUs(
{
vin,
+ search,
+ unique,
limit: pageSize,
offset: pageSize * pageIndex,
order: `${orderBy} ${order}`,
@@ -93,7 +99,7 @@ const CarECUsTable = ({ vin, token, classes }) => {
}
})();
// eslint-disable-next-line react-hooks/exhaustive-deps
- }, [vin, token, pageIndex, pageSize, orderBy, order]);
+ }, [vin, token, pageIndex, pageSize, orderBy, order, search, unique]);
const handleChangePageIndex = (event, newIndex) => {
setPageIndex(newIndex);
diff --git a/src/components/useStyles.jsx b/src/components/useStyles.jsx
index 40a9bba..7c598df 100644
--- a/src/components/useStyles.jsx
+++ b/src/components/useStyles.jsx
@@ -312,7 +312,13 @@ const useStyles = makeStyles((theme) => ({
display: "flex",
alignItems: "center",
gap: "12px",
- }
+ },
+ flex: {
+ display: "flex",
+ },
+ noWrap: {
+ whiteSpace: "nowrap",
+ },
}));
export default useStyles;