Merge branch 'main' into feature/user-interactions

app/Http/Controllers/AuthenticatedUserController.php

@@ -31,8 +31,7 @@ public function store(AuthenticateUserRequest $request)
 
             $route = match ($user->role) {
                 UserTypes::Admin->value => 'admin.dashboard',
-                UserTypes::Broker->value => 'broker.dashboard',
+                UserTypes::Broker->value, UserTypes::User->value => 'explore',
-                UserTypes::User->value => 'user.dashboard',
             };
 
             return to_route($route);

app/Http/Controllers/Broker/BrokerProfileController.php

@@ -6,7 +6,6 @@
 use App\Http\Requests\StoreBrokerProfileRequest;
 use App\Models\Broker;
 use App\Models\User;
-use Illuminate\Http\Request;
 use Illuminate\Support\Facades\DB;
 use Illuminate\Support\Facades\Log;
 use Illuminate\Support\Str;
@@ -83,6 +82,7 @@ public function update(StoreBrokerProfileRequest $request, User $profile)
                 ->with('success', 'Profile updated successfully.');
         } catch (\Throwable $e) {
             Log::error('Broker Profile Update Failed: '.$e->getMessage(), $e->getTrace());
+
             return back()->withInput()->with('error', 'Something went wrong.');
         }
     }

app/Http/Controllers/ExplorePageController.php

@@ -1,15 +1,17 @@
 <?php
 
-namespace App\Http\Controllers\User;
+namespace App\Http\Controllers;
 
-use App\Http\Controllers\Controller;
+use App\Enums\UserTypes;
 use App\Models\Deal;
+use Illuminate\Support\Facades\Auth;
 
-class UserDashboardController extends Controller
+class ExplorePageController extends Controller
 {
-    public function index()
+    public function __invoke()
     {
-        return view('dashboards.user.index')
+        return view('explore')
+            ->with('profileLink', $this->profileLink())
             ->with('deals', $this->deals());
     }
 
@@ -38,4 +40,18 @@ protected function deals()
             ->latest()
             ->paginate();
     }
+
+    /**
+     * Determines the link to the user's profile dashboard
+     * based on the user's role.
+     *
+     * @return string The URL for the user's dashboard.
+     */
+    protected function profileLink()
+    {
+        $user = Auth::user();
+        if ($user->role === UserTypes::Broker->value) {
+            return route('broker.profile.show', $user);
+        }
+    }
 }

app/Http/Middleware/HasRole.php

@@ -13,9 +13,9 @@ class HasRole
      *
      * @param  \Closure(\Illuminate\Http\Request): (\Symfony\Component\HttpFoundation\Response)  $next
      */
-    public function handle(Request $request, Closure $next, string $role): Response
+    public function handle(Request $request, Closure $next, ...$roles): Response
     {
-        if ($request->user()->role === $role) {
+        if (in_array($request->user()->role, $roles)) {
             return $next($request);
         } else {
             abort('401');

app/Http/Requests/StoreBrokerProfileRequest.php

@@ -27,7 +27,7 @@ public function rules(): array
             'bio' => 'required|string|min:10|max:255',
             'email' => ['required', 'email', 'max:255', Rule::unique('users')->ignore($this->user()->id)],
             'phone' => 'required|string|min:10|max:255',
-            'location' => 'required|string|min:3|max:255'
+            'location' => 'required|string|min:3|max:255',
         ];
     }
 }

app/Models/User.php

@@ -3,7 +3,6 @@
 namespace App\Models;
 
 // use Illuminate\Contracts\Auth\MustVerifyEmail;
-use App\Enums\UserTypes;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\HasMany;

resources/css/app.css

