74 lines
3.9 KiB
PHP

@props(['activeClass' => 'bg-gray-100 text-gray-900'])
<div
id="sidebarWrapper" {{$attributes->merge([ 'class' => 'border-r border-r-gray-300 transition-all duration-300 ease-in-out w-64 relative'])}}>
<div class="hidden md:flex h-screen items-center">
<div id="sidebar"
class="flex flex-col p-4 pt-6 justify-between font-medium h-full w-full overflow-hidden transition-all duration-300 ease-in-out">
<div class="">
<div class="flex space-x-4 border-b border-b-gray-300 pb-6">
<x-logo/>
<a href="{{route('home')}}" class="whitespace-nowrap">
<p class="text-2xl font-bold">DealHub</p>
<p class="text-accent-600 text-sm">Admin Panel</p>
</a>
</div>
<div class="pt-6 flex flex-col space-y-3 whitespace-nowrap">
<x-dashboard.broker.sidebar.item :link="route('admin.dashboard')">
<x-heroicon-o-squares-2x2 class="min-w-5 w-5"/>
<p class="sidebar-text transition-opacity duration-300 ease-in-out ">Dashboard</p>
</x-dashboard.broker.sidebar.item>
<x-dashboard.broker.sidebar.item
:active="\Illuminate\Support\Facades\Route::is('admin.customers.*')"
:link="route('admin.customers.index')">
<x-heroicon-o-users class="min-w-5 w-5"/>
<p class="sidebar-text transition-opacity duration-300 ease-in-out ">Manage Customers</p>
</x-dashboard.broker.sidebar.item>
<x-dashboard.broker.sidebar.item :active="\Illuminate\Support\Facades\Route::is('admin.brokers.*')"
:link="route('admin.brokers.index')">
<x-heroicon-o-user class="min-w-5 w-5"/>
<p class="sidebar-text transition-opacity duration-300 ease-in-out">Manage Brokers</p>
</x-dashboard.broker.sidebar.item>
<x-dashboard.broker.sidebar.item :link="route('admin.reports.index')">
<x-heroicon-o-exclamation-triangle class="w-5 min-w-5"/>
<p class="sidebar-text transition-opacity duration-300 ease-in-out">Manage Reports</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 min-w-5"/>
<p class="sidebar-text transition-opacity duration-300 ease-in-out">Profile</p>
</x-dashboard.broker.sidebar.item>
<form method="post" action="{{route('logout')}}">
@csrf
@method('delete')
<button
class="py-3 pl-3 border border-white hover:bg-red-50 hover:border-red-200 rounded-xl w-full mt-4 transition-all">
<div class="flex space-x-3 items-center text-red-500">
<x-heroicon-o-arrow-right-start-on-rectangle class="w-5 min-w-5"/>
<p class="sidebar-text transition-opacity duration-300 ease-in-out">Logout</p>
</div>
</button>
</form>
</div>
</div>
{{-- Toggle Button --}}
<div
class="text-gray-500 cursor-pointer hover:text-gray-900 rounded-full p-1.5 bg-white border border-gray-300 absolute -right-3.5 top-21">
<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'])