@extends('layouts.app')

@section('content')
    <div class="container mt-4">
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h4>Notifications</h4>
                <a href="{{ route('notifications.create') }}" class="btn btn-primary">Add Notification</a>
            </div>
            <div class="card-body">
                <table class="table table-bordered">
                    <thead>
                        <tr>
                            <th style="width: 10%;">ID</th>
                            <th style="width: 10%;">Subject</th>
                            <th style="width: 30%;">Content</th>
                            <th style="width: 20%;">Is Scheduled</th>
                            <th style="width: 20%;">Schedule</th>
                            <th style="width: 20%;">Expiration</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse ($notifications as $notification)
                            <tr>
                                <td>{{ $notification['id'] ?? 'N/A' }}</td>
                                <td>{{ $notification['subject'] ?? 'N/A' }}</td>
                                <td>{{ $notification['content'] ?? 'N/A' }}</td>
                                <td>{{ $notification['isScheduled'] ? 'Yes' : 'No' }}</td>
                                <td>{{ $notification['schedule'] ? \Carbon\Carbon::parse($notification['schedule'])->format('M d, Y H:i') : 'N/A' }}</td>
                                <td>{{ $notification['expiration'] ? \Carbon\Carbon::parse($notification['expiration'])->format('M d, Y H:i') : 'N/A' }}</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="6" class="text-center">No notifications found.</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
                @if ($updating)
                    <div class="text-center">
                        <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Loading...
                    </div>
                @endif
            </div>
        </div>
    </div>
@endsection