@extends('layouts.master')
@section('title', 'Dashboard')
@section('pagetitle', 'Student Dashboard')

@section('content')
    <div class="main">
        <h1 class="hd mb-30">Dashboard</h1>
        <div class="stud-insights mb-60">
            <div class="studentSales card-active">
                <div id="lastClone" class="mentorCard mentor0 topps">
                    <div class="mentor-star">
                        <h4 class="student-ment">My mentors</h4>
                    </div>
                    @if(!empty($mentorsForSlider))
                        @foreach($mentorsForSlider as $mentorForSlider)
                            <div class="studentcard">
                                <div class="mentorInfo">
                                    <h1>{{$mentorForSlider->mentor->getFullName() ?? "No mentor yet"}}</h1>
                                    <p class="mentorField">{{$mentorForSlider->mentor['data']['degree'] ?? ""}}</p>
                                </div>
                                <img class="cardPics"
                                     src="{{$mentorForSlider->mentor->present()->avatar }}"
                                     alt=""/>
                            </div>
                        @endforeach
                    @endif
                </div>

                <div class="pages">
                    @if(!empty($mentorsForSlider))
                        @foreach($mentorsForSlider as $count=>$mentor)
                            <div class="page-{{$count+1}}">
                                <svg
                                    class="slide active"
                                    width="8"
                                    height="8"
                                    viewBox="0 0 12 12"
                                    fill="none"
                                    xmlns="http://www.w3.org/2000/svg"
                                >
                                    <circle cx="6" cy="6" r="6" fill="white"/>
                                </svg>
                            </div>
                        @endforeach
                    @endif
                </div>
            </div>
            <div class="studentSales">
                <div class="topps">
                    <h4 class="student-Appt">My Appointment</h4>
                    <div class="studentcard2">
                        <h1>You have {{$upcomingAppointments}} Upcoming appointment</h1>
                        <span class="material-icons-sharp">calendar_month</span>
                    </div>
                </div>
                <button class="start" id="viewappointmentBtn" data-href="{{ route('user.appointments') }}"
                        type="button">View appointment
                </button>
            </div>
        </div>

        <div class="gridLock">
            <div class="my-activity">
                <h2 class="mb-20">Recent Appointments</h2>
                <div class="activity mb-30">
                    @forelse($recentAppointments as $recentAppointment)
                        <div class="appt_Schedule">
                            <div class="topps">
                                <h4 class="appt-heading mb-30">{{$recentAppointment->getMeetingTime()->diffForHumans()}}</h4>
                                <div class="scheduleText">
                                    <img
                                        src="{{$recentAppointment->mentor->present()->avatar ?? url('assets/img/profile.png')}}"
                                        alt=""/>
                                    <div class="schedule_name">
                                        <h4>{{$recentAppointment->mentor->getFullName()}}</h4>
                                        <p>{{$recentAppointment->start}} - {{$recentAppointment->end}}</p>
                                    </div>
                                    <div class="view_schedule">
                                        <a href="{{ route('user.messages') }}">
                                            <h5 class="mr-5">Message</h5>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @empty
                        <p>You have no recent appointments at the moment</p>
                    @endforelse
                </div>
            </div>
            <div class="messages">
                <h2 class="mb-20">Messages</h2>
                @if($chats->count() > 0)
                    @foreach($chats as $chat)
                        <div class="message">
                            <img
                                src="{{ auth()->user()->present()->avatar ? auth()->user()->present()->avatar  : url('assets/img/profile.png') }}"
                                alt=""/>
                            <div class="mgg">
                                <a href="{{route("user.chat",$chat->withUser->id)}}">
                                    <h5>
                                        {{$chat->withUser->getFullName()}}
                                    </h5>
                                </a>

                                <p class="otherP">
                                    @php
                                        $lastMessageIndex = $chat->messages->count();
                                        if($lastMessageIndex==0){
                                            $message = null;
                                        }else{
                                            $message = $chat->messages[$lastMessageIndex-1];
                                        }
                                    @endphp
                                    @if(!is_null($message))
                                        {{str()->limit($message->message,46,)}}
                                    @else
                                        Click the mentor or mentee to have a chat,happy connecting...
                                    @endif
                                </p>
                            </div>
                            <div class="mg-num">
                                @if(!is_null($message))
                                    <p>{{$message->created_at->diffForHumans()}}</p>
                                @endif
                                {{--                                <span>4</span>--}}
                            </div>
                        </div>
                    @endforeach
                @else
                    <div class="insight-placeholder">
                        <p>You haven't had any conversations yet</p>
                    </div>
                @endif
                <a href="{{ route('user.messages') }}"> View all messages</a>
            </div>
            <div class="resources">
                <div class="mb-60">
                    <h2 class="mb-20">Quicklinks</h2>
                    <a href="{{ route('user.assignments') }}">
                        <div class="resource mb-30">
                            <img src="{{ asset('assets/images/assigment.png') }}" alt=""/>
                            <div class="resourceText">
                                <h2>Assignments</h2>
                                <p>{{$upcomingAssignments}} assignment</p>
                            </div>
                            <span class="material-icons-sharp">arrow_right_alt</span>
                        </div>
                    </a>
                </div>
                <div class="">
                    <h2 class="mb-20">Resources</h2>
                    <a href="{{ route('user.resources.books') }}">
                        <div class="resource mb-30">
                            <img src="{{ asset('assets/images/book2.png') }}" alt=""/>
                            <div class="resourceText">
                                <h2>Books</h2>
                                <p>{{$booksCount ?? 0}} books</p>
                            </div>
                            <span class="material-icons-sharp">arrow_right_alt</span>
                        </div>
                    </a>
                    <a href="{{ route('user.resources.videos') }}">
                        <div class="resource">
                            <img src="{{ asset('assets/images/play_icon.png') }}" alt=""/>
                            <div class="resourceText">
                                <h2>Videos</h2>
                                <p>{{$videosCount ?? 0}} videos</p>
                            </div>
                            <div class="resource-arrow">
                                <span class="material-icons-sharp">arrow_right_alt</span>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
@endsection