From 489a1d7077a26df7599b880f996095b9324a8573 Mon Sep 17 00:00:00 2001
From: Tanisha Shrivas <tanishashrivas2003@gmail.com>
Date: Sat, 6 Jul 2024 14:16:39 +0530
Subject: [PATCH 1/5] Update ProductDetail.tsx

---
 src/pages/Shop/ProductDetail.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/Shop/ProductDetail.tsx b/src/pages/Shop/ProductDetail.tsx
index 35c069e..afc6d7a 100644
--- a/src/pages/Shop/ProductDetail.tsx
+++ b/src/pages/Shop/ProductDetail.tsx
@@ -182,9 +182,9 @@ function ProductDetail() {
                                         {data.desc}
                                     </p>
                                     <p className="inline-block mb-8 text-4xl font-bold text-gray-700 dark:text-gray-400 ">
-                                        <span>${data.price}</span>
+                                        <span>₹{data.price}</span>
                                         <span
-                                            className="text-base font-normal text-gray-500 line-through dark:text-gray-400 ml-2">${data.price + 89}</span>
+                                            className="text-base font-normal text-gray-500 line-through dark:text-gray-400 ml-2">₹{data.price + 89}</span>
                                     </p>
                                     <p className="text-green-600 dark:text-green-300 ">7 in stock</p>
                                 </div>

From 6d36a30d3a996c73e543322d00349be952b23d28 Mon Sep 17 00:00:00 2001
From: Tanisha Shrivas <tanishashrivas2003@gmail.com>
Date: Sat, 6 Jul 2024 15:05:50 +0530
Subject: [PATCH 2/5] Update Cart.tsx

---
 src/pages/Cart/Cart.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/Cart/Cart.tsx b/src/pages/Cart/Cart.tsx
index 63c3e9e..b06493a 100644
--- a/src/pages/Cart/Cart.tsx
+++ b/src/pages/Cart/Cart.tsx
@@ -262,7 +262,7 @@ const Cart: React.FC = () => {
                       </div>
                       <div className="hidden px-4 lg:block lg:w-2/12">
                         <p className="text-lg font-bold text-blue-500 dark:text-gray-400">
-                          ${item.price}
+                        ₹{item.price}
                         </p>
                       </div>
                       <div className="w-auto px-4 md:w-1/6 lg:w-2/12 ">
@@ -275,7 +275,7 @@ const Cart: React.FC = () => {
                       </div>
                       <div className="w-auto px-4 text-right md:w-1/6 lg:w-2/12 flex items-center justify-between">
                         <p className="text-lg font-bold text-blue-500 dark:text-gray-400">
-                          $
+                        ₹
                           {item.quantity
                             ? item.quantity * item.price
                             : item.price}
@@ -312,7 +312,7 @@ const Cart: React.FC = () => {
                       navigate("/home/shop/checkout");
                     }}
                   />
-                  <h2 className="text-xl font-bold">Total: ${calculateTotal().toFixed(2)}</h2>
+                  <h2 className="text-xl font-bold">Total: ₹{calculateTotal().toFixed(2)}</h2>
                 </div>
               )}
             </div>

From 99f4d6b9cae9717ceedf929b51dc6decc6cd1be5 Mon Sep 17 00:00:00 2001
From: Tanisha Shrivas <tanishashrivas2003@gmail.com>
Date: Sat, 6 Jul 2024 15:41:05 +0530
Subject: [PATCH 3/5] Fixed the product addition to cart

---
 src/components/Navbar.tsx        |  4 +--
 src/pages/Cart/Cart.tsx          | 40 ++++++++++++--------------
 src/pages/Shop/ProductDetail.tsx | 49 +++++++++++++++++++++-----------
 3 files changed, 53 insertions(+), 40 deletions(-)

diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index 33a8e22..fbd6fb9 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -194,14 +194,14 @@ function Navbar() {
                             {_.name}
                           </h4>
                           <p className="font-medium dark:text-gray-400">
-                            Price: ${_.price}
+                            Price: ₹{_.price}
                           </p>
                         </div>
                       </div>
                     ))}
 
                 <span className="text-mynavy mt-3">
-                  subtotal ${total}
+                  subtotal ₹{total}
                 </span>
 
                 <Link
