bulk action + payment

src/components/CartSummary.tsx

@@ -16,6 +16,7 @@ type CartSummaryProps = {
     confirmLabel?: string;
     onDownloadInvoice?: () => void;
     className?: string;
+    isLoading?: boolean;
 };
 
 const Row: FC<{ label: string; value: string | number; emphasize?: boolean }> = (
@@ -32,7 +33,7 @@ const Row: FC<{ label: string; value: string | number; emphasize?: boolean }> =
 };
 
 const CartSummary: FC<CartSummaryProps> = (props) => {
-    const { itemsCount, itemsPrice, discount, shippingCost, total, onConfirm, onDownloadInvoice, className, confirmHref, confirmLabel } = props;
+    const { itemsCount, itemsPrice, discount, shippingCost, total, onConfirm, onDownloadInvoice, className, confirmHref, confirmLabel, isLoading } = props;
 
     return (
         <div className={"rounded-xl sm:rounded-2xl border border-border p-4 sm:p-6 h-fit bg-[#FAFAFA] " + (className ?? "")}>
@@ -61,14 +62,15 @@ const CartSummary: FC<CartSummaryProps> = (props) => {
                 <Button
                     type="button"
                     onClick={() => !confirmHref && onConfirm?.()}
-                    className="w-full h-10 sm:h-12 rounded-lg sm:rounded-xl text-white text-sm sm:text-base"
+                    disabled={isLoading}
+                    className="w-full h-10 sm:h-12 rounded-lg sm:rounded-xl text-white text-sm sm:text-base disabled:opacity-50 disabled:cursor-not-allowed"
                 >
                     {confirmHref ? (
                         <Link href={confirmHref} className="w-full h-full flex items-center justify-center">
                             {confirmLabel ?? "تایید و تکمیل سفارش"}
                         </Link>
                     ) : (
-                        confirmLabel ?? "تایید و تکمیل سفارش"
+                        isLoading ? "در حال پردازش..." : (confirmLabel ?? "تایید و تکمیل سفارش")
                     )}
                 </Button>
             </div>