import { Box } from '@mui/system';
import Head from 'next/head';
import { useState } from 'react';
import FilterSort from '../../components/filter-sort/FilterSort';
import LoadingSpinner from '../../components/loader/basic-spinner/LoadSpinner';
import ProductsGrid from '../../components/products-grid/ProductsGrid';
import ProductsHero from '../../components/products-hero/ProductsHero';
import { useInfiniteProducts } from '../../hooks/useInfiniteQuery';
const Products = () => {
const [filter, setFilter] = useState('');
const [sort, setSort] = useState('');
const { data, isLoading, fetchNextPage, hasNextPage } = useInfiniteProducts(
filter,
sort
);
const handleProductTypeChange = (event) => {
const filterText = event.target.value;
setFilter(filterText);
};
const handleSortChange = (event) => {
const sort = event.target.value;
setSort(sort);
};
if (isLoading) {
return ;
}
return (
NextJS template
);
};
export default Products;