"use client";

import type { OrderGroup } from "@/types/api";
import {formatTomanPrice} from "@/lib/utils/priceUtils";

interface Props {
    order: OrderGroup;
}

const OrderItems = ({ order }: Props) => {
    // همه آیتم‌های همه فروشگاه‌ها رو جمع می‌کنیم
    const allItems = order.orders.flatMap((o) =>
        o.items.map((item) => ({
            ...item,
            storeName: o.store.name,
        }))
    );

    return (
        <div className="mt-5 grid grid-cols-1 gap-3 mx-8">
            <h1 className="text-lg font-bold mb-3">اقلام سفارش</h1>

            {allItems.map((item) => (
                <div key={item.uuid} className="flex items-center justify-between w-full">
                    <div className="flex flex-col gap-0.5">
                        <div className="flex gap-3 items-center">
                            <span className="font-semibold text-sm">{item.product_name_snapshot}</span>
                            <span className="text-xs font-medium text-gray-700">
                {item.quantity.toLocaleString("fa-IR")} عدد
              </span>
                        </div>
                        {order.orders.length > 1 && (
                            <span className="text-xs text-gray-500">{item.storeName}</span>
                        )}
                    </div>
                    <span className="text-sm font-bold">
            {formatTomanPrice(item.line_total)}
          </span>
                </div>
            ))}
        </div>
    );
};

export default OrderItems;