@extends('user.layouts.app')
@section('title','Notifications')
@section('page-title','Notifications')
@section('page-subtitle','Your dashboard notifications')
@section('content')

<div class="content-card p-4">
    <form method="POST" action="{{ route('user.notifications.read-all') }}" class="mb-3 text-end">@csrf<button class="btn btn-sm btn-outline-secondary">Mark all as read</button></form>
    <div class="list-group list-group-flush">
        @forelse($notifications as $notification)
            <div class="list-group-item {{ $notification->read_at ? '' : 'bg-light' }}">
                <div class="d-flex justify-content-between">
                    <div>
                        <strong>{{ $notification->title }}</strong>
                        @if(!$notification->read_at)<span class="badge bg-primary ms-1">New</span>@endif
                        <p class="mb-1 text-muted">{{ $notification->message }}</p>
                        @if(str_contains(strtolower($notification->title), 'certificate'))
                            <a href="{{ route('user.my-certificates') }}" class="small">Go to My Certificates</a>
                        @elseif(str_contains(strtolower($notification->title), 'speaker'))
                            <a href="{{ route('user.my-presentations') }}" class="small">Go to My Presentations</a>
                        @endif
                        <small class="d-block">{{ $notification->created_at->diffForHumans() }}</small>
                    </div>
                    @if(!$notification->read_at)
                        <form method="POST" action="{{ route('user.notifications.read', $notification) }}">@csrf<button class="btn btn-sm btn-link">Mark read</button></form>
                    @endif
                </div>
            </div>
        @empty
            <p class="text-muted mb-0 p-3">No notifications yet.</p>
        @endforelse
    </div>
    {{ $notifications->links() }}
</div>

@endsection