@php use App\Enums\ReportStatus; @endphp
<x-dashboard.admin.layout title="Manage Deals">
    <x-slot:heading>
        <x-dashboard.page-heading
            title="Manage Deals"
            description="Approve or reject deals"
        />
    </x-slot:heading>
    <div class="flex items-center justify-center px-4 pb-4 pt-0 md:px-8 md:pb-8">
        <x-dashboard.card class="w-full">
            <h3 class="text-md font-bold mb-2">Approve deals</h3>
            <x-ui.table>
                <x-ui.table.head>
                    <th>Title</th>
                    <th>Description</th>
                    <th>Link</th>
                    <th>Category</th>
                    <th>Broker</th>
                </x-ui.table.head>

                @forelse($deals as $deal)
                    <x-ui.table.row>
                        <td class="text-sm font-medium px-4 text-center truncate max-w-20">{{ucfirst($deal->title)}}</td>
                        <td class="text-sm text-accent-600 px-4 text-center truncate max-w-60">{{$deal->description}}</td>
                        <td class="text-sm px-4 text-center">{{$deal->link}}</td>
                        <td class="text-sm px-4 text-center">{{$deal->category->name}}</td>
                        <td class="text-sm px-4 text-center">{{$deal->broker->name}}</td>
                        <x-slot:actions>
                            <div class="flex items-center justify-center space-x-2 py-1 px-2">
                                <form action="{{route('admin.deals.approve', $deal)}}"
                                      onsubmit="return confirm('Are you sure to activate the deal ?')" method="post"
                                      class=" h-full items-center flex justify-center">
                                    @csrf
                                    <x-ui.button-sm tooltip="Approve deal" variant="green">
                                        <x-heroicon-o-check class="w-4"/>
                                    </x-ui.button-sm>
                                </form>

                                <form action="{{route('admin.deals.reject', $deal)}}"
                                      onsubmit="return confirm('Are you sure to delete the deal ?')" method="post"
                                      class=" h-full items-center flex justify-center">
                                    @csrf
                                    <x-ui.button-sm tooltip="Delete deal" variant="red">
                                        <x-heroicon-o-x-mark class="w-4"/>
                                    </x-ui.button-sm>
                                </form>

                                <x-ui.button-sm data-deal-id="{{$deal->id}}" class="view-deal-btn" tooltip="View Content" variant="ghost">
                                    <x-heroicon-o-eye class="w-4"/>
                                </x-ui.button-sm>
                            </div>
                        </x-slot:actions>
                    </x-ui.table.row>
                @empty
                    <x-ui.table.row>
                        <td colspan="2" class="text-center text-sm text-accent-600 py-2">No Customer found</td>
                    </x-ui.table.row>
                @endforelse
            </x-ui.table>
        </x-dashboard.card>
    </div>
    <x-dashboard.user.deal-modal />
    @vite('resources/js/admin-deals.js')
</x-dashboard.admin.layout>