91 lines
4.7 KiB
PHP
91 lines
4.7 KiB
PHP
<?php
|
|
|
|
use Livewire\Volt\Component;
|
|
|
|
new class extends Component
|
|
{
|
|
public function logout(): void
|
|
{
|
|
auth()->guard('web')->logout();
|
|
|
|
session()->invalidate();
|
|
session()->regenerateToken();
|
|
|
|
$this->redirect('/', navigate: true);
|
|
}
|
|
}; ?>
|
|
|
|
<nav x-data="{ openProfile : false }" class="sticky top-0 z-40 lg:mx-auto lg:max-w-7xl lg:px-8 bg-nexi-primary dark:bg-nexi-primary-dark transition-colors duration-300">
|
|
<div class="flex h-16 items-center gap-x-4 border-b border-gray-200 px-4 shadow-sm sm:gap-x-6 sm:px-6 lg:px-0 lg:shadow-none">
|
|
<button type="button" class="-m-2.5 p-2.5 text-gray-700 lg:hidden" @click="sidebarOpen = true">
|
|
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
|
|
</svg>
|
|
</button>
|
|
|
|
<!-- Separator -->
|
|
<div class="h-6 w-px bg-gray-200 lg:hidden" aria-hidden="true"></div>
|
|
|
|
<div class="flex flex-1 gap-x-4 self-stretch lg:gap-x-6 flex-row-reverse">
|
|
|
|
<div class="flex items-center gap-x-4 lg:gap-x-6">
|
|
{{-- TODO: Hide this on mobile and put in under user menu? maybe move to side bar--}}
|
|
<x-darkmode/>
|
|
|
|
<!-- Separator -->
|
|
<div class="hidden lg:block lg:h-6 lg:w-px lg:bg-gray-200" aria-hidden="true"></div>
|
|
|
|
<!-- Profile dropdown -->
|
|
<div class="relative">
|
|
<button @click="openProfile = ! openProfile"
|
|
type="button"
|
|
class="-m-1.5 flex items-center p-1.5"
|
|
id="user-menu-button"
|
|
aria-expanded="false"
|
|
aria-haspopup="true">
|
|
<img class="h-8 w-8 rounded-full bg-gray-50" src="{{ auth()->user()->profile }}" alt="">
|
|
<span class="hidden lg:flex lg:items-center">
|
|
<span class="ml-4 text-base font-semibold leading-6 text-nexi-black dark:text-nexi-grey" aria-hidden="true"
|
|
x-data="{ firstname: '{{ auth()->user()->firstname }}', lastname: '{{ auth()->user()->lastname }}' }"
|
|
x-text="firstname + ' ' + lastname"
|
|
x-on:profile-updated.window="
|
|
firstname = $event.detail.firstname;
|
|
lastname = $event.detail.lastname;
|
|
"></span>
|
|
<svg class="ml-2 h-5 w-5 text-gray-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
|
|
<path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd" />
|
|
</svg>
|
|
</span>
|
|
</button>
|
|
|
|
<div class="absolute right-0 z-10 mt-2.5 w-32 origin-top-right rounded-md bg-nexi-primary dark:bg-nexi-primary-dark transition-colors duration-300 py-2 shadow-lg ring-1 ring-nexi-black/5 dark:ring-nexi-grey focus:outline-none"
|
|
role="menu"
|
|
aria-orientation="vertical"
|
|
aria-labelledby="user-menu-button"
|
|
tabindex="-1"
|
|
x-show="openProfile"
|
|
x-transition:enter="transition ease-out duration-100 transform opacity-0 scale-95"
|
|
x-transition:enter-start="transform opacity-0 scale-95"
|
|
x-transition:enter-end="transform opacity-100 scale-100"
|
|
x-transition:leave="transition ease-in duration-75 transform opacity-100 scale-100"
|
|
x-transition:leave-start="transform opacity-100 scale-100"
|
|
x-transition:leave-end="transform opacity-0 scale-95"
|
|
>
|
|
<div class="mt-3 space-y-1 text-sm">
|
|
<x-responsive-nav-link :href="route('profile')" wire:navigate>
|
|
{{ __('Profile') }}
|
|
</x-responsive-nav-link>
|
|
|
|
<button wire:click="logout" class="w-full text-left">
|
|
<x-responsive-nav-link>
|
|
{{ __('Log Out') }}
|
|
</x-responsive-nav-link>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|