@php
    $messages = is_array($pageData) ? ($pageData['messages'] ?? collect()) : $pageData;
    $contactIndex = is_array($pageData) ? ($pageData['contactIndex'] ?? []) : [];
@endphp

@include('admin.devices.partials.monitoring-notice')

<div class="overflow-x-auto text-sm">
    <table class="min-w-full divide-y divide-gray-200 border border-gray-200 rounded-lg">
        <thead class="bg-gray-50">
            <tr>
                <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">{{ __('devices.sms.col_type') }}</th>
                <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Fecha</th>
                <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Contacto</th>
                <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Mensaje</th>
            </tr>
        </thead>
        <tbody class="divide-y divide-gray-100 bg-white">
            @forelse($messages as $sms)
                <tr class="hover:bg-gray-50">
                    <td class="px-4 py-2 whitespace-nowrap">
                        <x-sms-direction-badge :sms="$sms" />
                    </td>
                    <td class="px-4 py-2 text-xs text-gray-500 whitespace-nowrap">{{ $sms->received_at?->format('d/m/Y H:i:s') }}</td>
                    <td class="px-4 py-2 text-xs">
                        @if($sms->address)
                            <x-contact-link
                                :device="$device"
                                :phone="$sms->address"
                                :contact-index="$contactIndex"
                                class="font-mono text-indigo-700 hover:text-indigo-900 hover:underline text-xs"
                            />
                        @else
                            <span class="text-gray-400">—</span>
                        @endif
                    </td>
                    <td class="px-4 py-2">{{ Str::limit($sms->body, 120) }}</td>
                </tr>
            @empty
                <tr><td colspan="4" class="px-4 py-6 text-gray-500">Sin SMS registrados aún. El dispositivo los enviará automáticamente.</td></tr>
            @endforelse
        </tbody>
    </table>
</div>