"use client";

import { useState } from "react";

export default function StoreActions({ item, businessId }) {
  const [quantity, setQuantity] = useState(1);
  const [message, setMessage] = useState("");

  const addToCart = async () => {
    const token = localStorage.getItem("meshkee_token") || localStorage.getItem("asphp_token");
    const line = {
      id: item.id,
      title: item.title,
      image: item.image,
      price: item.price,
      quantity
    };

    try {
      if (token && businessId && !item.id.startsWith("local-")) {
        await fetch("/api/cart/items", {
          method: "POST",
          headers: { "Content-Type": "application/json", Authorization: `Bearer ${token}` },
          body: JSON.stringify({ businessId, storeItemVariantId: item.id, quantity })
        });
      }
    } catch {}

    const cart = JSON.parse(localStorage.getItem("asphp_cart") || "[]");
    const existing = cart.find((cartItem) => cartItem.id === item.id);
    if (existing) existing.quantity += quantity;
    else cart.push(line);
    localStorage.setItem("asphp_cart", JSON.stringify(cart));
    window.dispatchEvent(new Event("asphp-cart-change"));
    setMessage("محصول به سبد خرید اضافه شد.");
  };

  return (
    <div className="store-actions">
      <label>
        تعداد
        <select value={quantity} onChange={(event) => setQuantity(Number(event.target.value))}>
          {[1, 2, 3, 4, 5].map((value) => <option key={value} value={value}>{value}</option>)}
        </select>
      </label>
      <button type="button" onClick={addToCart}>افزودن به سبد خرید</button>
      {message ? <span>{message}</span> : null}
    </div>
  );
}