@php

    $user_detail = \App\Helpers\Helpers::getUserRole();
    $userType = $user_detail->type_id ?? [];
    $userRoleName = $user_detail->role_name ?? [];
    $userTypeName = $user_detail->type_name ?? [];
@endphp

<nav class="navbar sticky-top navbar-light bg-white px-4 header">
    <div class="site-logo">
        <a class="navbar-brand" href="{{ route('resident.home') }}">
            <svg xmlns="http://www.w3.org/2000/svg" width="100" height="51" viewBox="0 0 64 51">
                <g id="Group_211" data-name="Group 211" transform="translate(-43 -7)">
                    <text id="LPR" transform="translate(75 45)" fill="#0d2e89" font-size="36"
                        font-family="Poppins-Bold, Poppins" font-weight="700">
                        <tspan x="-31" y="0">LPR</tspan>
                    </text>
                </g>
            </svg>
        </a>
    </div>
    <div class="profile-block rounded-circle d-flex align-items-center justify-content-center profile-icon">
        @php
            $profile_image = auth()->user()->profileImage()->first();
            $user = auth()->user();
        @endphp

        <div class="d-flex w-100 align-items-center">
            <a href="{{ route('resident.profile.view') }}">
                <img src="{{ !empty($profile_image->public_url) ? $profile_image->public_url : asset('assets/images/icons/profile-placeholder.svg') }}"
                    alt="profile" class="rounded-circle" width="35" height="35">
            </a>
            <span class="d-grid mx-3 text-left">
                <span class="text-nowrap">
                    {{ !empty($user->full_name) ? ucwords($user->full_name) : '-' }}
                </span>
                <small class="text-muted">
                    ({{ !empty($userRoleName) ? ucwords($userRoleName) : (!empty($userTypeName) ? ucwords($userTypeName) : '-') }})
                </small>
            </span>

            <a href="{{ route('resident.logout') }}" onclick="logoutConfirmation(event)">
                <img src="{{ asset('assets/images/icons/logout.svg') }}" alt="logout" width="35" height="35">
            </a>

        </div>
        {{-- <div class="dropstart">
            <a href="javascript:void(0)" class="dropdown-toggle text-decoration-none" type="button"
                id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
                <img src="{{ !empty($user->public_url) ? $user->public_url : asset('assets/images/icons/profile-placeholder.svg') }}"
                    alt="profile" width="35" height="35">
            </a>
            <div class="dropdown-menu profile_dropdown" aria-labelledby="dropdownMenuButton1">
                <a class="dropdown-item" href="javascript:void(0)">Profile</a>
                <a class="dropdown-item" href="javascript:void(0)"></a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="{{ route('logout') }}">Logout</a>
            </div>
        </div> --}}
    </div>
    {{-- <a href="" class="notification mx-3">notification</a> --}}
    {{-- <a href="" class="rounded-circle d-flex align-items-center justify-content-center profile-icon">
            <img src="{{asset('assets/images/icons/profile-placeholder.svg')}}" alt="profile">
        </a> --}}
</nav>

<script>
    function logoutConfirmation(event) {
        event.preventDefault();
        const logoutUrl = event.currentTarget.getAttribute('href');
        Swal.fire({
            title: "Are you sure?",
            text: "You want to logout!",
            icon: "warning",
            showCancelButton: true,
            confirmButtonText: "Yes, I am sure!",
            cancelButtonText: "No, cancel it!",
        }).then((result) => {
            if (result.isConfirmed) {
                window.location.href = logoutUrl;
            } else {
                event.preventDefault();
                return false;
            }
        });
    }
</script>