Skip to content

U
UGC Heaven Web PHP
Commit d1ee27c1 authored by Mahmoud Aglan's avatar Mahmoud Aglan
Browse files
Options

fix(ui): fix tab switching and replace dead sidebar links with proper routes 

Tabs component: The <x-ui.tabs> was creating its own x-data Alpine scope
which shadowed the parent's activeTab state, preventing tab clicks from
toggling panel visibility. Now detects slot mode (ComponentSlot) and skips
emitting x-data, letting the parent scope handle state.

Sidebar: Profile edit and dashboard pages had hardcoded href="#" links for
Projects, Campaigns, Messages, Portfolio. Replaced with the shared
creator-sidebar include that uses real routes. Also fixed dropdown profile/
settings links in the main layout.
Co-Authored-By: 's avatarClaude Opus 4.6 <noreply@anthropic.com>
parent 15eb012e
Show whitespace changes
Inline Side-by-side
Showing with 41 additions and 78 deletions
resources/views/campaigns/discover.blade.php
View file @ d1ee27c1
...@@ -2,17 +2,7 @@ ...@@ -2,17 +2,7 @@
@auth @auth
@if(auth()->user()->isCreator()) @if(auth()->user()->isCreator())
<x-slot:sidebar> <x-slot:sidebar>
<x-ui.sidebar-group :label="__('ui.navigation')"> @include('components.layouts.creator-sidebar')
<x-ui.sidebar-item icon="layout-dashboard" :href="route('creator.dashboard')">
{{ __('creators.dashboard_title') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="megaphone" :href="route('campaigns.discover')" :active="true">
{{ __('ui.browse_campaigns') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="briefcase" href="#">
{{ __('ui.projects') }}
</x-ui.sidebar-item>
</x-ui.sidebar-group>
</x-slot:sidebar> </x-slot:sidebar>
@endif @endif
@endauth @endauth
......
resources/views/components/layouts/app.blade.php
View file @ d1ee27c1
...@@ -120,8 +120,8 @@ ...@@ -120,8 +120,8 @@
</button> </button>
</x-slot:trigger> </x-slot:trigger>
<x-ui.dropdown-item icon="user" href="#">{{ __('ui.profile') }}</x-ui.dropdown-item> <x-ui.dropdown-item icon="user" :href="auth()->user()->role === 'creator' ? route('creator.profile.edit') : '#'">{{ __('ui.profile') }}</x-ui.dropdown-item>
<x-ui.dropdown-item icon="settings" href="#">{{ __('ui.settings') }}</x-ui.dropdown-item> <x-ui.dropdown-item icon="settings" :href="auth()->user()->role === 'admin' ? route('admin.settings.branding') : route('notifications.preferences')">{{ __('ui.settings') }}</x-ui.dropdown-item>
<div class="border-t border-[var(--color-border)] my-1"></div> <div class="border-t border-[var(--color-border)] my-1"></div>
<form method="POST" action="{{ route('logout') }}"> <form method="POST" action="{{ route('logout') }}">
@csrf @csrf
......
resources/views/components/ui/tabs.blade.php
View file @ d1ee27c1
@props([ @props([
'active' => null, 'active' => null,
'tabs' => [],
]) ])
@php @php
$tabsIsArray = is_array($tabs) && count($tabs) > 0; $tabsProp = $attributes->get('tabs') ?? (isset($tabs) && is_array($tabs) ? $tabs : []);
$defaultTab = $active ?? ($tabsIsArray ? array_key_first($tabs) : ''); $tabsIsArray = is_array($tabsProp) && count($tabsProp) > 0;
$defaultTab = $active ?? ($tabsIsArray ? array_key_first($tabsProp) : '');
$isSlotMode = isset($tabs) && !is_array($tabs);
@endphp @endphp
@if($isSlotMode)
{{-- Slot mode: parent manages x-data, we just render the nav wrapper --}}
<div {{ $attributes }}>
<div class="flex border-b border-[var(--color-border)] overflow-x-auto" role="tablist">
{{ $tabs }}
</div>
@if(isset($slot) && !$slot->isEmpty())
<div class="mt-4">
{{ $slot }}
</div>
@endif
</div>
@else
{{-- Array mode: component owns the Alpine state --}}
<div x-data="{ activeTab: '{{ $defaultTab }}' }" {{ $attributes }}> <div x-data="{ activeTab: '{{ $defaultTab }}' }" {{ $attributes }}>
{{-- Tab Navigation --}}
<div class="flex border-b border-[var(--color-border)] overflow-x-auto" role="tablist"> <div class="flex border-b border-[var(--color-border)] overflow-x-auto" role="tablist">
@if($tabsIsArray) @foreach($tabsProp as $key => $label)
@foreach($tabs as $key => $label)
<button <button
type="button" type="button"
role="tab" role="tab"
...@@ -26,13 +40,10 @@ $defaultTab = $active ?? ($tabsIsArray ? array_key_first($tabs) : ''); ...@@ -26,13 +40,10 @@ $defaultTab = $active ?? ($tabsIsArray ? array_key_first($tabs) : '');
{{ $label }} {{ $label }}
</button> </button>
@endforeach @endforeach
@elseif(isset($tabs) && !is_array($tabs))
{{ $tabs }}
@endif
</div> </div>
{{-- Tab Panels --}}
<div class="mt-4"> <div class="mt-4">
{{ $slot }} {{ $slot }}
</div> </div>
</div> </div>
@endif
resources/views/creators/dashboard.blade.php
View file @ d1ee27c1
<x-layouts.app :title="__('creators.dashboard_title')"> <x-layouts.app :title="__('creators.dashboard_title')">
<x-slot:sidebar> <x-slot:sidebar>
<x-ui.sidebar-group :label="__('ui.navigation')"> @include('components.layouts.creator-sidebar')
<x-ui.sidebar-item icon="layout-dashboard" :href="route('creator.dashboard')" :active="true">
{{ __('creators.dashboard_title') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="user" :href="route('creator.profile.edit')">
{{ __('ui.profile') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="briefcase" href="#">
{{ __('ui.projects') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="search" href="#">
{{ __('ui.campaigns') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="mail" href="#">
{{ __('ui.messages') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="image" href="#">
{{ __('ui.portfolio') }}
</x-ui.sidebar-item>
</x-ui.sidebar-group>
</x-slot:sidebar> </x-slot:sidebar>
<x-slot:header> <x-slot:header>
......
resources/views/creators/profile/edit.blade.php
View file @ d1ee27c1
<x-layouts.app :title="__('ui.edit_profile')"> <x-layouts.app :title="__('ui.edit_profile')">
<x-slot:sidebar> <x-slot:sidebar>
<x-ui.sidebar-group :label="__('ui.navigation')"> @include('components.layouts.creator-sidebar')
<x-ui.sidebar-item icon="layout-dashboard" :href="route('creator.dashboard')">
{{ __('creators.dashboard_title') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="user" :href="route('creator.profile.edit')" :active="true">
{{ __('ui.profile') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="briefcase" href="#">
{{ __('ui.projects') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="search" href="#">
{{ __('ui.campaigns') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="mail" href="#">
{{ __('ui.messages') }}
</x-ui.sidebar-item>
<x-ui.sidebar-item icon="image" href="#">
{{ __('ui.portfolio') }}
</x-ui.sidebar-item>
</x-ui.sidebar-group>
</x-slot:sidebar> </x-slot:sidebar>
<x-slot:header> <x-slot:header>
......
resources/views/layouts/app.blade.php
View file @ d1ee27c1
...@@ -120,8 +120,8 @@ ...@@ -120,8 +120,8 @@
</button> </button>
</x-slot:trigger> </x-slot:trigger>
<x-ui.dropdown-item icon="user" href="#">{{ __('ui.profile') }}</x-ui.dropdown-item> <x-ui.dropdown-item icon="user" :href="auth()->user()->role === 'creator' ? route('creator.profile.edit') : '#'">{{ __('ui.profile') }}</x-ui.dropdown-item>
<x-ui.dropdown-item icon="settings" href="#">{{ __('ui.settings') }}</x-ui.dropdown-item> <x-ui.dropdown-item icon="settings" :href="auth()->user()->role === 'admin' ? route('admin.settings.branding') : route('notifications.preferences')">{{ __('ui.settings') }}</x-ui.dropdown-item>
<div class="border-t border-[var(--color-border)] my-1"></div> <div class="border-t border-[var(--color-border)] my-1"></div>
<form method="POST" action="{{ route('logout') }}"> <form method="POST" action="{{ route('logout') }}">
@csrf @csrf
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment