Auth Modal / All Cart API's Done and Local storage Logic handle / Add cart Control button

components/productcard.tsx

@@ -1,69 +1,45 @@
 'use client';
 
-import { Phone, Plus, ShoppingCart, Minus, Trash2 } from "lucide-react";
+import { Phone } from "lucide-react";
 import Image from "next/image";
 import Link from 'next/link';
 import { useCart } from "./context/cartcontext";
 import { Product } from "@/public/src/types/product";
-import { addToCartApi } from "@/public/src/services/cart/api";
+import CartControls from "./CartControls";
 
 interface ProductCardProps {
     product: Product;
 }
 
 export default function ProductCard({ product }: ProductCardProps) {
-    const { addToCart, decreaseQuantity, cart } = useCart();
+    // دریافت استیت‌های لوکال و سرور از کانتکست
+    const { cart, serverCartItems, isLoggedIn } = useCart();
 
-    const cartItem = cart.find(item => item.id === product.id);
-    const quantity = cartItem ? cartItem.quantity : 0;
     const slug = product.slug;
+    
+    // منطق یافتن شناسه ردیف سبد خرید و تعداد بر اساس وضعیت لاگین
+    let cartItemId = null;
+    let quantity = 0;
 
-    const handleIncrease = async (e: React.MouseEvent) => {
-        e.preventDefault();
-        e.stopPropagation();
-
-        // ۱. آپدیت آنی سبد خرید محلی (این کار باعث آپدیت درجا در UI می‌شود)
-        addToCart(product);
-
-        // ۲. ارسال درخواست به سرور در پس‌زمینه
-        const token = localStorage.getItem('accessToken');
-        if (token) {
-            try {
-                await addToCartApi(product.id, 1);
-                // ارسال سیگنال به هدر (منو) برای دریافت اطلاعات جدید سرور بدون رفرش
-                window.dispatchEvent(new Event('cartUpdated'));
-            } catch (error) {
-                console.error("خطا در افزودن محصول به سبد خرید سرور:", error);
-            }
+    if (isLoggedIn && serverCartItems) {
+        // اگر لاگین بود، از سبد خرید سرور می‌خوانیم
+        const serverItem = serverCartItems.find((item) => item.product?.id === product.id);
+        if (serverItem) {
+            cartItemId = serverItem.id;
+            quantity = serverItem.quantity;
         }
-    };
-
-    // --- هندلر کاهش / حذف از سبد خرید ---
-    const handleDecrease = async (e: React.MouseEvent) => {
-        e.preventDefault();
-        e.stopPropagation();
-
-        decreaseQuantity(product.id);
-
-        const token = localStorage.getItem('accessToken');
-        if (token) {
-            try {
-                // فرض بر این است که API مربوط به کاهش را در اینجا فراخوانی می‌کنید
-                // await decreaseFromCartApi(product.id);
-                
-                // پس از موفقیت‌آمیز بودن حذف/کاهش از سرور، دوباره سیگنال می‌دهیم
-                window.dispatchEvent(new Event('cartUpdated'));
-            } catch (error) {
-                console.error("خطا در کاهش محصول از سبد خرید سرور:", error);
-            }
+    } else {
+        // اگر مهمان بود، از لوکال استوریج می‌خوانیم
+        const localItem = cart.find(item => item.id === product.id);
+        if (localItem) {
+            quantity = localItem.quantity;
         }
-    };
+    }
 
     const formattedPrice = product.price
         ? Number(product.price.toString().replace(/,/g, '')).toLocaleString('fa-IR')
         : null;
 
-
     return (
         <Link href={`/product/${slug}`} scroll={true} className="bg-white gap-1 flex flex-col justify-between border border-gray-200 rounded-xl shadow-sm p-4 transition-all hover:shadow-md">
 
@@ -107,41 +83,12 @@ export default function ProductCard({ product }: ProductCardProps) {
                     </span>
 
                     {product.stock ? (
-                        quantity > 0 ? (
-                            <div
-                                className="flex items-center gap-3 bg-white border border-gray-200 rounded-lg py-1 px-2 shadow-sm"
-                                onClick={(e) => {
-                                    e.preventDefault();
-                                    e.stopPropagation();
-                                }}
-                            >
-                                <button
-                                    onClick={handleIncrease}
-                                    className="text-gray-500 hover:text-green-600 transition-colors"
-                                >
-                                    <Plus size={16} />
-                                </button>
-
-                                <span className="text-xs font-bold text-gray-800 w-3 text-center">
-                                    {quantity}
-                                </span>
-
-                                <button
-                                    onClick={handleDecrease}
-                                    className="text-gray-500 hover:text-red-500 transition-colors"
-                                >
-                                    {quantity === 1 ? <Trash2 size={16} /> : <Minus size={16} />}
-                                </button>
-                            </div>
-                        ) : (
-                            <button
-                                onClick={handleIncrease}
-                                className="rounded-lg border border-[#e6e6e6] bg-gray-50 flex items-center p-2 text-gray-600 hover:bg-gray-200 transition-colors"
-                                title="افزودن به سبد خرید"
-                            >
-                                <ShoppingCart size={16} />
-                            </button>
-                        )
+                        // استفاده از کامپوننت CartControls دقیقا با همان UI قبلی
+                        <CartControls 
+                            product={product}
+                            cartItemId={cartItemId}
+                            quantity={quantity}
+                        />
                     ) : (
                         <span className="text-[10px] text-red-500 font-medium bg-red-50 px-2 py-1 rounded-md">
                             عدم موجودی