@php
    $listingQuery = fn (array $extra = []) => route('landing-pages.index', array_merge(
        request()->except('page'),
        ['tab' => 'prompt'],
        $extra,
    ));
    $overrideSources = $overrideSources ?? [];
@endphp

<div class="mb-stats">
    <div class="mb-stat">
        <span class="mb-stat-icon is-all"><i class="bi bi-collection"></i></span>
        <span><span class="mb-stat-num">{{ $stats['all'] }}</span><span class="mb-stat-label d-block">Total</span></span>
    </div>
    <div class="mb-stat">
        <span class="mb-stat-icon is-ok"><i class="bi bi-check2-circle"></i></span>
        <span><span class="mb-stat-num">{{ $stats['approved'] }}</span><span class="mb-stat-label d-block">Approved</span></span>
    </div>
    <div class="mb-stat">
        <span class="mb-stat-icon is-run"><i class="bi bi-hourglass-split"></i></span>
        <span><span class="mb-stat-num">{{ $stats['active'] }}</span><span class="mb-stat-label d-block">In progress</span></span>
    </div>
    <div class="mb-stat">
        <span class="mb-stat-icon is-err"><i class="bi bi-exclamation-triangle"></i></span>
        <span><span class="mb-stat-num">{{ $stats['failed'] }}</span><span class="mb-stat-label d-block">Failed</span></span>
    </div>
</div>

