basic search (to be changed)

This commit is contained in:
Victor Turgeon
2022-10-29 14:17:59 -07:00
parent 9707ae8d12
commit 840178147a
2 changed files with 72 additions and 47 deletions

View File

@@ -4,26 +4,37 @@ import ItemList from "../components/ItemList";
import { useState } from 'react';
import Sorting from "../components/Sorting"
import Filters from '../components/Filters';
import { useLocation } from 'react-router-dom';
const Morceaux = (startingProducts) => {
const Morceaux = () => {
const [products, setProducts] = useState([]);
const [isLoading, setIsLoading] = useState(false);
const [isLoading, setIsLoading] = useState(true);
const [order, setOrder] = useState("");
const [filterPrice, setFilterPrice] = useState("");
const [filterState, setFilterState] = useState("");
const [isSearch, setIsSearch] = useState(false);
const { state } = useLocation();
useEffect(() => {
document.title = 'Morceaux';
setIsLoading(true);
async function fetchData() {
const response = await fetch(`https://localhost:7292/api/Inventory`);
const json = await response.json();
if (json.length > 0)
setProducts([...json]);
if (state != null) {
setProducts([...state.searchResults.json]);
setIsSearch(true);
}
fetchData();
else {
async function fetchData() {
const response = await fetch(`https://localhost:7292/api/Inventory`);
const json = await response.json();
if (json.length > 0)
setProducts([...json]);
}
fetchData();
}
setIsLoading(false);
}, []);
@@ -49,25 +60,37 @@ const Morceaux = (startingProducts) => {
const handleOrder = async (sortBy) => {
setOrder(sortBy);
var url = `https://localhost:7292/api/Inventory?order=${sortBy}&filterPrice=${filterPrice}&filterState=${filterState}`;
setIsLoading(true);
const response = await fetch(url);
const json = await response.json();
if (json.length > 0)
setProducts([...json]);
setIsLoading(false);
if (isSearch) {
}
else {
setOrder(sortBy);
var url = `https://localhost:7292/api/Inventory?order=${sortBy}&filterPrice=${filterPrice}&filterState=${filterState}`;
setIsLoading(true);
const response = await fetch(url);
const json = await response.json();
if (json.length > 0)
setProducts([...json]);
setIsLoading(false);
}
}
const handleFilters = async (price, state) => {
setFilterPrice(price);
setFilterState(state);
var url = `https://localhost:7292/api/Inventory?order=${order}&filterPrice=${price}&filterState=${state}`;
setIsLoading(true);
const response = await fetch(url);
const json = await response.json();
setProducts([...json]);
setIsLoading(false);
if (isSearch) {
}
{
setFilterPrice(price);
setFilterState(state);
var url = `https://localhost:7292/api/Inventory?order=${order}&filterPrice=${price}&filterState=${state}`;
setIsLoading(true);
const response = await fetch(url);
const json = await response.json();
setProducts([...json]);
setIsLoading(false);
}
}
return (
@@ -86,9 +109,9 @@ const Morceaux = (startingProducts) => {
<div className={isLoading ? "cat-load" : "d-none cat-load"} />
<script type="text/javascript" async src="https://tenor.com/embed.js"></script>
<div>
<Button onClick={handleNextItems} className='btn-load-more'>
{!isSearch && <Button onClick={handleNextItems} className='btn-load-more'>
...
</Button>
</Button>}
</div>
</div>
);