From 5a685429c50ec3c2be0449ce21c4c41994fb83e5 Mon Sep 17 00:00:00 2001
From: Sergio Brighenti <sergio@brighenti.me>
Date: Mon, 26 Aug 2024 12:16:35 +0200
Subject: [PATCH] wip navbar

---
 core/app/View/Components/AppBrand.php         |  2 +-
 core/database/seeders/DatabaseSeeder.php      | 14 ++++-
 .../views/components/layouts/app.blade.php    | 59 +------------------
 .../layouts/navbar/menuitems.blade.php        |  7 +++
 .../layouts/navbar/navbar.blade.php           | 30 ++++++++++
 5 files changed, 50 insertions(+), 62 deletions(-)
 create mode 100644 core/resources/views/components/layouts/navbar/menuitems.blade.php
 create mode 100644 core/resources/views/components/layouts/navbar/navbar.blade.php

diff --git a/core/app/View/Components/AppBrand.php b/core/app/View/Components/AppBrand.php
index 5abbc27..b7e252b 100644
--- a/core/app/View/Components/AppBrand.php
+++ b/core/app/View/Components/AppBrand.php
@@ -25,7 +25,7 @@ class AppBrand extends Component
                 <a href="/" wire:navigate>
                     <!-- Hidden when collapsed -->
                     <div {{ $attributes->class(["hidden-when-collapsed"]) }}>
-                        <div class="flex items-center {{ $onTop ? 'flex-col justify-center' : 'gap-2 btn btn-link no-underline hover:no-underline' }}">
+                        <div class="flex items-center {{ $onTop ? 'flex-col justify-center' : 'gap-2 btn btn-link no-underline hover:no-underline flex-nowrap' }}">
                             <div class="avatar">
                                 <div class="{{ $onTop ? 'w-24' : 'w-12' }}">
                                     <img src="{{ asset('img/android-chrome-192x192.png') }}" />
diff --git a/core/database/seeders/DatabaseSeeder.php b/core/database/seeders/DatabaseSeeder.php
index ffa5dd9..1f17768 100644
--- a/core/database/seeders/DatabaseSeeder.php
+++ b/core/database/seeders/DatabaseSeeder.php
@@ -3,6 +3,7 @@
 namespace Database\Seeders;
 
 use App\Models\User;
+
 // use Illuminate\Database\Console\Seeds\WithoutModelEvents;
 use Illuminate\Database\Seeder;
 
@@ -14,9 +15,16 @@ class DatabaseSeeder extends Seeder
     public function run(): void
     {
         User::factory()->create([
-            'name' => 'Test User',
-            'email' => 'a@a',
-            'password' => bcrypt('aaa'),
+            'name' => 'Sergio Brighenti',
+            'email' => 'sergio@brighenti.me',
+            'password' => bcrypt('xxx'),
+            'is_admin' => true,
+        ]);
+
+        User::factory()->create([
+            'name' => 'John Doe',
+            'email' => 'a@a.a',
+            'password' => bcrypt('xxx'),
         ]);
     }
 }
diff --git a/core/resources/views/components/layouts/app.blade.php b/core/resources/views/components/layouts/app.blade.php
index 5d5e3eb..9612367 100644
--- a/core/resources/views/components/layouts/app.blade.php
+++ b/core/resources/views/components/layouts/app.blade.php
@@ -1,64 +1,7 @@
 @extends('components.layouts.base')
 
 @section('body')
