@props(['activities'])

<div class="space-y-4">
    @forelse($activities as $activity)
        @php
            $link = null;
            if ($activity->type === 'appointment_created' || $activity->type === 'appointment_updated' || $activity->type === 'appointment_status_changed') {
                $appointmentId = $activity->metadata['appointment_id'] ?? null;
                if ($appointmentId) {
                    $appointment = \App\Models\Appointment::find($appointmentId);
                    if ($appointment) {
                        $link = route('provider.appointments.edit', ['appointment_uuid' => $appointment->uuid, 'stepper' => 'vertical']);
                    }
                }
            }
            if ($activity->type === 'payment_created' || $activity->type === 'payment_updated') {
                $paymentId = $activity->metadata['payment_id'] ?? null;
                if ($paymentId) {
                    $payment = \App\Models\Payment::find($paymentId);
                    if ($payment) {
                        $link = route('provider.invoices.show', ['invoice_uuid' => $payment->uuid]);
                    }
                }
            }
        @endphp
        
        @if($link)
            <a href="{{ $link }}" class="flex gap-4 hover:bg-gray-50 dark:hover:bg-gray-700 p-2 rounded-lg transition">
        @else
            <div class="flex gap-4">
        @endif
                <div class="flex-shrink-0 mt-0.5">
                    <div class="w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center">
                        @switch($activity->type)
                            @case('client_created')
                                <svg class="w-5 h-5 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"/>
                                </svg>
                                @break
                            @case('appointment_created')
                            @case('appointment_updated')
                            @case('appointment_status_changed')
                                <svg class="w-5 h-5 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
                                </svg>
                                @break
                            @case('payment_created')
                            @case('payment_updated')
                                <svg class="w-5 h-5 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
                                </svg>
                                @break
                            @case('note_added')
                            @case('note_updated')
                            @case('note_deleted')
                                <svg class="w-5 h-5 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
                                </svg>
                                @break
                            @default
                                <svg class="w-5 h-5 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
                                </svg>
                        @endswitch
                    </div>
                </div>
                <div class="flex-1">
                    <div class="flex items-center justify-between gap-2">
                        <p class="text-gray-900 dark:text-white font-medium">{{ $activity->description }}</p>
                        <span class="text-xs text-gray-500 dark:text-gray-400 flex-shrink-0 whitespace-nowrap">{{ $activity->created_at->format('d/m/y H:i') }}</span>
                    </div>
                    @if($activity->metadata)
                        <div class="text-sm text-gray-600 dark:text-gray-400 mt-1">
                            @if(isset($activity->metadata['service']))
                                <span class="font-medium">{{ $activity->metadata['service'] }}</span>
                            @endif
                            @if(isset($activity->metadata['date']))
                                <span class="{{ isset($activity->metadata['service']) ? 'ml-2' : '' }}">{{ \Carbon\Carbon::parse($activity->metadata['date'])->format('d/m/Y à H:i') }}</span>
                            @endif
                            @if(isset($activity->metadata['net_amount']))
                                <span class="ml-2">{{ $activity->metadata['net_amount'] }}</span>
                            @elseif(isset($activity->metadata['amount']))
                                <span class="ml-2">{{ $activity->metadata['amount'] }}</span>
                            @endif
                        </div>
                    @endif
                </div>
        @if($link)
            </a>
        @else
            </div>
        @endif
    @empty
        <p class="text-gray-500 dark:text-gray-400 text-sm">Aucune activité</p>
    @endforelse
</div>