@if(Auth::user()->unreadNotifications->count() > 0)

<!-- Modal - Add Point -->
<div class="modal fade" wire:ignore.self id="modalReward" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog mx-auto" style="width:390px;margin-top:50px">
        <div class="modal-content bg-white text-dark">
            <div class="modal-body">
                <div>
                    <div class="fs-1">{{__('app.notifications.title')}}</div>
                    
                    <div>
                        <ul class="list-group">
                        @php
                            $totalRubis = 0;
                        @endphp
                        @foreach (Auth::user()->unreadNotifications as $notification) 
                            @switch($notification->type)
                                @case("???.perseus.hoku.be")
                                    <li class="list-group-item bg-white border-0">
                                        <div class="d-flex flex-row align-items-center">
                                            <div><img src="{{asset('/resources/img/greating.png')}}" width="32" height="32" class="me-3"></div>
                                            <div class="flex-fill flex-column">
                                                <div class="fs-6"><i>{{__('app.notifications.reward-received')}}</i></div>
                                                <div>{!! $notification->data['reward_description'] !!}</div>
                                            </div>
                                        </div>
                                    </li>
                                @break        
                            @endswitch
                            
                            @php
                                $notification->markAsRead();
                            @endphp
                        @endforeach        

                        </ul>
                    </div>                                
                </div>
            </div>
            <div class="modal-footer mx-auto">
            <button type="button" class="btn btn-secondary btn-100px" data-bs-dismiss="modal">{{__('common.close')}} </button>
            </div>
        </div>
    </div>
</div>    

<script>
    const bsModal = new bootstrap.Modal(document.getElementById("modalReward"));
    if(bsModal != null) bsModal.show();
</script>

@endif