adrema/app/View/Page/Layout.php

<?php

namespace App\View\Page;

use Illuminate\View\Component;

class Layout extends Component
{

    public function __construct(public string $pageClass = '', public string $title = '', public string $menu = '')
    {
        session()->put('title', $title);
        session()->put('menu', $menu);
    }

    public function userName(): string
    {
        return auth()->user()->firstname . ' ' . auth()->user()->lastname;
    }

    public function userAvatar(): string
    {
        return auth()->user()->getGravatarUrl();
    }

    public function render()
    {
        return <<<'HTML'
            <div class="grow flex flex-col" @refresh-page.window="$wire.$refresh">
                <div class="grow bg-gray-900 flex flex-col duration-300 navbar:ml-60">
                    <x-page::header :title="$title">
                        <x-slot:beforeTitle>
                            <a href="#" class="lg:hidden" wire:click.prevent="dispatch('toggle-sidebar')">
                                <x-ui::sprite src="menu" class="text-gray-100 w-5 h-5"></x-ui::sprite>
                            </a>
                        </x-slot:beforeTitle>
                        <x-slot:toolbar>
                            {{ $toolbar ?? ''}}
                        </x-slot:toolbar>
                        <x-slot:right>
                            {{ $right ?? '' }}
                            <div class="flex items-center space-x-2">
                                <div class="rounded-full overflow-hidden border-2 border-solid border-gray-300">
                                    <img src="{{ $userAvatar() }}" class="w-8 h-8 object-cover" />
                                </div>
                                <div class="text-gray-300"">{{ $userName() }}</div>
                            </div>
                        </x-slot:right>
                    </x-page::header>

                    <div class="grow flex flex-col {{$pageClass}}">
                        {{ $slot }}
                    </div>
                </div>
                <livewire:page.sidebar :mobile="true" />
            </div>
        HTML;
    }
}