@include('Admin.layouts.app')
@include('Admin.layouts.sidebar')
@section('title', 'Push Notifications')
<!-- Begin Page Content -->
<div class="container-fluid">
    <!-- Page Heading -->
    <h1 class="h3 mb-2 text-gray-800">All Notifications</h1>
    <!-- DataTales Example -->
    <div class="card shadow mb-4">
        <section class="user-page">
            <div class="container mt-4">
                <div class="card mb-4">
                    <div class="card-body">
                        <div class="table-responsive">
                            <table class="table table-bordered" id="laravel_datatable" width="100%" cellspacing="0">
                                <thead>
                                <tr>
                                    <th>Data</th>
                                    <th>Read At</th>
                                    <th>Created At</th>
                                </tr>
                                </thead>
                                <tbody>
                                @forelse($notifications as $notification)
                                    @php
                                        $data = json_decode($notification->data);
                                    @endphp
                                    <tr>
                                        <td>
                                            {{ $data->data }}
                                        </td>
                                        <td>
                                            @if($notification->read_at)
                                                <span class="badge bg-success">Read</span>
                                                <br>
                                                {{ $notification->read_at->format('Y-m-d H:i:s') }}
                                            @else
                                                <span class="badge bg-warning">Unread</span>
                                            @endif
                                        </td>
                                        <td>{{ $notification->created_at->format('Y-m-d H:i:s') }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="6" class="text-center">No notifications found</td>
                                    </tr>
                                @endforelse
                                </tbody>
                            </table>
                        </div>
                        <div class="d-flex justify-content-center mt-3">
                            {{ $notifications->links() }}
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
</div>
<!-- /.container-fluid -->

<style>
    /* Bootstrap 5 Pagination Styling */
    .pagination > li {
        margin: 0 2px;
    }
    .pagination > li > a,
    .pagination > li > span {
        border-radius: 3px;
    }
</style>

@include('Admin.layouts.footer')
@include('Admin.layouts.modal')