{{-- $shareUrl is null on the shared copy, which is read-only. --}}
@php($isOwner = $shareUrl !== null)

<x-storefront.shop-page title="Wishlist" hero="Wishlist">
    @if ($items->isEmpty())
        <div class="sm-empty-card">
            <i class="bi bi-heart sm-empty-icon" aria-hidden="true"></i>
            <p class="mt-3">{{ $isOwner ? 'Your wishlist is empty. Tap Add to Wishlist on any product to save it here.' : 'This wishlist is empty.' }}</p>
            <a class="btn sm-btn-primary rounded-pill" href="{{ route('storefront.home') }}">Continue Shopping</a>
        </div>
    @else
        <table class="sm-shop-table sm-wishlist-table">
            <thead>
                <tr>
                    @if ($isOwner)
                        <th scope="col"><span class="visually-hidden">Remove</span></th>
                    @endif
                    <th scope="col">Product</th><th scope="col">Price</th><th scope="col">Date Added</th><th scope="col">Stock Status</th><th scope="col"><span class="visually-hidden">Add to cart</span></th>
                </tr>
            </thead>
            <tbody>
                @foreach ($items as $item)
                    @php($product = $item->product)
                    @php($productUrl = route('storefront.product.show', $product->slug))
                    <tr>
                        @if ($isOwner)
                            <td class="sm-shop-remove">
                                <form method="POST" action="{{ route('storefront.wishlist.destroy', $product->id) }}">
                                    @csrf
                                    @method('DELETE')
                                    <button class="sm-icon-button" type="submit" aria-label="Remove {{ $product->name }} from wishlist"><i class="bi bi-x-lg" aria-hidden="true"></i></button>
                                </form>
                            </td>
                        @endif
                        <td class="sm-shop-product">
                            <div class="sm-shop-item"><span class="sm-shop-thumb"><i class="bi {{ $product->category?->icon_class ?? 'bi-box-seam' }}" aria-hidden="true"></i></span>
                            <span>
                                <a href="{{ $productUrl }}">{{ $product->name }}</a>
                                @if ($product->category)
                                    <span class="sm-shop-sub">Category : {{ $product->category->name }}</span>
                                @endif
                            </span></div>
                        </td>
                        <td data-label="Price">৳ {{ number_format($product->current_price, 2) }}</td>
                        <td data-label="Date Added">{{ $item->created_at->format('j F Y') }}</td>
                        <td data-label="Stock Status">
                            <span @class(['sm-stock', 'sm-stock-in' => $product->is_available, 'sm-stock-out' => ! $product->is_available])>{{ $product->is_available ? 'In stock' : 'Out of stock' }}</span>
                        </td>
                        <td class="sm-shop-action">
                            @if (! $product->is_available)
                                <button class="btn btn-outline-secondary rounded-pill" type="button" disabled>Add to Cart</button>
                            @elseif ($product->variants->isNotEmpty())
                                <a class="btn sm-btn-primary rounded-pill" href="{{ $productUrl }}" aria-label="Choose options for {{ $product->name }}">Choose Options</a>
                            @else
                                <form method="POST" action="{{ route('storefront.cart.store') }}">
                                    @csrf
                                    <input type="hidden" name="product_id" value="{{ $product->id }}">
                                    <input type="hidden" name="quantity" value="1">
                                    <button class="btn sm-btn-primary rounded-pill" type="submit" data-saruar-add-to-cart aria-label="Add {{ $product->name }} to cart">Add to Cart</button>
                                </form>
                            @endif
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>

        @if ($isOwner)
            <div class="sm-shop-table-foot">
                <div class="sm-share-link">
                    <label class="sm-text-link mb-0" for="wishlistShareLink">Wishlist link:</label>
                    <input id="wishlistShareLink" class="form-control rounded-pill" type="url" value="{{ $shareUrl }}" readonly aria-describedby="wishlistShareHelp">
                    <button class="btn sm-btn-primary rounded-pill" type="button" data-saruar-copy="#wishlistShareLink">Copy Link</button>
                    <span id="wishlistShareHelp" class="visually-hidden">Anyone with this link can see the products on your wishlist, and nothing else of your account.</span>
                </div>
                <div class="sm-share-actions">
                    <form method="POST" action="{{ route('storefront.wishlist.clear') }}" data-saruar-confirm="Remove every item from your wishlist?">
                        @csrf
                        @method('DELETE')
                        <button class="btn btn-link sm-text-link" type="submit">Clear Wishlist</button>
                    </form>
                    <form method="POST" action="{{ route('storefront.wishlist.cart') }}">
                        @csrf
                        <button class="btn sm-btn-primary rounded-pill" type="submit">Add All to Cart</button>
                    </form>
                </div>
            </div>
        @endif
    @endif

    <x-storefront.service-strip />
</x-storefront.shop-page>