-    <div class="navbar bg-base-100">
-        <div class="navbar-start">
-            <div class="dropdown">
-                <div tabindex="0" role="button" class="btn btn-ghost lg:hidden">
-                    <svg
-                        xmlns="http://www.w3.org/2000/svg"
-                        class="h-5 w-5"
-                        fill="none"
-                        viewBox="0 0 24 24"
-                        stroke="currentColor">
-                        <path
-                            stroke-linecap="round"
-                            stroke-linejoin="round"
-                            stroke-width="2"
-                            d="M4 6h16M4 12h8m-8 6h16"/>
-                    </svg>
-                </div>
-                <ul
-                    tabindex="0"
-                    class="menu menu-sm dropdown-content bg-base-100 rounded-box z-[1] mt-3 w-52 p-2 shadow">
-                    <li><a>Item 1</a></li>
-                    <li>
-                        <a>Parent</a>
-                        <ul class="p-2">
-                            <li><a>Submenu 1</a></li>
-                            <li><a>Submenu 2</a></li>
-                        </ul>
-                    </li>
-                    <li><a>Item 3</a></li>
-                </ul>
-            </div>
-            <x-app-brand/>
-        </div>
-        <div class="navbar-center hidden lg:flex">
-            <x-menu activate-by-route class="menu-horizontal z-50 flex items-center">
-                <x-menu-item title="Home" icon="o-home" link="###"/>
-                <x-menu-item title="Messages" icon="o-envelope" link="###"/>
-                <x-menu-sub title="Settings" icon="o-cog-6-tooth">
-                    <x-menu-item title="Wifi" icon="o-wifi" link="####"/>
-                    <x-menu-item title="Wifi" icon="o-wifi" link="####"/>
-                    <x-menu-item title="Wifi" icon="o-wifi" link="####"/>
-                    <x-menu-item title="Wifi" icon="o-wifi" link="####"/>
-                    <x-menu-item title="Archives" icon="o-archive-box" link="####"/>
-                </x-menu-sub>
-            </x-menu>
-        </div>
-        <div class="navbar-end mr-2">
-            @if($user = auth()->user())
-                <x-dropdown>
-                    <x-slot:trigger>
-                        <x-avatar :image="$user->avatar" :title="$user->username" :subtitle="$user->name"
-                                  class="!w-10"/>
-                    </x-slot:trigger>
-                    <x-menu-item icon="o-power" title="Logout" link="javascript:document.getElementById('logout-form').submit();" no-wire-navigate/>
-                </x-dropdown>
-            @endif
-        </div>
-    </div>
+    <x-layouts.navbar.navbar/>
 
     <x-main with-nav full-width>
         <x-slot:content>
diff --git a/core/resources/views/components/layouts/navbar/menuitems.blade.php b/core/resources/views/components/layouts/navbar/menuitems.blade.php
new file mode 100644
index 0000000..3ae023c
--- /dev/null
+++ b/core/resources/views/components/layouts/navbar/menuitems.blade.php
@@ -0,0 +1,7 @@
+<x-menu-item title="Gallery" icon="o-photo" link="###"/>
+<x-menu-item title="Upload" icon="o-arrow-up-tray" link="###"/>
+<x-menu-sub title="Settings" icon="o-adjustments-vertical">
+    <x-menu-item title="Wifi" icon="o-wifi" link="####"/>
+    <x-menu-item title="fffs" icon="o-wifi" link="####"/>
+    <x-menu-item title="Archives" icon="o-archive-box" link="####"/>
+</x-menu-sub>
diff --git a/core/resources/views/components/layouts/navbar/navbar.blade.php b/core/resources/views/components/layouts/navbar/navbar.blade.php
new file mode 100644
index 0000000..1e0df1c
--- /dev/null
+++ b/core/resources/views/components/layouts/navbar/navbar.blade.php
@@ -0,0 +1,30 @@
+<div class="navbar bg-base-100">
+    <div class="navbar-start">
+        <x-dropdown>
+            <x-slot:trigger>
+                <x-button icon="o-bars-3" class="btn btn-ghost btn-sm lg:hidden" />
+            </x-slot:trigger>
+            @include('components.layouts.navbar.menuitems')
+        </x-dropdown>
+        <x-app-brand/>
+    </div>
+    <div class="navbar-center hidden lg:flex">
+        <x-menu activate-by-route class="menu-horizontal z-50 flex items-center">
+            @include('components.layouts.navbar.menuitems')
+        </x-menu>
+    </div>
+    <div class="navbar-end">
+        @if($user = auth()->user())
+            <x-dropdown no-x-anchor right>
+                <x-slot:trigger>
+                    <div class="btn btn-ghost">
+                        <x-avatar :image="$user->avatar" :title="$user->username" :subtitle="$user->name" class="!w-10"/>
+                    </div>
+
+                </x-slot:trigger>
+                <x-menu-item icon="o-user" title="Profile" link="#"/>
+                <x-menu-item icon="o-power" title="Quit" link="javascript:document.getElementById('logout-form').submit();" no-wire-navigate/>
+            </x-dropdown>
+        @endif
+    </div>
+</div>