@@ -18,7 +18,7 @@ @layer components{
     @import "./button.css";
 
     .wrapper {
-        @apply px-4 md:px-12
+        @apply px-4 md:px-8
     }
 
 

resources/js/menu.js

@@ -0,0 +1,6 @@
+function showMenu(e){
+    const menu = e.nextElementSibling;
+    menu.classList.toggle('invisible');
+}
+
+document.showMenu = showMenu;

resources/js/sidebar.js

@@ -0,0 +1,26 @@
+const sidebar = document.getElementById('sidebar');
+const sidebarWrapper = document.getElementById('sidebarWrapper');
+const openBtn = document.getElementById('openSidebarBtn')
+const closeBtn = document.getElementById('closeSidebarBtn')
+
+const classList = ['md:w-50', 'lg:w-60'];
+
+openBtn.addEventListener('click', () => openSidebar());
+closeBtn.addEventListener('click', () => closeSidebar());
+
+function openSidebar() {
+    classList.forEach(cl => sidebarWrapper.classList.toggle(cl))
+
+    sidebar.classList.toggle('hidden');
+
+    closeBtn.classList.toggle('hidden')
+    openBtn.classList.toggle('hidden')
+}
+
+function closeSidebar() {
+    classList.forEach(cl => sidebarWrapper.classList.toggle(cl))
+    openBtn.classList.toggle('hidden')
+    closeBtn.classList.toggle('hidden')
+
+    sidebar.classList.toggle('hidden');
+}

resources/views/components/dashboard/broker/layout.blade.php

@@ -0,0 +1,26 @@
+@props(['title' => ''])
+<x-layout :title="$title">
+    <div class="flex h-screen overflow-hidden">
+        <x-dashboard.broker.sidebar class="hidden shrink-0 md:w-50 lg:w-60 md:block md:h-screen"
+                                    active-class="bg-linear-120 from-[#1a55ed] to-[#9b1cff] text-white"/>
+        <section
+            class=" flex flex-col space-y-8 bg-[#F9FAFB] overflow-y-auto h-screen w-full">
+
+            {{$heading ?? ''}}
+
+            @session('success')
+            <div class="wrapper">
+                <x-ui.alert variant="success">{{$value}}</x-ui.alert>
+            </div>
+            @endsession
+
+            @session('error')
+            <div class="wrapper">
+                <x-ui.alert variant="error">{{$value}}</x-ui.alert>
+            </div>
+            @endsession
+            {{$slot}}
+        </section>
+    </div>
+    @vite('resources/js/nav-menu.js')
+</x-layout>

resources/views/components/dashboard/broker/navbar.blade.php

@@ -1,32 +1,12 @@
 <nav class="flex justify-between items-center wrapper py-6 shadow">
     <div class="logo flex space-x-2 items-center">
-        <x-logo/>
+        <x-logo class="md:hidden" />
         <div class="">
             <a href="" class="font-bold text-2xl">Broker Dashboard</a>
             <p class="text-sm text-accent-600">Manage your deals and listings</p>
         </div>
     </div>
 
-    <!-- desktop menu -->
-
-    <div class="nav-ui buttons space-x-4 font-medium hidden md:flex ">
-        <a href="{{route('broker.profile.show', auth()->user()->id)}}" class="ui-btn flex border space-x-3 border-gray-200 items-center">
-            <x-heroicon-o-user class="w-6"/>
-            <p>Profile</p>
-        </a>
-        <a href="{{route('broker.deals.create')}}" class="ui-btn ui-btn-neutral flex space-x-3 items-center">
-            <x-heroicon-o-plus class="w-6"/>
-            <p>Create Deal</p>
-        </a>
-        <form method="post" action="{{route('logout')}}">
-            @csrf
-            @method('delete')
-            <x-ui.button>
-                <x-heroicon-o-arrow-right-start-on-rectangle class="w-6"/>
-            </x-ui.button>
-        </form>
-    </div>
-
     <!-- mobile menu btn-->
     <x-ui.button class="md:hidden" id="openBtn">
         <x-heroicon-o-bars-3 class="w-8"/>
@@ -44,11 +24,11 @@
     </div>
     <div class="nav-links mb-10">
         <ul class="flex flex-col space-y-8 text-accent-600">
-            <a href="" class="ui-btn flex border space-x-3 border-gray-200 items-center">
+            <a href="{{route('broker.profile.show', auth()->user())}}" class="ui-btn flex border space-x-3 border-gray-200 items-center">
                 <x-heroicon-o-user class="w-6"/>
                 <p>Profile</p>
             </a>
-            <a href="" class="ui-btn ui-btn-neutral flex border space-x-3 items-center">
+            <a href="{{route('broker.deals.create')}}" class="ui-btn ui-btn-neutral flex border space-x-3 items-center">
                 <x-heroicon-o-plus class="w-6"/>
                 <p>Create Deal</p>
             </a>

resources/views/components/dashboard/broker/sidebar/index.blade.php

@@ -0,0 +1,59 @@
+@props(['activeClass' => 'bg-gray-100 text-gray-900'])
+<div id="sidebarWrapper" {{$attributes->merge([ 'class' => 'border-r border-r-gray-300 '])}}>
+    <div class="hidden md:flex h-screen items-center">
+        <div id="sidebar" class="flex flex-col p-4 pt-6 justify-between font-medium w-full h-full">
+            <div class="">
+                <div class="flex space-x-3 border-b border-b-gray-300 pb-6">
+                    <x-logo/>
+                    <div class="">
+                        <p class="text-2xl font-bold">DealHub</p>
+                        <p class="text-accent-600 text-sm">Broker Panel</p>
+                    </div>
+                </div>
+                <div class="pt-6 flex flex-col space-y-3">
+                    <x-dashboard.broker.sidebar.item :link="route('broker.dashboard')">
+                        <x-heroicon-o-squares-2x2 class="w-5"/>
+                        <p>Dashboard</p>
+                    </x-dashboard.broker.sidebar.item>
+
+                    <x-dashboard.broker.sidebar.item :link="route('broker.deals.create')">
+                        <x-heroicon-o-plus class="w-5"/>
+                        <p>Create Deals</p>
+                    </x-dashboard.broker.sidebar.item>
+
+                    <x-dashboard.broker.sidebar.item :link="route('broker.deals.index')">
+                        <x-heroicon-o-document-text class="w-5"/>
+                        <p>All Deals</p>
+                    </x-dashboard.broker.sidebar.item>
+                </div>
+            </div>
+
+            <div class="">
+                <x-dashboard.broker.sidebar.item :link="route('broker.profile.show', auth()->user()->id)">
+                    <x-heroicon-o-user class="w-5"/>
+                    <p>Profile</p>
+                </x-dashboard.broker.sidebar.item>
+
+                <form method="post" action="{{route('logout')}}">
+                    @csrf
+                    @method('delete')
+                    <button class="py-3 px-4">
+                        <div class="flex space-x-2 items-center text-red-500">
+                            <x-heroicon-o-arrow-right-start-on-rectangle class="w-6"/>
+                            <p>Logout</p>
+                        </div>
+                    </button>
+                </form>
+            </div>
+        </div>
+
+        {{-- Open / Close button--}}
+        <div class="text-gray-500 cursor-pointer hover:text-gray-900">
+            <x-heroicon-c-chevron-left id="closeSidebarBtn" class="w-4"/>
+            <x-heroicon-c-chevron-right id="openSidebarBtn" class="w-4 hidden"/>
+        </div>
+    </div>
+</div>
+@vite(['resources/js/sidebar.js'])
+
+

resources/views/components/dashboard/broker/sidebar/item.blade.php

@@ -0,0 +1,5 @@
+@props([ 'link' => ''])
+@aware(['activeClass' => 'bg-gray-100 text-gray-900'])
+<a href="{{$link}}" {{$attributes->class(["flex space-x-3 items-center py-3 px-4 rounded-xl", $activeClass => url()->current() == $link])}} >
+    {{$slot}}
+</a>

resources/views/components/dashboard/page-heading.blade.php

@@ -1,5 +1,5 @@
 @props(['title' => '', 'description' => '', 'backLink' => ''])
-<section class="flex space-x-6 items-center justify-between wrapper py-6 shadow">
+<section class="flex space-x-6 items-center justify-between wrapper py-6 shadow w-full">
     <div class="flex space-x-6 items-center">
         @if($backLink !== '')
             <div class="">

resources/views/components/icon-square.blade.php

@@ -1,10 +1,11 @@
-@props(['variant' => ''])
+@props(['variant' => 'ghost'])
 @php
     $variants = [
         'blue' => "bg-blue-100 text-blue-700",
         'purple' => "bg-purple-100 text-purple-700",
         'pink' => "bg-pink-100 text-pink-700",
         'green' => "bg-green-100 text-green-700",
+        'ghost' => 'bg-gray-100 text-gray-900'
     ]
 @endphp
 <div class="p-4 {{$variants[$variant]}} w-fit rounded-xl">

resources/views/components/navbar.blade.php

@@ -8,7 +8,7 @@
     <div class="nav-links  hidden md:block">
         <ul class="flex space-x-8 text-accent-600">
             <x-nav-links :link="route('home')" name="Home"/>
-            <x-nav-links :link="route('home')" name="Explore deals"/>
+            <x-nav-links :link="route('explore')" name="Explore deals"/>
             <x-nav-links :link="route('home')" name="About"/>
             <x-nav-links :link="route('home')" name="Contact"/>
         </ul>

resources/views/components/ui/alert.blade.php

@@ -8,7 +8,7 @@
 
 $variantClasses = $variants[$variant];
 @endphp
-<div class="alert flex items-center space-x-4 py-2 px-4 rounded-lg text-xs font-bold {{$variantClasses}} ">
+<div class="wrapper alert flex items-center space-x-4 py-2 px-4 rounded-lg text-xs font-bold {{$variantClasses}} ">
     <div class="flex-1">
         {{$slot}}
     </div>

resources/views/components/ui/button.blade.php

@@ -2,7 +2,8 @@
 @php
     $variants = [
         'neutral' => 'bg-primary-600 text-white',
-        'red' => 'bg-red-500 text-white'
+        'red' => 'bg-red-500 text-white',
+        'ghost' => 'bg-gray-200 text-gray-900'
     ];
 
     $variantClass = $variants[$variant] ?? '';

resources/views/dashboards/broker/deals/create.blade.php

@@ -1,18 +1,23 @@
-<x-layout title="Create a new deal">
+<x-dashboard.broker.layout title="Create a new deal">
+
+    <x-slot:heading>
         <x-dashboard.page-heading
             title="Create New Deal"
             description="Share a new opportunity with the community"
             :back-link="route('broker.dashboard')"
         />
-    <div class="flex items-center justify-center mt-8">
+    </x-slot:heading>
 
-        <x-dashboard.card class="w-8/12">
+    <div class="flex items-center justify-center mb-8">
+        <x-dashboard.card class="w-11/12 md:w-8/12">
             <h3 class="text-md font-bold">Deal Information</h3>
-            <form method="post" enctype="multipart/form-data" action="{{route('broker.deals.store')}}" class="flex flex-col space-y-8 mt-4">
+            <form method="post" enctype="multipart/form-data" action="{{route('broker.deals.store')}}"
+                  class="flex flex-col space-y-8 mt-4">
                 @csrf
                 <x-ui.input name="title" label="Deal Title" required placeholder="e.g., Luxury Apartment Downtown"/>
 
-                <x-ui.select :options="$categories" name="deal_category_id" label-key="name" value-key="id" label="Category"
+                <x-ui.select :options="$categories" name="deal_category_id" label-key="name" value-key="id"
+                             label="Category"
                              placeholder="Select a category" required/>
 
                 <x-ui.textarea name="description" label="Description" required
@@ -29,9 +34,10 @@
 
                 <div class="grid grid-cols-12 w-full space-x-4">
                     <x-ui.button variant="neutral" class="col-span-10">Submit</x-ui.button>
-                    <a href="{{route('broker.dashboard')}}" class="ui-btn border border-accent-600/20 col-span-2">Cancel</a>
+                    <a href="{{route('broker.dashboard')}}"
+                       class="ui-btn border border-accent-600/20 col-span-2">Cancel</a>
                 </div>
             </form>
         </x-dashboard.card>
     </div>
-</x-layout>
+</x-dashboard.broker.layout>

resources/views/dashboards/broker/deals/edit.blade.php

@@ -1,27 +1,35 @@
-<x-layout title="Edit deal">
+<x-dashboard.broker.layout title="Edit deal">
+
+    <x-slot:heading>
         <x-dashboard.page-heading
             title="Edit Deal"
             description="Modify your existing deal"
             :back-link="route('broker.dashboard')"
         />
+    </x-slot:heading>
+
     <div class="flex items-center justify-center mt-8">
 
-        <x-dashboard.card class="w-8/12">
+        <x-dashboard.card class="w-11/12 md:w-8/12">
             <h3 class="text-md font-bold">Deal Information</h3>
-            <form method="post" enctype="multipart/form-data" action="{{route('broker.deals.update', $deal)}}" class="flex flex-col space-y-8 mt-4">
+            <form method="post" enctype="multipart/form-data" action="{{route('broker.deals.update', $deal)}}"
+                  class="flex flex-col space-y-8 mt-4">
                 @csrf
                 @method('PATCH')
 
-                <x-ui.input name="title" label="Deal Title" :value="$deal->title" required placeholder="e.g., Luxury Apartment Downtown"/>
+                <x-ui.input name="title" label="Deal Title" :value="$deal->title" required
+                            placeholder="e.g., Luxury Apartment Downtown"/>
 
-                <x-ui.select :options="$categories" :selected="$deal->deal_category_id" name="deal_category_id" label-key="name" value-key="id" label="Category"
+                <x-ui.select :options="$categories" :selected="$deal->deal_category_id" name="deal_category_id"
+                             label-key="name" value-key="id" label="Category"
                              placeholder="Select a category" required/>
 
                 <x-ui.textarea :value="$deal->description" name="description" label="Description" required
                                placeholder="Describe your deal in detail..."/>
 
 
-                <x-ui.image-input name="image" label="Upload image" allowed="jpg,png" size="10" :value="asset('storage/'.$deal->image)"/>
+                <x-ui.image-input name="image" label="Upload image" allowed="jpg,png" size="10"
+                                  :value="asset('storage/'.$deal->image)"/>
 
                 <x-ui.input
                     :value="$deal->link"
@@ -33,9 +41,10 @@
 
                 <div class="grid grid-cols-12 w-full space-x-4">
                     <x-ui.button variant="neutral" class="col-span-10">Update</x-ui.button>
-                    <a href="{{route('broker.dashboard')}}" class="ui-btn border border-accent-600/20 col-span-2">Cancel</a>
+                    <a href="{{route('broker.dashboard')}}"
+                       class="ui-btn border border-accent-600/20 col-span-2">Cancel</a>
                 </div>
             </form>
         </x-dashboard.card>
     </div>
-</x-layout>
+</x-dashboard.broker.layout>

resources/views/dashboards/broker/index.blade.php

@@ -1,19 +1,7 @@
-<x-layout title="Broker Dashboard">
+<x-dashboard.broker.layout title="Broker Dashboard">
-    <section class="flex flex-col space-y-8 bg-[#F9FAFB]">
+    <x-slot:heading>
         <x-dashboard.broker.navbar/>
-
+    </x-slot:heading>
-        <div class="wrapper">
-            @session('success')
-            <x-ui.alert variant="success">{{$value}}</x-ui.alert>
-            @endsession
-
-            @session('error')
-            <x-ui.alert variant="error">{{$value}}</x-ui.alert>
-            @endsession
-        </div>
-
     <x-dashboard.broker.stats :list_count="$deals->count()"/>
     <x-dashboard.broker.listing :deals="$deals"/>
-    </section>
+</x-dashboard.broker.layout>
-    @vite('resources/js/nav-menu.js')
-</x-layout>

resources/views/dashboards/broker/profile/edit.blade.php

@@ -1,14 +1,16 @@
-<x-layout title="Edit Broker Profile">
+<x-dashboard.broker.layout title="Edit Broker Profile">
+    <x-slot:heading>
         <x-dashboard.page-heading
             title="Edit Profile"
             description="Modify your profile details"
             :back-link="route('broker.profile.show', $profile)"
         />
-    <div class="flex items-center justify-center mt-8">
+    </x-slot:heading>
-
+    <div class="flex items-center justify-center">
         <x-dashboard.card class="w-8/12">
             <h3 class="text-md font-bold">Profile Information</h3>
-            <form method="post" enctype="multipart/form-data" action="{{route('broker.profile.update', $profile)}}" class="flex flex-col space-y-8 mt-4">
+            <form method="post" enctype="multipart/form-data" action="{{route('broker.profile.update', $profile)}}"
+                  class="flex flex-col space-y-8 mt-4">
                 @csrf
                 @method('PATCH')
 
@@ -17,17 +19,21 @@
                 <x-ui.textarea :value="$broker->bio" name="bio" label="Bio" required
                                placeholder="Describe yourself in detail..."/>
 
-                <x-ui.input name="email" label="Email" :value="$profile->email" required placeholder="example@email.com"/>
+                <x-ui.input name="email" label="Email" :value="$profile->email" required
+                            placeholder="example@email.com"/>
 
                 <x-ui.input name="phone" label="Phone" :value="$broker->phone" required placeholder="+00 00000 00000"/>
 
-                <x-ui.input name="location" label="Location" :value="$broker->location" required placeholder="Kolkata, India"/>
+                <x-ui.input name="location" label="Location" :value="$broker->location" required
+                            placeholder="Kolkata, India"/>
 
                 <div class="grid grid-cols-12 w-full space-x-4">
                     <x-ui.button variant="neutral" class="col-span-10">Update</x-ui.button>
-                    <x-ui.button :link="route('broker.profile.show', $profile)" class=" border border-accent-600/20 col-span-2">Cancel</x-ui.button>
+                    <x-ui.button :link="route('broker.profile.show', $profile)"
+                                 class=" border border-accent-600/20 col-span-2">Cancel
+                    </x-ui.button>
                 </div>
             </form>
         </x-dashboard.card>
     </div>
-</x-layout>
+</x-dashboard.broker.layout>

resources/views/dashboards/broker/profile/show.blade.php

@@ -1,35 +1,30 @@
-<x-layout title="Profile">
+<x-dashboard.broker.layout title="Profile">
+
+    <x-slot:heading>
         <x-dashboard.page-heading
             title="Broker Profile"
             description="Public profile information"
             :back-link="route('broker.dashboard')"
         >
             <x-slot:end>
-            <x-ui.button :link="route('broker.profile.edit', auth()->user()->id)" class="border border-accent-600/40">
+                <x-ui.button :link="route('broker.profile.edit', auth()->user()->id)"
+                             class="border border-accent-600/40">
                     <p class="hidden sm:block">Edit profile</p>
                     <x-heroicon-o-pencil-square class="w-4 stroke-2 sm:hidden"/>
                 </x-ui.button>
             </x-slot:end>
         </x-dashboard.page-heading>
-
+    </x-slot:heading>
-
-    <div class="wrapper mt-6">
-        @session('success')
-        <x-ui.alert variant="success">{{$value}}</x-ui.alert>
-        @endsession
-
-        @session('error')
-        <x-ui.alert variant="error">{{$value}}</x-ui.alert>
-        @endsession
-    </div>
 
     <div class="flex items-center justify-center">
-        <div class="flex items-center justify-center mt-8 w-11/12 md:-w-10/12">
+        <div class="flex items-center justify-center w-11/12 md:w-10/12">
             <x-dashboard.card class="w-full">
                 <div class="grid grid-cols-8 gap-6">
 
-                    <div class="col-span-8 place-self-start md:col-span-2 lg:col-span-1 flex items-center justify-center w-full">
+                    <div
-                        <div class="w-25 h-25 rounded-xl bg-linear-150 from-[#305afc] to-[#941dfb] text-5xl text-white flex justify-center items-center">
+                        class="col-span-8 place-self-start md:col-span-2 lg:col-span-1 flex items-center justify-center w-full">
+                        <div
+                            class="w-25 h-25 rounded-xl bg-linear-150 from-[#305afc] to-[#941dfb] text-5xl text-white flex justify-center items-center">
                             {{$initials}}
                         </div>
                     </div>
@@ -39,7 +34,8 @@
                         <div class="">
                             <p class="text-3xl font-bold">{{$name ?? 'Name'}}</p>
                             <div class="flex space-x-1 mt-2">
-                                <x-ui.button-sm variant="neutral">{{$verified ? 'Verified Broker' : 'Not Verified'}}</x-ui.button-sm>
+                                <x-ui.button-sm
+                                    variant="neutral">{{$verified ? 'Verified Broker' : 'Not Verified'}}</x-ui.button-sm>
                                 <x-heroicon-s-star class="ml-2 w-4 fill-amber-300"/>
                                 <p>4.8</p>
                             </div>
@@ -51,19 +47,19 @@
 
                         <div class="grid md:grid-cols-2 md:grid-rows-2 gap-3">
                             <div class="fill-accent-600/70 text-accent-600/70 flex space-x-4 text-sm items-center">
-                                <x-heroicon-o-envelope class="w-4" />
+                                <x-heroicon-o-envelope class="w-4"/>
                                 <p>{{$email ?? 'email is empty'}}</p>
                             </div>
                             <div class="fill-accent-600/70 text-accent-600/70 flex space-x-4 text-sm items-center">
-                                <x-heroicon-o-phone class="w-4" />
+                                <x-heroicon-o-phone class="w-4"/>
                                 <p>{{$phone ?? 'phone is empty'}}</p>
                             </div>
                             <div class="fill-accent-600/70 text-accent-600/70 flex space-x-4 text-sm items-center">
-                                <x-heroicon-o-map class="w-4" />
+                                <x-heroicon-o-map class="w-4"/>
                                 <p>{{$location ?? 'location is empty'}}</p>
                             </div>
                             <div class="fill-accent-600/70 text-accent-600/70 flex space-x-4 text-sm items-center">
-                                <x-heroicon-o-arrow-trending-up class="w-4" />
+                                <x-heroicon-o-arrow-trending-up class="w-4"/>
                                 <p>Joined {{$joinDate ?? 'date is empty'}}</p>
                             </div>
                         </div>
@@ -72,4 +68,4 @@
             </x-dashboard.card>
         </div>
     </div>
-</x-layout>
+</x-dashboard.broker.layout>

resources/views/dashboards/user/index.blade.php

@@ -1,64 +0,0 @@
-@php
-    $categories  = [0 => ['name' => 'All Categories', 'value' => '0']];
-@endphp
-<x-layout title="Deals">
-    <x-dashboard.page-heading
-        title="Explore Deals"
-        description="Discover trusted recommendation"
-    >
-        <x-slot:end>
-            <form method="post" action="{{route('logout')}}">
-                @csrf
-                @method('delete')
-                <x-ui.button class="flex space-x-3 hover:bg-gray-100 hover:border-gray-300 hover:border">
-                    <x-heroicon-o-arrow-right-start-on-rectangle class="w-4 stroke-2 mr-2"/>
-                    <p class="hidden sm:block">Logout</p>
-                </x-ui.button>
-            </form>
-        </x-slot:end>
-    </x-dashboard.page-heading>
-    <section class="flex flex-col space-y-8 bg-[#F9FAFB] wrapper mt-2 pb-6">
-
-        <div>
-            @session('success')
-            <x-ui.alert variant="success">{{$value}}</x-ui.alert>
-            @endsession
-
-            @session('error')
-            <x-ui.alert variant="error">{{$value}}</x-ui.alert>
-            @endsession
-        </div>
-
-        <x-dashboard.card>
-            <div class="flex gap-4 flex-col sm:flex-row">
-                <x-ui.input class="flex-1" name="search" placeholder="Search deals, services, places"/>
-                <x-ui.select name="category" :options="$categories" value-key="value" label-key="name" />
-            </div>
-        </x-dashboard.card>
-
-        <x-ui.toggle-button-group >
-            <x-ui.toggle-button active>
-                <a href="" class="flex items-center px-2 py-1 space-x-2">
-                    <x-heroicon-o-clock class="w-4 stroke-2" />
-                    <p class="font-bold text-xs  sm:text-sm md:text-md">All Deals</p>
-                </a>
-            </x-ui.toggle-button>
-
-            <x-ui.toggle-button>
-                <a href="" class="flex items-center px-2 py-1 space-x-2">
-                    <x-heroicon-o-arrow-trending-up class="w-4 stroke-2" />
-                    <p class="font-bold text-xs sm:text-sm md:text-md">Most Liked</p>
-                </a>
-            </x-ui.toggle-button>
-
-            <x-ui.toggle-button>
-                <a href="" class="flex items-center px-2 py-1 space-x-2">
-                    <x-heroicon-o-star class="w-4 stroke-2" />
-                    <p class="font-bold text-xs sm:text-sm md:text-md">Most Clicked</p>
-                </a>
-            </x-ui.toggle-button>
-        </x-ui.toggle-button-group>
-
-      <x-dashboard.user.listing :deals="$deals" />
-    </section>
-</x-layout>

resources/views/explore.blade.php

@@ -0,0 +1,92 @@
+@php
+    $categories  = [0 => ['name' => 'All Categories', 'value' => '0']];
+@endphp
+<x-layout title="Deals">
+    <x-dashboard.page-heading
+        title="Explore Deals"
+        description="Discover trusted recommendation"
+    >
+        <x-slot:end>
+            <div class="flex items-center">
+                <div class="relative group">
+                    <x-ui.button icon="user-circle" class="cursor-pointer" onclick="showMenu(this)"></x-ui.button>
+                    <ul class="menu invisible  group-hover:visible w-48 absolute right-0  bg-white border border-gray-300 rounded-md shadow-xl py-2 text-accent-600">
+                        <li class="py-2 px-4 hover:bg-gray-100 hover:text-gray-900 hover:cursor-pointer hover:font-bold">
+                            <a href="{{$profileLink}}" class="flex space-x-4">
+                                <div class="p-1 bg-gray-200 rounded-xl text-gray-900">
+                                    <x-heroicon-o-user class="w-4"/>
+                                </div>
+                                <p>Profile</p>
+                            </a>
+                        </li>
+
+                        @if(auth()->user()->role === \App\Enums\UserTypes::Broker->value)
+                            <li class="py-2 px-4 hover:bg-gray-100 hover:text-gray-900 hover:cursor-pointer hover:font-bold">
+                                <a href="{{route('broker.dashboard')}}" class="flex space-x-4">
+                                    <div class="p-1 bg-gray-200 rounded-xl text-gray-900">
+                                        <x-heroicon-o-adjustments-horizontal class="w-4"/>
+                                    </div>
+                                    <p>Control Panel</p>
+                                </a>
+                            </li>
+                        @endif
+
+                    </ul>
+                </div>
+                <form method="post" action="{{route('logout')}}">
+                    @csrf
+                    @method('delete')
+                    <x-ui.button class="flex space-x-3 hover:bg-gray-100 hover:border-gray-300 hover:border">
+                        <x-heroicon-o-arrow-right-start-on-rectangle class="w-4 stroke-2 mr-2"/>
+                        <p class="hidden sm:block">Logout</p>
+                    </x-ui.button>
+                </form>
+            </div>
+        </x-slot:end>
+    </x-dashboard.page-heading>
+    <section class="flex flex-col space-y-8 bg-[#F9FAFB] wrapper mt-2 pb-6">
+
+        <div>
+            @session('success')
+            <x-ui.alert variant="success">{{$value}}</x-ui.alert>
+            @endsession
+
+            @session('error')
+            <x-ui.alert variant="error">{{$value}}</x-ui.alert>
+            @endsession
+        </div>
+
+        <x-dashboard.card>
+            <div class="flex gap-4 flex-col sm:flex-row">
+                <x-ui.input class="flex-1" name="search" placeholder="Search deals, services, places"/>
+                <x-ui.select name="category" :options="$categories" value-key="value" label-key="name"/>
+            </div>
+        </x-dashboard.card>
+
+        <x-ui.toggle-button-group>
+            <x-ui.toggle-button active>
+                <a href="" class="flex items-center px-2 py-1 space-x-2">
+                    <x-heroicon-o-clock class="w-4 stroke-2"/>
+                    <p class="font-bold text-xs  sm:text-sm md:text-md">All Deals</p>
+                </a>
+            </x-ui.toggle-button>
+
+            <x-ui.toggle-button>
+                <a href="" class="flex items-center px-2 py-1 space-x-2">
+                    <x-heroicon-o-arrow-trending-up class="w-4 stroke-2"/>
+                    <p class="font-bold text-xs sm:text-sm md:text-md">Most Liked</p>
+                </a>
+            </x-ui.toggle-button>
+
+            <x-ui.toggle-button>
+                <a href="" class="flex items-center px-2 py-1 space-x-2">
+                    <x-heroicon-o-star class="w-4 stroke-2"/>
+                    <p class="font-bold text-xs sm:text-sm md:text-md">Most Clicked</p>
+                </a>
+            </x-ui.toggle-button>
+        </x-ui.toggle-button-group>
+
+        <x-dashboard.user.listing :deals="$deals"/>
+    </section>
+    @vite('resources/js/menu.js')
+</x-layout>

routes/web.php

@@ -5,9 +5,9 @@
 use App\Http\Controllers\Broker\BrokerDashboardController;
 use App\Http\Controllers\Broker\BrokerProfileController;
 use App\Http\Controllers\BrokerDealController;
+use App\Http\Controllers\ExplorePageController;
 use App\Http\Controllers\HomeController;
 use App\Http\Controllers\RegisteredUserController;
-use App\Http\Controllers\User\UserDashboardController;
 use App\Http\Middleware\HasRole;
 use Illuminate\Support\Facades\Route;
 
@@ -21,17 +21,12 @@
 Route::middleware('auth')->group(function () {
     Route::delete('/logout', [AuthenticatedUserController::class, 'destroy'])->name('logout');
 
+    Route::get('/explore', ExplorePageController::class)->name('explore');
+
     Route::view('/admin/dashboard', 'dashboards.admin.index')
         ->middleware(HasRole::class.':'.UserTypes::Admin->value)
         ->name('admin.dashboard');
 
-    Route::prefix('/user')
-        ->name('user.')
-        ->middleware(HasRole::class.':'.UserTypes::User->value)
-        ->group(function () {
-            Route::get('dashboard', [UserDashboardController::class, 'index'])->name('dashboard');
-        });
-
     Route::prefix('/broker')
         ->name('broker.')
         ->middleware(HasRole::class.':'.UserTypes::Broker->value)