<div class="mb-card">
    <form class="mb-toolbar" method="GET" action="{{ route('landing-pages.index') }}">
        <input type="hidden" name="tab" value="prompt">
        <select class="mb-select" name="status" aria-label="Filter by status" onchange="this.form.submit()">
            <option value="all" @selected(! request('status') || request('status') === 'all')>All statuses</option>
            <option value="approved" @selected(request('status') === 'approved')>Approved</option>
            <option value="pending_approval" @selected(request('status') === 'pending_approval')>Pending approval</option>
            <option value="in_progress" @selected(request('status') === 'in_progress')>In progress</option>
            <option value="failed" @selected(request('status') === 'failed')>Failed</option>
        </select>
        @if ($purposeTabs !== [])
            <select class="mb-select" name="purpose" aria-label="Filter by purpose" onchange="this.form.submit()">
                @foreach ($purposeTabs as $tab)
                    <option value="{{ $tab }}" @selected($tab === $activePurpose)>{{ \App\Models\PromptLandingPage::purposeTabLabel($tab) }}</option>
                @endforeach
            </select>
        @endif
        @if ($websites !== [])
            <select class="mb-select" name="website" aria-label="Filter by website domain" onchange="this.form.submit()">
                <option value="" @selected($activeWebsite === null)>All websites</option>
                @foreach ($websites as $website)
                    <option value="{{ $website['value'] }}" @selected($activeWebsite === $website['value'])>{{ $website['label'] }}</option>
                @endforeach
            </select>
        @endif
        <select class="mb-select" name="per_page" aria-label="Rows per page" onchange="this.form.submit()">
            <option value="10" @selected($pages->perPage() === 10)>10 / page</option>
            <option value="25" @selected($pages->perPage() === 25)>25 / page</option>
            <option value="50" @selected($pages->perPage() === 50)>50 / page</option>
        </select>
        <div class="mb-toolbar-end">
            <label class="mb-search">
                <i class="bi bi-search"></i>
                <input type="search" name="q" value="{{ request('q') }}" placeholder="Search prompt pages…" aria-label="Search prompt pages">
            </label>
            <button type="submit" class="mb-btn-ghost"><i class="bi bi-search"></i>Search</button>
        </div>
    </form>

    @if ($pages->isEmpty())
        <div class="mb-empty">
            <div class="mb-empty-icon"><i class="bi bi-window"></i></div>
            @if ($stats['all'] === 0)
                <div class="mb-empty-title">No prompt pages yet</div>
                <div>Click New prompt page to describe a page in chat.</div>
            @else
                <div class="mb-empty-title">No prompt pages match your filters</div>
                <div>Try a different search term, or clear the status and website filters.</div>
            @endif
        </div>
    @else
        @php
            $sortLink = fn (string $col) => $listingQuery([
                'sort' => $col,
                'dir' => $sort === $col && $dir === 'desc' ? 'asc' : 'desc',
            ]);
        @endphp
        <div class="mb-table-wrap">
            <table class="mb-table">
                <thead>
                    <tr>
                        <th class="is-sortable @if ($sort === 'id') is-sorted @endif"><a href="{{ $sortLink('id') }}" class="text-reset text-decoration-none">#<i class="bi bi-arrow-down-up"></i></a></th>
                        <th class="is-sortable @if ($sort === 'title') is-sorted @endif"><a href="{{ $sortLink('title') }}" class="text-reset text-decoration-none">Page<i class="bi bi-arrow-down-up"></i></a></th>
                        <th>Website</th>
                        <th class="is-sortable @if ($sort === 'status') is-sorted @endif"><a href="{{ $sortLink('status') }}" class="text-reset text-decoration-none">Status<i class="bi bi-arrow-down-up"></i></a></th>
                        <th class="is-sortable @if ($sort === 'created') is-sorted @endif"><a href="{{ $sortLink('created') }}" class="text-reset text-decoration-none">Created<i class="bi bi-arrow-down-up"></i></a></th>
                        <th><span class="visually-hidden">Actions</span></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($pages as $page)
                        @php
                            $statusClass = match ($page->status) {
                                'approved' => 'completed',
                                'pending_approval', 'completed', 'generating', 'analysing', 'searching' => 'generating',
                                'failed', 'rejected' => 'failed',
                                default => 'queued',
                            };
                        @endphp
                        <tr>
                            <td class="mb-td-id" data-label="#">{{ $page->id }}</td>
                            <td data-label="Page">
                                <div class="mb-cell-title">{{ $page->displayTitle() }}</div>
                                <div class="mb-cell-meta">{{ $page->purpose ?: 'Unset' }}</div>
                            </td>
                            <td data-label="Website"><span class="mb-tag">{{ $page->displayWebsite() }}</span></td>
                            <td data-label="Status">
                                <span class="mb-status is-{{ $statusClass }}"><span class="mb-dot"></span>{{ \Illuminate\Support\Str::headline($page->status) }}</span>
                            </td>
                            <td data-label="Created">{{ $page->created_at->diffForHumans() }}</td>
                            <td class="mb-td-actions" data-label="">
                                <div class="mb-row-actions">
                                    <a href="{{ route('prompt-landing-pages.show', $page) }}" class="mb-row-btn is-icon" aria-label="Open" title="Open"><i class="bi bi-eye"></i></a>
                                    @if ($page->canEdit())
                                        <a href="{{ route('prompt-landing-pages.editor', $page) }}" class="mb-row-btn is-icon" aria-label="Edit page" title="Edit page"><i class="bi bi-pencil-square"></i></a>
                                    @endif
                                    @if ($page->partnerPreviewUrl())
                                        <a href="{{ $page->partnerPreviewUrl() }}" class="mb-row-btn is-icon" target="_blank" rel="noopener noreferrer" aria-label="Partner link" title="Partner link"><i class="bi bi-box-arrow-up-right"></i></a>
                                    @endif
                                    @unless ($page->isAppDownload())
                                        <a href="{{ route('prompt-landing-pages.leads.index', $page) }}" class="mb-row-btn is-icon" aria-label="Leads{{ $page->leads_count > 0 ? ' ('.$page->leads_count.')' : '' }}" title="Leads">
                                            <i class="bi bi-people"></i>
                                            @if ($page->leads_count > 0)
                                                <span class="mb-row-btn-count">{{ $page->leads_count }}</span>
                                            @endif
                                        </a>
                                    @endunless
                                    @if ($page->isAppDownload())
                                        <a href="{{ route('prompt-landing-pages.leads.index', ['page' => $page, 'tab' => 'downloads']) }}" class="mb-row-btn is-icon" aria-label="Downloads{{ $page->download_clicks_count > 0 ? ' ('.$page->download_clicks_count.')' : '' }}" title="Downloads">
                                            <i class="bi bi-download"></i>
                                            @if ($page->download_clicks_count > 0)
                                                <span class="mb-row-btn-count">{{ $page->download_clicks_count }}</span>
                                            @endif
                                        </a>
                                    @endif
                                    @if ($page->canDuplicate())
                                        <form method="POST" action="{{ route('prompt-landing-pages.duplicate', $page) }}" onsubmit="return confirm('Duplicate this landing page? A new independent page will be created. This page stays unchanged.');">
                                            @csrf
                                            <button type="submit" class="mb-row-btn is-icon" aria-label="Duplicate page" title="Duplicate page"><i class="bi bi-copy"></i></button>
                                        </form>
                                    @endif
                                    @if ($page->canReceiveOverride() && count($overrideSources) > 1)
                                        <button type="button"
                                            class="mb-row-btn is-icon"
                                            data-bs-toggle="modal"
                                            data-bs-target="#prompt-page-override-modal"
                                            data-override-action="{{ route('prompt-landing-pages.override', $page) }}"
                                            data-override-title="{{ $page->displayTitle() }}"
                                            data-override-id="{{ $page->id }}"
                                            aria-label="Override with another page"
                                            title="Override with another page">
                                            <i class="bi bi-arrow-left-right"></i>
                                        </button>
                                    @endif
                                    @if ($page->isApproved())
                                        <button type="button"
                                            class="mb-row-btn is-icon"
                                            data-bs-toggle="modal"
                                            data-bs-target="#prompt-page-pixels-modal"
                                            data-pixels-action="{{ route('prompt-landing-pages.pixels.update', $page) }}"
                                            data-google-send-to="{{ $page->google_conversion_send_to }}"
                                            data-meta-pixel-id="{{ $page->meta_pixel_id }}"
                                            aria-label="Tracking pixels"
                                            title="Tracking pixels">
                                            <i class="bi bi-broadcast"></i>
                                        </button>
                                    @endif
                                    <form method="POST" action="{{ route('prompt-landing-pages.destroy', $page) }}" onsubmit="return confirm('Delete this landing page?');">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="mb-row-btn is-icon" aria-label="Delete" title="Delete"><i class="bi bi-trash"></i></button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>

        <div class="mb-table-foot">
            <span>Showing <strong>{{ $pages->firstItem() }}–{{ $pages->lastItem() }}</strong> of <strong>{{ $pages->total() }}</strong></span>
            <div class="mb-pager">{{ $pages->onEachSide(1)->links() }}</div>
        </div>
    @endif
</div>

@include('landing-pages.partials.prompt-pixels-modal')
@include('landing-pages.partials.prompt-override-modal')