@extends('crm.layouts.app')

@section('title', 'Enquiries')

@section('content')
<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-8">

    <div class="mb-8">
        <h1 class="text-2xl font-semibold text-gray-900">Enquiries</h1>
        <p class="mt-1 text-sm text-gray-600">
            Requests waiting on you. Review the piece, then offer a few times that fit around the work
            you already have.
        </p>
    </div>

    @if(session('success'))
        <div class="mb-6 rounded-md bg-green-50 p-4 text-sm font-medium text-green-800">{{ session('success') }}</div>
    @endif

    <!-- Filters -->
    <div class="mb-6 flex flex-wrap gap-2">
        @foreach(['open' => 'Open', 'new' => 'New', 'reviewing' => 'Reviewing', 'offered' => 'Awaiting reply', 'accepted' => 'Booked', 'declined' => 'Declined', 'all' => 'All'] as $value => $label)
            <a href="{{ route('crm.enquiries.index', ['status' => $value]) }}"
               class="rounded-md px-3 py-1.5 text-sm font-medium {{ $status === $value ? 'bg-indigo-600 text-white' : 'bg-white text-gray-700 ring-1 ring-inset ring-gray-300 hover:bg-gray-50' }}">
                {{ $label }}
                @if(isset($counts[$value]) && $counts[$value] > 0)
                    <span class="ml-1 {{ $status === $value ? 'text-indigo-200' : 'text-gray-400' }}">{{ $counts[$value] }}</span>
                @endif
            </a>
        @endforeach
    </div>

    <div class="overflow-hidden bg-white shadow-sm ring-1 ring-gray-900/5 sm:rounded-lg">
        <ul role="list" class="divide-y divide-gray-100">
            @forelse($enquiries as $enquiry)
                <li>
                    <a href="{{ route('crm.enquiries.show', $enquiry) }}" class="flex items-start gap-4 px-6 py-5 hover:bg-gray-50">
                        <div class="min-w-0 flex-1">
                            <div class="flex items-center gap-3">
                                <p class="text-sm font-semibold text-gray-900">{{ $enquiry->name }}</p>
                                <span class="inline-flex items-center rounded-md px-2 py-0.5 text-xs font-medium ring-1 ring-inset
                                    @if($enquiry->status === 'new') bg-blue-50 text-blue-700 ring-blue-600/20
                                    @elseif($enquiry->status === 'reviewing') bg-yellow-50 text-yellow-800 ring-yellow-600/20
                                    @elseif($enquiry->status === 'offered') bg-purple-50 text-purple-700 ring-purple-600/20
                                    @elseif($enquiry->status === 'accepted') bg-green-50 text-green-700 ring-green-600/20
                                    @else bg-gray-50 text-gray-600 ring-gray-500/10 @endif">
                                    {{ ['new' => 'New', 'reviewing' => 'Reviewing', 'offered' => 'Awaiting reply', 'accepted' => 'Booked', 'declined' => 'Declined'][$enquiry->status] ?? ucfirst($enquiry->status) }}
                                </span>
                                @if($enquiry->is_first_tattoo)
                                    <span class="inline-flex items-center rounded-md bg-gray-50 px-2 py-0.5 text-xs font-medium text-gray-600 ring-1 ring-inset ring-gray-500/10">
                                        First tattoo
                                    </span>
                                @endif
                            </div>
                            <p class="mt-1 line-clamp-2 text-sm text-gray-600">{{ $enquiry->description }}</p>
                            <p class="mt-1.5 text-xs text-gray-500">
                                {{ collect([
                                    $enquiry->placement,
                                    $enquiry->size,
                                    $enquiry->style,
                                    $enquiry->budgetRange(),
                                    $enquiry->artist?->name,
                                ])->filter()->implode(' · ') }}
                            </p>
                        </div>
                        <div class="shrink-0 text-right">
                            <p class="text-xs text-gray-500">{{ $enquiry->created_at->diffForHumans() }}</p>
                            @if(!empty($enquiry->reference_images))
                                <p class="mt-1 text-xs text-gray-400">
                                    {{ count($enquiry->reference_images) }} {{ Str::plural('reference', count($enquiry->reference_images)) }}
                                </p>
                            @endif
                        </div>
                    </a>
                </li>
            @empty
                <li class="px-6 py-16 text-center">
                    <p class="text-sm font-semibold text-gray-900">Nothing here</p>
                    <p class="mt-1 text-sm text-gray-500">
                        Requests from your public booking page land here first.
                    </p>
                </li>
            @endforelse
        </ul>
    </div>

    @if($enquiries->hasPages())
        <div class="mt-6">{{ $enquiries->links() }}</div>
    @endif
</div>
@endsection