@extends('layouts.app')
@section('content')
<div class="max-w-5xl mx-auto px-4 py-8">
    <div class="flex items-center justify-between mb-4">
        <h1 class="text-2xl font-bold">لوحة تتبع النشاط</h1>
        <a href="{{ route('features.index') }}" class="text-blue-600 hover:underline">مركز Premium</a>
    </div>
    <div class="overflow-x-auto rounded-2xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800">
        <table class="min-w-full text-sm">
            <thead>
                <tr class="text-right text-gray-600 dark:text-gray-300 border-b border-gray-200 dark:border-gray-700">
                    <th class="py-3 px-4">الوقت</th>
                    <th class="py-3 px-4">النوع</th>
                    <th class="py-3 px-4">الطرف الآخر</th>
                    <th class="py-3 px-4">تفاصيل</th>
                </tr>
            </thead>
            <tbody>
            @forelse($tracks as $t)
                <tr class="border-b border-gray-100 dark:border-gray-700/50">
                    <td class="py-3 px-4">{{ optional($t->occurred_at)->format('Y-m-d H:i') }}</td>
                    <td class="py-3 px-4">{{ $t->type }}</td>
                    <td class="py-3 px-4">
                        @if($t->other_user_id)
                            <a href="{{ route('profile.show', $t->other_user_id) }}" class="text-blue-600 hover:underline">#{{ $t->other_user_id }}</a>
                        @else — @endif
                    </td>
                    <td class="py-3 px-4 text-xs text-gray-600 dark:text-gray-300">{{ is_array($t->meta) ? json_encode($t->meta, JSON_UNESCAPED_UNICODE) : '' }}</td>
                </tr>
            @empty
                <tr><td colspan="4" class="py-6 px-4 text-center text-gray-500">لا يوجد نشاط بعد.</td></tr>
            @endforelse
            </tbody>
        </table>
        <div class="p-3">{{ $tracks->links() }}</div>
    </div>
</div>
@endsection