diff --git a/src/pages/Cart/Cart.tsx b/src/pages/Cart/Cart.tsx
index b06493a..f206ac9 100644
--- a/src/pages/Cart/Cart.tsx
+++ b/src/pages/Cart/Cart.tsx
@@ -20,6 +20,7 @@ export interface ITEM {
   name: string;
   image: string;
   quantity: number;
+  size: string; 
 }
 
 const Cart: React.FC = () => {
@@ -34,7 +35,7 @@ const Cart: React.FC = () => {
     name: "DISCOUNT10",
     discount: 10,
   };
-  
+
   useEffect(() => {
     const fetchCartData = async () => {
       try {
@@ -69,7 +70,7 @@ const Cart: React.FC = () => {
     window.scrollTo(0, 0);
   }, []);
 
-  const handleRemoveItem = async (itemName: string) => {
+  const handleRemoveItem = async (itemName: string, itemSize: string) => {
     try {
       const { data, error } = await supabase
         .from("Cart")
@@ -83,7 +84,7 @@ const Cart: React.FC = () => {
 
       if (data && data.products) {
         const updatedProducts = data.products.filter(
-          (item: ITEM) => item.name !== itemName
+          (item: ITEM) => !(item.name === itemName && item.size === itemSize)
         );
 
         const { error: updateError } = await supabase
@@ -94,7 +95,7 @@ const Cart: React.FC = () => {
         if (updateError) {
           throw updateError;
         }
-        toast.success("item removed success");
+        toast.success("Item removed successfully");
         setCartItems(updatedProducts);
       }
     } catch (error) {
@@ -102,8 +103,6 @@ const Cart: React.FC = () => {
     }
   };
 
-  // quantity handle here
-
   const handleQuantityChange = async (
     itemName: string,
     newQuantity: number
@@ -160,7 +159,7 @@ const Cart: React.FC = () => {
         <div className="p-8 bg-gray-50 dark:bg-gray-800">
           <div className="flex flex-wrap -mx-4">
             <div className="w-full px-4 mb-8 xl:mb-0">
-              {cartItems.length == 0 ? (
+              {cartItems.length === 0 ? (
                 ""
               ) : (
                 <div className="flex flex-wrap items-center mb-6 -mx-4 md:mb-8">
@@ -174,12 +173,12 @@ const Cart: React.FC = () => {
                       Price
                     </h2>
                   </div>
-                  <div className="hidden md:block px-4 md:w-1/6 lg:w-2/12 ">
+                  <div className="hidden md:block px-4 md:w-1/6 lg:w-2/12">
                     <h2 className="font-bold text-gray-500 dark:text-gray-400">
                       Quantity
                     </h2>
                   </div>
-                  <div className="hidden md:block px-4 text-right md:w-1/6 lg:w-2/12 ">
+                  <div className="hidden md:block px-4 text-right md:w-1/6 lg:w-2/12">
                     <h2 className="font-bold text-gray-500 dark:text-gray-400 mr-36">
                       Subtotal
                     </h2>
@@ -210,10 +209,10 @@ const Cart: React.FC = () => {
                         <div className="hidden px-4 lg:block lg:w-2/12">
                           <Skeleton height={24} width={`50%`} />
                         </div>
-                        <div className="w-auto px-4 md:w-1/6 lg:w-2/12 ">
+                        <div className="w-auto px-4 md:w-1/6 lg:w-2/12">
                           <Skeleton height={32} width={64} />
                         </div>
-                        <div className="w-auto px-4 text-right md:w-1/6 lg:w-2/12 ">
+                        <div className="w-auto px-4 text-right md:w-1/6 lg:w-2/12">
                           <Skeleton height={24} width={`50%`} />
                         </div>
                       </div>
@@ -236,7 +235,7 @@ const Cart: React.FC = () => {
                 ) : (
                   cartItems.map((item: ITEM) => (
                     <div
-                      key={item.name}
+                      key={item.name + item.size} // Ensure unique key by combining name and size
                       className="flex flex-wrap items-center mb-6 -mx-4 md:mb-8"
                     >
                       <div className="w-full px-4 mb-6 md:w-4/6 lg:w-6/12 md:mb-0">
@@ -252,7 +251,7 @@ const Cart: React.FC = () => {
                           </div>
                           <div className="w-2/3 px-4">
                             <h2 className="mb-2 text-xl font-bold dark:text-gray-400">
-                              {item.name}
+                              {item.name} <span className="text-gray-500">({item.size})</span> {/* Display size */}
                             </h2>
                             <p className="text-gray-500 dark:text-gray-400 ">
                               {item.desc}
@@ -262,10 +261,10 @@ const Cart: React.FC = () => {
                       </div>
                       <div className="hidden px-4 lg:block lg:w-2/12">
                         <p className="text-lg font-bold text-blue-500 dark:text-gray-400">
-                        ₹{item.price}
+                          ₹{item.price}
                         </p>
                       </div>
-                      <div className="w-auto px-4 md:w-1/6 lg:w-2/12 ">
+                      <div className="w-auto px-4 md:w-1/6 lg:w-2/12">
                         <QuantityButton
                           initialQuantity={item.quantity ? item.quantity : 1}
                           onUpdate={(newQuantity) =>
@@ -275,13 +274,10 @@ const Cart: React.FC = () => {
                       </div>
                       <div className="w-auto px-4 text-right md:w-1/6 lg:w-2/12 flex items-center justify-between">
                         <p className="text-lg font-bold text-blue-500 dark:text-gray-400">
-                        ₹
-                          {item.quantity
-                            ? item.quantity * item.price
-                            : item.price}
+                          ₹{item.quantity ? item.quantity * item.price : item.price}
                         </p>
                         <button
-                          onClick={() => handleRemoveItem(item.name)}
+                          onClick={() => handleRemoveItem(item.name, item.size)} // Pass size to handleRemoveItem
                           className="text-red-600 hover:text-red-800"
                         >
                           <MdDelete size={24} />
@@ -291,14 +287,14 @@ const Cart: React.FC = () => {
                   ))
                 )}
               </div>
-              {cartItems.length == 0 ? (
+              {cartItems.length === 0 ? (
                 ""
               ) : (
                 <div className="flex flex-wrap items-center gap-4">
                   <span>Apply Coupon</span>
                   <input
                     type="text"
-                    className="flex-1 px-8 py-4 font-normal placeholder-gray-300 border dark:border-gray-700 dark:placeholder-gray-500 md:flex-none md:mr-6 dark:text-gray-400 dark:bg-gray-800 "
+                    className="flex-1 px-8 py-4 font-normal placeholder-gray-300 border dark:border-gray-700 dark:placeholder-gray-500 md:flex-none md:mr-6 dark:text-gray-400 dark:bg-gray-800"
                     placeholder="Enter coupon code"
                     value={coupon}
                     onChange={(e) => setCoupon(e.target.value)}
diff --git a/src/pages/Shop/ProductDetail.tsx b/src/pages/Shop/ProductDetail.tsx
index afc6d7a..727546a 100644
--- a/src/pages/Shop/ProductDetail.tsx
+++ b/src/pages/Shop/ProductDetail.tsx
@@ -82,7 +82,7 @@ function ProductDetail() {
         size, //Include size
     };
     const addToCart = async () => {
-        if (!size) { //added check for size
+        if (!size) { // added check for size
             toast.error('Please select a size');
             return;
         }
@@ -92,40 +92,52 @@ function ProductDetail() {
                 image: data.image,
                 price: data.price,
                 desc: data.desc,
-                quantity: data.qauntity || 1,
+                quantity: data.quantity || 1,
                 ratings: 5,
-                size, //Include size
+                size, // Include size
             };
-
+    
             // Attempt to fetch the user's cart
             const { data: userCart, error: fetchError } = await supabase
                 .from('Cart')
                 .select('*')
                 .eq('username', userName)
                 .single();
-
+    
             if (fetchError && fetchError.code !== 'PGRST116') { // Ignore "No such record" error
                 console.error("Fetch error:", fetchError);
                 throw fetchError;
             }
-
-            console.log("Product added", product);
-
+    
+            console.log("Product to be added", product);
+    
             if (userCart) {
-                // If the cart exists, update it
-                const updatedProducts = [...userCart.products, product];
-
+                // Check if the product already exists in the cart
+                const existingProductIndex = userCart.products.findIndex(
+                    (item) => item.name === product.name && item.size === product.size
+                );
+    
+                let updatedProducts;
+                if (existingProductIndex !== -1) {
+                    // If the product exists, increase its quantity
+                    updatedProducts = [...userCart.products];
+                    updatedProducts[existingProductIndex].quantity += product.quantity;
+                } else {
+                    // If the product does not exist, add it to the cart
+                    updatedProducts = [...userCart.products, product];
+                }
+    
                 const { error: updateError } = await supabase
                     .from('Cart')
                     .update({ products: updatedProducts })
                     .eq('username', userName);
-
+    
                 if (updateError) {
                     console.error("Update error:", updateError);
                     throw updateError;
                 }
-
-                console.log("Product added to cart:", product);
+    
+                console.log("Product added/updated in cart:", product);
                 dispatch(addItem({ item: product }));
                 toast.success('Product added to cart');
             } else {
@@ -138,21 +150,26 @@ function ProductDetail() {
                             products: [product],
                         },
                     ]);
-
+    
                 if (insertError) {
                     console.error("Insert error:", insertError);
                     throw insertError;
                 }
-
+    
                 console.log("Product added to cart:", product);
                 dispatch(addItem({ item: product }));
                 toast.success('Product added to cart');
             }
+    
+            // Navigate the user to the cart
+            navigate('/home/shop/cart');
         } catch (error) {
             console.error("Error adding product to cart:", error);
             toast.error('Error adding product to cart');
         }
     };
+    
+    
 
     return (
         <>

From 0c7d59bf373edb045d8c4efd09a5e4cc7876d686 Mon Sep 17 00:00:00 2001
From: Tanisha Shrivas <tanishashrivas2003@gmail.com>
Date: Mon, 8 Jul 2024 11:25:33 +0530
Subject: [PATCH 4/5] Update ProductDetail.tsx

---
 src/pages/Shop/ProductDetail.tsx | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/pages/Shop/ProductDetail.tsx b/src/pages/Shop/ProductDetail.tsx
index 727546a..0d85c0a 100644
--- a/src/pages/Shop/ProductDetail.tsx
+++ b/src/pages/Shop/ProductDetail.tsx
@@ -24,6 +24,13 @@ interface RatingItem {
     checked?: boolean;
 }
 
+interface CartItem {
+    name: string;
+    size: string;
+    quantity: number;
+  }
+  
+
 export interface UserState {
     user: {
         username: string;
@@ -92,7 +99,7 @@ function ProductDetail() {
                 image: data.image,
                 price: data.price,
                 desc: data.desc,
-                quantity: data.quantity || 1,
+                quantity: data.qauntity || 1,
                 ratings: 5,
                 size, // Include size
             };
@@ -114,8 +121,8 @@ function ProductDetail() {
             if (userCart) {
                 // Check if the product already exists in the cart
                 const existingProductIndex = userCart.products.findIndex(
-                    (item) => item.name === product.name && item.size === product.size
-                );
+                (item: CartItem) => item.name === product.name && item.size === product.size
+  );
     
                 let updatedProducts;
                 if (existingProductIndex !== -1) {

From 40d85c77c785d816390e2d49915edf1ddc02c20e Mon Sep 17 00:00:00 2001
From: Tanisha Shrivas <tanishashrivas2003@gmail.com>
Date: Tue, 9 Jul 2024 13:42:09 +0530
Subject: [PATCH 5/5] Update ProductDetail.tsx

---
 src/pages/Shop/ProductDetail.tsx | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/pages/Shop/ProductDetail.tsx b/src/pages/Shop/ProductDetail.tsx
index 0d85c0a..960af0f 100644
--- a/src/pages/Shop/ProductDetail.tsx
+++ b/src/pages/Shop/ProductDetail.tsx
@@ -167,9 +167,6 @@ function ProductDetail() {
                 dispatch(addItem({ item: product }));
                 toast.success('Product added to cart');
             }
-    
-            // Navigate the user to the cart
-            navigate('/home/shop/cart');
         } catch (error) {
             console.error("Error adding product to cart:", error);
             toast.error('Error adding product to cart');