From 5ad5b73b59344861dfdc4f30772f2f6fce08bcf8 Mon Sep 17 00:00:00 2001
From: Square <aayushk4980@gmail.com>
Date: Fri, 2 Aug 2024 16:26:09 +0530
Subject: [PATCH] Used custom hook to dispatch action to fetch products data

---
 src/components/products/ProductDetail.jsx |  4 ++++
 src/components/products/Products.jsx      | 14 +++++---------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/products/ProductDetail.jsx b/src/components/products/ProductDetail.jsx
index 794b607..b0a0b46 100644
--- a/src/components/products/ProductDetail.jsx
+++ b/src/components/products/ProductDetail.jsx
@@ -3,11 +3,15 @@ import { useParams } from 'react-router-dom';
 import useCartActions from '../../hooks/cartReducerHooks.js';
 import useWishlistActions from '../../hooks/wishlistReducerHooks.js';
 import { useIsItemInCart, useIsItemInWishlist, useProducts } from '../../hooks/useStoreItems.js';
+import useGetProducts from '../../hooks/useGetProducts.js';
 import Loader from '../Loader.jsx';
 import Rating from './Rating.jsx';
 
 export default function ProductDetail() {
 
+    // Getting products in store if not exists.
+    useGetProducts();
+
     // Getting product data from store.
     const productData = useProducts();
 
diff --git a/src/components/products/Products.jsx b/src/components/products/Products.jsx
index 52d5247..171b15a 100644
--- a/src/components/products/Products.jsx
+++ b/src/components/products/Products.jsx
@@ -1,15 +1,16 @@
 import React, { useEffect, useState } from 'react';
 import ProductCard from './ProductCard.jsx';
 import { useParams } from 'react-router-dom';
-import { useDispatch, useSelector } from 'react-redux';
-import { getProducts } from '../../features/product/productSlice.js';
+import { useSelector } from 'react-redux';
+import StatusCode from '../../utils/StatusCode.js';
+import useGetProducts from '../../hooks/useGetProducts.js';
 import FilterSection from './FilterSection.jsx';
 import Loader from '../Loader.jsx';
-import StatusCode from '../../utils/StatusCode.js';
 
 export default function Products() {
 
-    const dispatch = useDispatch();
+    // Getting products in store.
+    useGetProducts();
 
     // Getting product data and status from store.
     const { value: productData, status } = useSelector(state => state.product);
@@ -25,11 +26,6 @@ export default function Products() {
         'Wired', 'Noise Cancelling', 'Wireless', 'Speaker'
     ]);
 
-    // Dispatching action to get products.
-    useEffect(() => {
-        dispatch(getProducts());
-    }, []);
-
     useEffect(() => {
         if (filterCriteria.length <= 0) {
             setFilterCriteria(['Wired', 'Noise Cancelling', 'Wireless', 'Speaker']);