Merge pull request dvjsharma#10 from Akashsah2003/master

Payment

client/package.json

@@ -17,6 +17,7 @@
     "react-burger-menu": "^3.0.9",
     "react-dom": "^18.2.0",
     "react-hot-toast": "^2.4.1",
+    "react-razorpay": "^2.0.1",
     "react-redux": "^8.1.2",
     "react-router-dom": "^6.16.0"
   },

client/src/pages/Cart/index.jsx

@@ -1,9 +1,49 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useCallback } from "react";
 import axios from "axios";
 import Cartcard from "../../components/Cart-Card";
+import useRazorpay from "react-razorpay";
 
 const Cart = () => {
     const [cartitems, setCartitems] = useState();
+    const [subtotal, setSubtotal] = useState(0);
+    const [Razorpay, isLoaded] = useRazorpay();
+
+    const handlePayment = useCallback(() => {
+
+        const options = {
+          key: "rzp_test_NuTUG6yrfovjY3",
+          amount: `${subtotal+110}00`,
+          currency: "INR",
+          name: "Acme Corp",
+          description: "Test Transaction",
+          image: "https://example.com/your_logo",
+          handler: (res) => {
+            console.log(res);
+          },
+          prefill: {
+            name: "Piyush Garg",
+            email: "[email protected]",
+            contact: "9999999999",
+          },
+          notes: {
+            address: "Razorpay Corporate Office",
+          },
+          theme: {
+            color: "#3399cc",
+          },
+        };
+
+        const rzpay = new Razorpay(options);
+        rzpay.open();
+      }, [subtotal]);
+
+      useEffect(() => {
+        if (isLoaded) {
+          handlePayment();
+        }
+      }, [isLoaded, handlePayment])
+
+
     let toDisplay = [];
     useEffect(() => {
         const fetchcart = async () => {
@@ -24,6 +64,18 @@ const Cart = () => {
         fetchcart();
     }, [])
 
+    if (cartitems) {
+        let ntotal = 0;
+        for (let index = 0; index < cartitems.length; index++) {
+
+            ntotal = ntotal + parseInt(cartitems[index].price);
+        }
+        if (subtotal != ntotal)
+        {
+            setSubtotal(ntotal);
+        }
+    }
+
     useEffect(() => {
         if (cartitems)
         {
@@ -153,25 +205,25 @@ const Cart = () => {
                     <div className="mt-6 h-full rounded-lg border bg-white p-6 shadow-md md:mt-0 md:w-1/3">
                         <div className="mb-2 flex justify-between">
                             <p className="text-gray-700">Subtotal</p>
-                            <p className="text-gray-700">$129.99</p>
+                            <p className="text-gray-700">₹ {subtotal}</p>
                         </div>
                         <div className="flex justify-between">
                             <p className="text-gray-700">Shipping</p>
-                            <p className="text-gray-700">$4.99</p>
+                            <p className="text-gray-700">₹ 110</p>
                         </div>
                         <hr className="my-4" />
                         <div className="flex justify-between">
                             <p className="text-lg font-bold">Total</p>
                             <div className="">
                                 <p className="mb-1 text-lg font-bold">
-                                    $134.98 USD
+                                    ₹ {subtotal + 110} INR
                                 </p>
                                 <p className="text-sm text-gray-700">
                                     including VAT
                                 </p>
                             </div>
                         </div>
-                        <button className="mt-6 w-full rounded-md bg-blue-500 py-1.5 font-medium text-blue-50 hover:bg-blue-600">
+                        <button className="mt-6 w-full rounded-md bg-blue-500 py-1.5 font-medium text-blue-50 hover:bg-blue-600" onClick={handlePayment}>
                             Check out
                         </button>
                     </div>

client/src/pages/Product/index.jsx

@@ -25,11 +25,8 @@ const Product = () => {
         // console.log(data)
         try {
             const { data } = await axios.post(
-                "http://localhost:3000/api/users/cart/add",
+                "http://localhost:3000/api/cart/add",
                 {
-                    shoeImage,
-                    shoeName,
-                    brand,
                     pId,
                     price,
                     size: formData,

server/controllers/cart.js

@@ -12,5 +12,19 @@ const getcart = (req, res) => {
     });
 }
 
+const addcart=(req, res) => {
+    const {pId, price, size} = req.body;
+    con.query(`INSERT INTO cart VALUES (${pId}, '${req.user["email"]}', ${size}, 1)`, (err, result) => {
+        if (err)
+        {
+            throw err;
+        }
+        return res.status(200).json({
+            success: true,
+            message: "Added to cart"
+        })
+    });
+}
+
 
-export {getcart};
+export {getcart, addcart};

server/routes/cart.js

@@ -1,11 +1,13 @@
 import express from "express";
-import { getcart } from "../controllers/cart.js";
+import { getcart, addcart } from "../controllers/cart.js";
 import { isAuthenticated } from "../middlewares/auth.js";
 
 const router = express.Router();
 
 
 router.get('/', isAuthenticated, getcart);
 
+router.post('/add', isAuthenticated, addcart);
+
 
 export default router;