{{-- resources/views/agent/leads/partials/purchased.blade.php --}}
@php
    use Illuminate\Support\Facades\Route;

    // Safe fallback if the controller didn't pass $data
$purchasedData = is_array($data ?? null) ? $data : [];

// Tabs we support
$types = [
    'life' => 'Life',
    'mortgage' => 'Mortgage Protection',
    'health' => 'Health',
];

// If at least one dataset exists, start there; else default to Life
$available = array_values(array_filter(array_keys($types), fn($k) => array_key_exists($k, $purchasedData)));
$firstActive = $available[0] ?? 'life';

    // Unique IDs so these don’t collide with Assigned tab
    $paneId = fn($key) => "purchased-{$key}";
    $tabId = fn($key) => "purchased-tab-{$key}";
@endphp

<div class="card">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h5 class="mb-0">Purchased Leads</h5>
        <div>
            {{-- Apply dropdown (archive / delete) --}}
            <form method="POST" action="{{ route('agent.leads.purchased.bulk') }}" id="bulkActionForm">
                @csrf
                <input type="hidden" name="action" value="">
                <input type="hidden" name="type" value="">
                <input type="hidden" name="ids[]" value="">
                <div class="btn-group">
                    <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle"
                        data-bs-toggle="dropdown">
                        Apply
                    </button>
                    <ul class="dropdown-menu">
                        <li><a class="dropdown-item bulk-action" data-action="archive" href="#">Archive</a></li>
                        <li><a class="dropdown-item bulk-action" data-action="delete" href="#">Delete</a></li>
                    </ul>
                </div>
            </form>
        </div>
    </div>

    <div class="card-body">
        {{-- Tabs --}}
        <ul class="nav nav-tabs" role="tablist">
            @foreach ($types as $key => $label)
                @if (array_key_exists($key, $purchasedData))
                    <li class="nav-item" role="presentation">
                        <button class="nav-link @if ($key === $firstActive) active @endif"
                            id="{{ $tabId($key) }}" data-bs-toggle="tab" data-bs-target="#{{ $paneId($key) }}"
                            type="button" role="tab">
                            {{ $label }}
                        </button>
                    </li>
                @endif
            @endforeach
        </ul>

        {{-- Tab panes --}}
        <div class="tab-content mt-3">
            @foreach ($types as $key => $label)
                @if (array_key_exists($key, $purchasedData))
                    @php $rows = $purchasedData[$key]; @endphp
                    <div class="tab-pane fade @if ($key === $firstActive) show active @endif"
                        id="{{ $paneId($key) }}" role="tabpanel" aria-labelledby="{{ $tabId($key) }}">
                        <div class="table-responsive">
                            <table class="table table-bordered table-hover align-middle">
                                <thead>
                                    <tr>
                                        <th><input type="checkbox" class="check-all" data-scope="{{ $key }}">
                                        </th>
                                        <th>First</th>
                                        <th>Last</th>
                                        <th>Email</th>
                                        <th>Phone</th>
                                        <th>City</th>
                                        <th>State</th>
                                        <th>Insurance Type</th>
                                        <th>Status</th>
                                        <th>Purchase Date</th>
                                        <th>Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse ($rows as $lead)
                                        <tr>
                                            <td>
                                                <input type="checkbox" name="ids[{{ $key }}][]"
                                                    value="{{ $lead->id }}"
                                                    class="row-check row-check-{{ $key }}">
                                            </td>
                                            <td>{{ $lead->first_name }}</td>
                                            <td>{{ $lead->last_name }}</td>
                                            <td>{{ $lead->email }}</td>
                                            <td>{{ $lead->phone_number }}</td>
                                            <td>{{ $lead->city }}</td>
                                            <td>{{ $lead->state }}</td>
                                            <td>
                                                <form method="POST" action="{{ route('agent.leads.inline') }}">
                                                    @csrf
                                                    @method('PATCH')
                                                    <input type="hidden" name="scope"
                                                        value="purchased_{{ $key }}">
                                                    <input type="hidden" name="id" value="{{ $lead->id }}">
                                                    <input type="hidden" name="field" value="insurance_type">
                                                    <select name="value" class="form-select form-select-sm"
                                                        onchange="this.form.submit()">
                                                        @php
                                                            $opts =
                                                                $key === 'life'
                                                                    ? $dropdowns['lifeInsuranceTypes']
                                                                    : ($key === 'mortgage'
                                                                        ? [$dropdowns['mortgageInsuranceType']]
                                                                        : $dropdowns['healthInsuranceTypes']);
                                                        @endphp
                                                        @foreach ($opts as $opt)
                                                            <option value="{{ $opt }}"
                                                                @selected($lead->insurance_type === $opt)>
                                                                {{ ucfirst(str_replace('_', ' ', $opt)) }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </form>
                                            </td>
                                            <td>
                                                <form method="POST" action="{{ route('agent.leads.inline') }}">
                                                    @csrf
                                                    @method('PATCH')
                                                    <input type="hidden" name="scope"
                                                        value="purchased_{{ $key }}">
                                                    <input type="hidden" name="id" value="{{ $lead->id }}">
                                                    <input type="hidden" name="field" value="status">
                                                    <select name="value" class="form-select form-select-sm"
                                                        onchange="this.form.submit()">
                                                        @foreach ($dropdowns['statuses'] as $s)
                                                            <option value="{{ $s }}"
                                                                @selected($lead->status === $s)>
                                                                {{ ucfirst(str_replace('_', ' ', $s)) }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </form>
                                            </td>
                                            <td>{{ $lead->purchase_date ?? '' }}</td>
                                            <td>
                                                {{-- Convert Button --}}
                                                <form method="POST"
                                                    action="{{ route('agent.purchased-leads.convert', ['type' => $key, 'id' => $lead->id]) }}">
                                                    @csrf
                                                    <button type="submit"
                                                        class="btn btn-sm btn-success">Convert</button>
                                                </form>
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="11" class="text-center">No {{ $label }} leads found.
                                            </td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                        {{-- Pagination --}}
                        <div class="mt-2">
                            {{ $rows->links() }}
                        </div>
                    </div>
                @endif
            @endforeach
        </div>
    </div>
</div>

@push('scripts')
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // Bulk action handler
            document.querySelectorAll('.bulk-action').forEach(el => {
                el.addEventListener('click', function(e) {
                    e.preventDefault();
                    let action = this.dataset.action;
                    let tabPane = this.closest('.card').querySelector('.tab-pane.active');
                    if (!tabPane) return;

                    let scope = tabPane.id.replace('purchased-', '');
                    let checks = tabPane.querySelectorAll('.row-check-' + scope + ':checked');
                    if (checks.length === 0) {
                        alert('Select at least one lead.');
                        return;
                    }

                    let form = document.getElementById('bulkActionForm');
                    form.querySelector('input[name=action]').value = action;
                    form.querySelector('input[name=type]').value = scope;

                    // clear old ids
                    form.querySelectorAll('input[name="ids[]"]').forEach(i => i.remove());

                    checks.forEach(c => {
                        let i = document.createElement('input');
                        i.type = 'hidden';
                        i.name = 'ids[]';
                        i.value = c.value;
                        form.appendChild(i);
                    });

                    form.submit();
                });
            });

            // Select all checkbox
            document.querySelectorAll('.check-all').forEach(el => {
                el.addEventListener('change', function() {
                    let scope = this.dataset.scope;
                    document.querySelectorAll('.row-check-' + scope).forEach(c => {
                        c.checked = this.checked;
                    });
                });
            });
        });
    </script>
@endpush