How do I add here handleDecrease,handleIncrease and handleDelete to change the product.quantity amount

22 Views Asked by At
import RemoveIcon from '@mui/icons-material/Remove';
import AddIcon from '@mui/icons-material/Add';
import { useSelector } from "react-redux";
import styled from "styled-components";
import { useEffect, useState } from "react";
import { userRequest } from "../requestMethods";
import { useHistory } from "react-router";
import React from "react";
import { useDispatch } from 'react-redux';
import DeleteOutlineOutlinedIcon from '@mui/icons-material/DeleteOutlineOutlined';


const Cart = () => {
  const cart = useSelector((state) => state.cart);
  const history = useHistory();
  const [product, setProduct] = useState({});
  const [quantity, setQuantity] = useState(1);
  const dispatch = useDispatch();

  useEffect(() => {
    const makeRequest = async () => {
      try {
        const res = await userRequest.post("/checkout/payment", {
          amount: cart.total * 100,
       });
        history.push("/success", {
          products: cart,
        });
      } catch { }
    };
    cart.total >= 1 && makeRequest();
    if (cart.total < 1) {

    }
  }, [cart.total, history]);
  const handleQuantity = (type) => {
    if (type === "dec") {
      quantity > 1 && setQuantity(quantity - 1);
    } else {
      setQuantity(quantity + 1);
    }
  };

  return (
            {cart.products.map((product) => (
              <Product>
                <PriceDetail>
                  <ProductAmountContainer>
                    <AddIcon onClick={() => handleQuantity("inc")} />
                    <ProductAmount>{product.quantity}</ProductAmount>
                    <RemoveIcon onClick={() => handleQuantity("dec")} />
                    <DeleteOutlineOutlinedIcon style={{ marginLeft: "10px" }} />
                  </ProductAmountContainer>
                  <ProductPrice>
                    $ {product.price * product.quantity}
                  </ProductPrice>
                </PriceDetail>
              </Product>
            ))}
export default Cart;

I need to add:

handleIncrease,

handleDecrease,

handleDelete. Or just i should somehow change handleQuantity function

But i don't inderstand how to do this. Because my quantity goes from product, so if i'm trying to change it, I am just changing all itemses amount.

0

There are 0 best solutions below