diff --git a/src/components/cart/Cart.jsx b/src/components/cart/Cart.jsx index 5a92488..3a15e51 100644 --- a/src/components/cart/Cart.jsx +++ b/src/components/cart/Cart.jsx @@ -1,12 +1,12 @@ import React from 'react'; -import { useCartData } from '../../contexts/CartDataContext.jsx'; import CartItem from './CartItem.jsx'; import PlaceOrderWindow from './PlaceOrderWindow.jsx'; +import { useCartItems } from '../../hooks/useStoreItems.js'; export default function Cart() { - // Getting cartItems from CartData context - const { cartItems } = useCartData(); + // Getting cartItems from store. + const cartItems = useCartItems(); return (
diff --git a/src/components/cart/CartItem.jsx b/src/components/cart/CartItem.jsx index d112c52..e2a410c 100644 --- a/src/components/cart/CartItem.jsx +++ b/src/components/cart/CartItem.jsx @@ -1,15 +1,19 @@ import React, { useEffect } from 'react'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { useCartData } from '../../contexts/CartDataContext.jsx'; -import { useWishlistData } from '../../contexts/WishlistDataContext.jsx'; +import useWishlistActions from '../../hooks/wishlistReducerHooks.js'; +import { useIsItemInWishlist } from '../../hooks/useStoreItems.js'; +import useCartActions from '../../hooks/cartReducerHooks.js'; export default function CartItem({ item }) { - // Getting functions from CartData context. - const { removeItemFromCart, incrementItemCount, decrementItemCount } = useCartData(); + // Getting functions to manage cart. + const { removeItemFromCart, incrementItemCount, decrementItemCount } = useCartActions(); - // Getting functions from WishlistData context. - const { addItemToWishlist, removeItemFromWishlist, isItemInWishlist } = useWishlistData(); + // Getting functions to manage wishlist. + const { addItemToWishlist, removeItemFromWishlist } = useWishlistActions(); + + // Function to know whether item is already in wishlist. + const isItemInWishlist = useIsItemInWishlist(); // Getting item details. const { image: itemImage, name: itemName, originalPrice: itemPrice, discountPercentage, count: itemQuantity } = item; @@ -96,4 +100,4 @@ export default function CartItem({ item }) {
); -} +}; diff --git a/src/components/cart/PlaceOrderWindow.jsx b/src/components/cart/PlaceOrderWindow.jsx index 889a18a..d5cc4ab 100644 --- a/src/components/cart/PlaceOrderWindow.jsx +++ b/src/components/cart/PlaceOrderWindow.jsx @@ -1,10 +1,10 @@ import React, { useEffect, useState } from 'react'; -import { useCartData } from '../../contexts/CartDataContext.jsx'; +import { useCartItems } from '../../hooks/useStoreItems.js'; export default function PlaceOrderWindow() { - // Getting cart items from CartData context. - const { cartItems } = useCartData(); + // Getting cart items from store. + const cartItems = useCartItems(); // State for total price. const [totalPrice, setTotalPrice] = useState(0); diff --git a/src/components/products/ProductCard.jsx b/src/components/products/ProductCard.jsx index 4f7bde1..202727b 100644 --- a/src/components/products/ProductCard.jsx +++ b/src/components/products/ProductCard.jsx @@ -2,16 +2,23 @@ import React, { useState } from 'react'; import PropTypes from 'prop-types'; import { Link } from 'react-router-dom'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { useCartData } from '../../contexts/CartDataContext.jsx'; -import { useWishlistData } from '../../contexts/WishlistDataContext.jsx'; +import useCartActions from '../../hooks/cartReducerHooks.js'; +import { useIsItemInCart, useIsItemInWishlist } from '../../hooks/useStoreItems.js'; +import useWishlistActions from '../../hooks/wishlistReducerHooks.js'; export default function ProductCard({ productDetails }) { - // Getting required functions from CartData context. - const { addItemToCart, removeItemFromCart, isItemInCart } = useCartData(); + // Getting functions to add and remove items form cart. + const { addItemToCart, removeItemFromCart } = useCartActions(); - // Getting required functions from WishlistDataContext. - const { addItemToWishlist, removeItemFromWishlist, isItemInWishlist } = useWishlistData(); + // Getting functions to add and remove items from wishlist. + const { addItemToWishlist, removeItemFromWishlist } = useWishlistActions(); + + // Function to check whether item is already in cart or not. + const isItemInCart = useIsItemInCart(); + + // Function to check whether item is already in wishlist or not. + const isItemInWishlist = useIsItemInWishlist(); // Getting product details. const productImg = productDetails['image']; diff --git a/src/components/products/ProductDetail.jsx b/src/components/products/ProductDetail.jsx index 9c7e0ec..4d4b9ca 100644 --- a/src/components/products/ProductDetail.jsx +++ b/src/components/products/ProductDetail.jsx @@ -1,8 +1,9 @@ import React, { useEffect, useState } from 'react'; import { useProductData } from '../../contexts/ProductDataContext'; import { useParams } from 'react-router-dom'; -import { useCartData } from '../../contexts/CartDataContext.jsx'; -import { useWishlistData } from '../../contexts/WishlistDataContext.jsx'; +import useCartActions from '../../hooks/cartReducerHooks.js'; +import useWishlistActions from '../../hooks/wishlistReducerHooks.js'; +import { useIsItemInCart, useIsItemInWishlist } from '../../hooks/useStoreItems.js'; import Loader from '../Loader.jsx'; import Rating from './Rating.jsx'; @@ -14,11 +15,17 @@ export default function ProductDetail() { // Getting product name from URL. const { productname } = useParams(); - // Getting required functions from CartData context. - const { addItemToCart, removeItemFromCart, isItemInCart } = useCartData(); + // Getting functions to manage cart state. + const { addItemToCart, removeItemFromCart } = useCartActions(); - // Getting required functions from WishlistDataContext. - const { addItemToWishlist, removeItemFromWishlist, isItemInWishlist } = useWishlistData(); + // Getting functions to manage wishlist state. + const { addItemToWishlist, removeItemFromWishlist } = useWishlistActions(); + + // Function to check whether the item is already in cart or not. + const isItemInCart = useIsItemInCart(); + + // Function to check whether the item is already in wishlist or not. + const isItemInWishlist = useIsItemInWishlist(); // State for product whose details have to be shown. const [productDetails, setProductDetails] = useState(null); diff --git a/src/components/wishlist/Wishlist.jsx b/src/components/wishlist/Wishlist.jsx index e6794fe..0573a43 100644 --- a/src/components/wishlist/Wishlist.jsx +++ b/src/components/wishlist/Wishlist.jsx @@ -1,11 +1,11 @@ import React from 'react'; -import WishlistItem from './WishlistItem'; -import { useWishlistData } from '../../contexts/WishlistDataContext.jsx'; +import WishlistItem from './WishlistItem.jsx'; +import { useWishlistItems } from '../../hooks/useStoreItems.js'; export default function Wishlist() { - // Getting wishlist items from WishlistData context. - const { wishlistItems } = useWishlistData(); + // Getting wishlist items from state. + const wishlistItems = useWishlistItems(); return (
diff --git a/src/components/wishlist/WishlistItem.jsx b/src/components/wishlist/WishlistItem.jsx index 4015d4b..341e213 100644 --- a/src/components/wishlist/WishlistItem.jsx +++ b/src/components/wishlist/WishlistItem.jsx @@ -1,17 +1,19 @@ import React from 'react'; import PropTypes from 'prop-types'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { useWishlistData } from '../../contexts/WishlistDataContext.jsx'; import { Link } from 'react-router-dom'; -import { useCartData } from '../../contexts/CartDataContext.jsx'; +import useWishlistActions from '../../hooks/wishlistReducerHooks.js'; +import useCartActions from '../../hooks/cartReducerHooks.js'; +import { useIsItemInCart } from '../../hooks/useStoreItems.js'; export default function WishlistItem({ item }) { - // Getting functions from WishlistData context. - const { removeItemFromWishlist, moveToCart } = useWishlistData(); + // Getting functions to manage cart and wishlist. + const { addItemToCart } = useCartActions(); + const { removeItemFromWishlist } = useWishlistActions(); - // Getting functions from CartData context. - const { isItemInCart } = useCartData(); + // Function to check whether item is already in cart or not. + const isItemInCart = useIsItemInCart(); // Getting item details. const itemImage = item['image']; @@ -82,7 +84,7 @@ export default function WishlistItem({ item }) { ) : (