Skip to content

Commit 52ca217

Browse files
aesteriaesteri
authored
Merge pull request #58 from hytech-racing/minor-urgent-fix
fixed start/end date and route connection
2 parents 42d40e0 + be5a4dc commit 52ca217

File tree

3 files changed

+42
-109
lines changed

3 files changed

+42
-109
lines changed

‎src/components/SearchBar.tsx

Lines changed: 8 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -29,22 +29,6 @@ function SearchBarWithFilter({
2929
const { name } = e.target;
3030
const { value } = e.target;
3131

32-
const filt: SearchFilter = {
33-
notes: "",
34-
filename: "",
35-
};
36-
37-
if (name == "") {
38-
filt.notes = value;
39-
filt.filename = value;
40-
}
41-
42-
setSearchFilters((prevFilters) => ({
43-
...prevFilters,
44-
notes: filt.notes,
45-
filename: filt.filename,
46-
[name]: value,
47-
}));
4832

4933
// Update local state based on input
5034
switch (name) {
@@ -60,6 +44,9 @@ function SearchBarWithFilter({
6044
case "afterDate":
6145
setAfterDate(value);
6246
break;
47+
case "search_text":
48+
setSearchTerm(value);
49+
break;
6350
default:
6451
break;
6552
}
@@ -69,14 +56,12 @@ function SearchBarWithFilter({
6956
const handleClear = () => {
7057
setSearchTerm("");
7158
setSearchFilters({
72-
notes: "",
73-
filename: "",
59+
searchText: "",
7460
location: "",
7561
eventType: "",
7662
beforeDate: "",
7763
afterDate: "",
7864
});
79-
setSearchTerm("");
8065
setSelectedLocation("");
8166
setSelectedEventType("");
8267
setBeforeDate("");
@@ -85,7 +70,7 @@ function SearchBarWithFilter({
8570
};
8671

8772
const handleSearch = () => {
88-
setSearch((prev) => !prev);
73+
setSearch(true);
8974
};
9075

9176
return (
@@ -94,16 +79,15 @@ function SearchBarWithFilter({
9479

9580
<div className="search-filter-container">
9681
<h1>Search and Filter Data</h1>
97-
9882
{/* Search Bar */}
9983
<input
10084
type="text"
85+
name="search_text"
10186
className="search-bar"
10287
placeholder="Search by file name or notes..."
10388
value={searchTerm}
10489
onChange={(e) => {
10590
handleFilterChange(e);
106-
setSearchTerm(e.target.value);
10791
}}
10892
/>
10993

@@ -144,7 +128,7 @@ function SearchBarWithFilter({
144128
</label>
145129

146130
<label>
147-
Before Date:
131+
Start Date:
148132
<input
149133
type="date"
150134
name="beforeDate"
@@ -155,7 +139,7 @@ function SearchBarWithFilter({
155139
</label>
156140

157141
<label>
158-
After Date:
142+
End Date:
159143
<input
160144
type="date"
161145
name="afterDate"

‎src/routes/root.tsx

Lines changed: 33 additions & 83 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import SearchBar from "@/components/SearchBar";
33
import "@/css/Root.css";
44
import DataTable from "@/components/DataTable";
55
import PreviewCard from "@/components/PreviewCard";
6-
import { location } from "@/data/dataFilters";
76

87
export default function Root() {
98
const [filteredData, setFilteredData] = useState<MCAPFileInformation[]>();
@@ -14,9 +13,9 @@ export default function Root() {
1413
eventType: "",
1514
beforeDate: "",
1615
afterDate: "",
16+
searchText: "",
1717
});
1818
const [search, setSearch] = useState<boolean>(false);
19-
2019
const formatDate = (dateStr: string) => {
2120
const [year, month, day] = dateStr.split("-");
2221
if (month.length !== 2 || day.length !== 2 || year.length !== 4) {
@@ -26,109 +25,60 @@ export default function Root() {
2625
};
2726

2827
const fetchData = async (filters: SearchFilter) => {
29-
const { location, date, notes, eventType, filename } = filters;
28+
const { location, date, eventType, searchText } = filters;
3029
let { afterDate, beforeDate } = filters;
3130

3231
beforeDate = beforeDate ? formatDate(beforeDate) : undefined;
3332
afterDate = afterDate ? formatDate(afterDate) : undefined;
34-
35-
const buildParams = (additionalParams: Record<string, string> = {}) => {
36-
return {
37-
...(location ? { location } : {}),
38-
...(eventType ? { eventType } : {}),
39-
...(date ? { date } : {}),
40-
...(afterDate ? { after_date: afterDate } : {}),
41-
...(beforeDate ? { before_date: beforeDate } : {}),
42-
...additionalParams,
43-
};
33+
const params = {
34+
...(location ? { location } : {}),
35+
...(eventType ? { eventType } : {}),
36+
...(date ? { date } : {}),
37+
...(afterDate ? { after_date: afterDate } : {}),
38+
...(beforeDate ? { before_date: beforeDate } : {}),
39+
...(searchText ? { search_text: searchText } : {}),
4440
};
4541

46-
if (!notes && !filename) {
47-
const params = buildParams();
48-
const queryString = new URLSearchParams(params).toString();
49-
50-
const res = await fetch(
51-
`${import.meta.env.VITE_API_URL}/api/v2/mcaps?${queryString}`,
52-
);
53-
const data = await res.json();
54-
return data.data;
55-
}
56-
57-
const promises: Promise<Response>[] = [];
58-
59-
if (notes) {
60-
const paramsNotes = buildParams({ notes });
61-
const queryStringNotes = new URLSearchParams(paramsNotes).toString();
62-
promises.push(
63-
fetch(
64-
`${import.meta.env.VITE_API_URL}/api/v2/mcaps?${queryStringNotes}`,
65-
),
66-
);
67-
}
68-
69-
if (filename) {
70-
const paramsFilename = buildParams({ filename });
71-
const queryStringFilename = new URLSearchParams(
72-
paramsFilename,
73-
).toString();
74-
promises.push(
75-
fetch(
76-
`${import.meta.env.VITE_API_URL}/api/v2/mcaps?${queryStringFilename}`,
77-
),
78-
);
79-
}
80-
81-
const results = await Promise.all(promises);
82-
const data = await Promise.all(results.map((res) => res.json()));
83-
84-
const combinedData = data.flatMap((entry) => entry.data || []);
42+
const queryString = new URLSearchParams(params).toString();
8543

86-
const uniqueData = Array.from(
87-
new Set(combinedData.map((item) => item.id)),
88-
).map((id) => combinedData.find((item) => item.id === id));
89-
90-
return uniqueData;
44+
const res = await fetch(
45+
`${import.meta.env.VITE_API_URL}/api/v2/mcaps?${queryString}`,
46+
);
47+
48+
const data = await res.json();
49+
return data.data;
9150
};
9251

9352
const assignData = async () => {
94-
const apiData = await Promise.all(
95-
location.map(async (loc: string) => await fetchData({ location: loc })),
96-
);
97-
const validData = apiData.filter((data) => data !== null);
98-
99-
const flattenedData = validData.flat();
100-
101-
const sortedData = flattenedData.sort((a, b) => {
102-
const [monthA, dayA, yearA] = a.date.split("-");
103-
const [monthB, dayB, yearB] = b.date.split("-");
104-
const dateA = new Date(`${yearA}-${monthA}-${dayA}`);
105-
const dateB = new Date(`${yearB}-${monthB}-${dayB}`);
106-
53+
const data = await fetchData(searchFilters);
54+
console.log(data);
55+
const sortedData = data.sort((a: MCAPFileInformation, b: MCAPFileInformation) => {
56+
const dateA = new Date(a.date);
57+
const dateB = new Date(b.date);
10758
return dateB.getTime() - dateA.getTime();
10859
});
109-
11060
setFilteredData(sortedData);
11161
};
11262

11363
useEffect(() => {
11464
assignData();
11565
}, []);
11666

67+
// Two useEffects bc of the way we are handling the Search Button D:
11768
useEffect(() => {
11869
const getData = async () => {
119-
const data = await fetchData(searchFilters);
120-
// console.log(data);
121-
const sortedData = data.sort(
122-
(a: MCAPFileInformation, b: MCAPFileInformation) => {
123-
const [monthA, dayA, yearA] = a.date.split("-");
124-
const [monthB, dayB, yearB] = b.date.split("-");
125-
const dateA = new Date(`${yearA}-${monthA}-${dayA}`);
126-
const dateB = new Date(`${yearB}-${monthB}-${dayB}`);
127-
70+
if (search) { // Only fetch data when search is true
71+
const data = await fetchData(searchFilters);
72+
console.log(data);
73+
const sortedData = data.sort((a: MCAPFileInformation, b: MCAPFileInformation) => {
74+
const dateA = new Date(a.date);
75+
const dateB = new Date(b.date);
12876
return dateB.getTime() - dateA.getTime();
129-
},
130-
);
131-
setFilteredData(sortedData);
77+
});
78+
setFilteredData(sortedData);
79+
80+
setSearch(false);
81+
}
13282
};
13383
getData();
13484
}, [search]);

‎src/types/index.d.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,9 +32,8 @@ type MCAPFileInformation = {
3232

3333
type SearchFilter = {
3434
location?: string;
35-
filename?: string;
35+
searchText?: string;
3636
date?: string;
37-
notes?: string;
3837
eventType?: string;
3938
afterDate?: string;
4039
beforeDate?: string;

0 commit comments

Comments
 (0)