diff --git a/src/Utils/index.jsx b/src/Utils/index.jsx
index 19704fb..25ebeee 100644
--- a/src/Utils/index.jsx
+++ b/src/Utils/index.jsx
@@ -1,15 +1,15 @@
export const priceFilter = (cost) => {
return (product) => {
switch (cost) {
- case 1:
+ case "1":
return product.cost <= 200;
- case 2:
+ case "2":
return product.cost > 200 && product.cost <= 500;
- case 3:
+ case "3":
return product.cost > 500 && product.cost <= 1000;
- case 4:
+ case "4":
return product.cost > 1001 && product.cost <= 2000;
- case 5:
+ case "5":
return product.cost > 2000;
default:
return product;
diff --git a/src/components/Modals/modal.scss b/src/components/Modals/modal.scss
index 7bc9468..d4f8e69 100644
--- a/src/components/Modals/modal.scss
+++ b/src/components/Modals/modal.scss
@@ -44,7 +44,7 @@
background: #43a764;
}
.coins-header {
- background: #c7aa0a;
+ background: #e0ca49;
}
.modal-close-button {
@@ -85,10 +85,11 @@ button {
.coins {
cursor: pointer;
- font-size: 20px;
+ font-size: 30px;
margin-top: 10px;
+ background-color: transparent;
outline: none;
- color: #c7aa0a;
+ color: #e0ca49;
}
.gif {
diff --git a/src/components/Products/ProductsList.jsx b/src/components/Products/ProductsList.jsx
index 2301457..752c1b0 100644
--- a/src/components/Products/ProductsList.jsx
+++ b/src/components/Products/ProductsList.jsx
@@ -11,28 +11,21 @@ const ITEMS_PER_PAGE = 16;
const ProductsList = () => {
const { products, setProductResponse } = useContext(ProductsContext);
+ const [filteredProducts, setProducts] = useState([]);
+
useEffect(() => {
if (!products) return;
+ setProducts(products);
}, [products]);
- const [filteredProducts, setProducts] = useState(products);
-
- const { next, prev, currentData, currentAmount } = usePagination(
+ const { next, prev, currentData, currentAmount, jump } = usePagination(
filteredProducts,
ITEMS_PER_PAGE
);
- const onPrev = () => {
- prev();
- window.scrollTo(0, 0);
- };
- const onNext = () => {
- next();
- window.scrollTo(0, 0);
- };
-
const handleFilter = (event) => {
setProducts(products.filter(priceFilter(event.target.value)));
+ jump(1);
};
if (filteredProducts.length) {
@@ -40,7 +33,7 @@ const ProductsList = () => {
<>