{{--
    Contacts table shared by the organisation's Contacts tab and the Contacts list.
    Expects: $contacts (iterable of Contact, with opportunities_count), $showOrganisation (bool).
--}}
@php
    $consentColours = ['granted' => 'emerald', 'withdrawn' => 'rose', 'unknown' => 'slate'];
    $columns = $showOrganisation ? 6 : 5;
@endphp

<div class="overflow-hidden rounded-2xl border border-slate-200 bg-white">
    <div class="overflow-x-auto">
        <table class="min-w-full divide-y divide-slate-100">
            <thead>
                <tr class="bg-slate-50/80 text-left text-[11px] font-semibold uppercase tracking-wider text-slate-500">
                    <th class="px-3 py-3.5 lg:px-4">{{ __('Name') }}</th>
                    @if ($showOrganisation)
                        <th class="px-3 py-3.5 lg:px-4">{{ __('Organisation') }}</th>
                    @endif
                    <th class="px-3 py-3.5 lg:px-4">{{ __('Role') }}</th>
                    <th class="px-3 py-3.5 lg:px-4">{{ __('How to reach') }}</th>
                    <th class="px-3 py-3.5 lg:px-4">{{ __('Marketing') }}</th>
                    <th class="px-3 py-3.5 text-right lg:px-4">{{ __('Actions') }}</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-slate-100 bg-white">
                @forelse ($contacts as $person)
                    <tr wire:key="contact-{{ $person->id }}" class="transition hover:bg-slate-50/70">
                        <td class="px-3 py-4 text-sm lg:px-4">
                            <a href="{{ route('crm.contacts.show', $person) }}" wire:navigate class="font-medium text-slate-900 hover:text-indigo-600">{{ $person->name }}</a>
                            @if ($person->is_primary)
                                <x-badge color="indigo" class="ml-1">{{ __('Main contact') }}</x-badge>
                            @endif
                            @if ($person->title || $person->department)
                                <p class="text-xs text-slate-500">{{ collect([$person->title, $person->department])->filter()->implode(', ') }}</p>
                            @endif
                        </td>
                        @if ($showOrganisation)
                            <td class="px-3 py-4 text-sm lg:px-4">
                                @if ($person->customer)
                                    <a href="{{ route('crm.organisations.show', $person->customer) }}" wire:navigate class="text-slate-700 hover:text-indigo-600">{{ $person->customer->name }}</a>
                                @else
                                    <span class="text-slate-400">{{ __('Not available') }}</span>
                                @endif
                            </td>
                        @endif
                        <td class="px-3 py-4 text-sm text-slate-600 lg:px-4">
                            {{ $person->decision_role ? __(\App\Models\Crm\Contact::DECISION_ROLES[$person->decision_role] ?? $person->decision_role) : __('Not known') }}
                        </td>
                        <td class="px-3 py-4 text-sm text-slate-600 lg:px-4">
                            @if ($person->email)
                                <a href="mailto:{{ $person->email }}" class="block break-all hover:text-indigo-600">{{ $person->email }}</a>
                            @endif
                            @if ($person->phone)
                                <span class="block whitespace-nowrap">{{ $person->phone }}</span>
                            @endif
                            @if (! $person->email && ! $person->phone)
                                <span class="text-slate-400">{{ __('No details yet') }}</span>
                            @endif
                            @if ($person->preferred_channel)
                                <span class="block text-xs text-slate-400">{{ __('Prefers :channel', ['channel' => __(\App\Models\Crm\Contact::CHANNELS[$person->preferred_channel] ?? $person->preferred_channel)]) }}</span>
                            @endif
                        </td>
                        <td class="whitespace-nowrap px-3 py-4 text-sm lg:px-4">
                            <x-badge :color="$consentColours[$person->marketing_consent] ?? 'slate'">{{ __(\App\Models\Crm\Contact::CONSENTS[$person->marketing_consent] ?? 'Not recorded') }}</x-badge>
                        </td>
                        <td class="whitespace-nowrap px-3 py-4 text-right text-sm font-medium lg:px-4">
                            <div class="flex items-center justify-end gap-3">
                                @can('update', $person)
                                    <button type="button" wire:click="editContact({{ $person->id }})" class="text-indigo-600 transition hover:text-indigo-800">{{ __('Edit') }}</button>
                                @endcan
                                @can('delete', $person)
                                    <button type="button" wire:click="deleteContact({{ $person->id }})" wire:confirm="{{ __('Remove :name? Their past activity stays on the organisation.', ['name' => $person->name]) }}" class="text-rose-600 transition hover:text-rose-800">{{ __('Remove') }}</button>
                                @endcan
                            </div>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="{{ $columns }}" class="px-6 py-10">
                            <x-empty-state icon="users" :title="$emptyTitle ?? __('No contacts yet')"
                                :message="$emptyMessage ?? __('Add the people you deal with: who decides, who signs, who uses the work.')"
                                class="border-0 bg-transparent py-0" />
                        </td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>