Reorganize sidebar navigation with Analytics category
- Add new Analytics section at top with Dashboard and Payments - Reorder Manage section: Scheduler, Resources, Staff, Customers, Media Gallery, Contracts, Time Blocks - Remove Money section (Payments moved to Analytics) - Keep staff-only items (My Schedule, My Availability) in separate section 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -12,11 +12,11 @@ import {
|
||||
ClipboardList,
|
||||
Ticket,
|
||||
HelpCircle,
|
||||
Clock,
|
||||
Plug,
|
||||
FileSignature,
|
||||
CalendarOff,
|
||||
Image,
|
||||
BarChart3,
|
||||
} from 'lucide-react';
|
||||
import { Business, User } from '../types';
|
||||
import { useLogout } from '../hooks/useAuth';
|
||||
@@ -119,8 +119,8 @@ const Sidebar: React.FC<SidebarProps> = ({ business, user, isCollapsed, toggleCo
|
||||
|
||||
{/* Navigation */}
|
||||
<nav className="flex-1 px-3 space-y-6 overflow-y-auto pb-4">
|
||||
{/* Core Features - Always visible */}
|
||||
<SidebarSection isCollapsed={isCollapsed}>
|
||||
{/* Analytics Section - Dashboard and Payments */}
|
||||
<SidebarSection title={t('nav.sections.analytics', 'Analytics')} isCollapsed={isCollapsed}>
|
||||
<SidebarItem
|
||||
to="/dashboard"
|
||||
icon={LayoutDashboard}
|
||||
@@ -128,14 +128,21 @@ const Sidebar: React.FC<SidebarProps> = ({ business, user, isCollapsed, toggleCo
|
||||
isCollapsed={isCollapsed}
|
||||
exact
|
||||
/>
|
||||
{hasPermission('can_access_scheduler') && (
|
||||
{hasPermission('can_access_payments') && (
|
||||
<SidebarItem
|
||||
to="/dashboard/scheduler"
|
||||
icon={CalendarDays}
|
||||
label={t('nav.scheduler')}
|
||||
to="/dashboard/payments"
|
||||
icon={CreditCard}
|
||||
label={t('nav.payments')}
|
||||
isCollapsed={isCollapsed}
|
||||
disabled={!business.paymentsEnabled && role !== 'owner'}
|
||||
/>
|
||||
)}
|
||||
</SidebarSection>
|
||||
|
||||
{/* Staff-only: My Schedule and My Availability */}
|
||||
{((isStaff && hasPermission('can_access_my_schedule')) ||
|
||||
((role === 'staff' || role === 'resource') && hasPermission('can_access_my_availability'))) && (
|
||||
<SidebarSection isCollapsed={isCollapsed}>
|
||||
{(isStaff && hasPermission('can_access_my_schedule')) && (
|
||||
<SidebarItem
|
||||
to="/dashboard/my-schedule"
|
||||
@@ -153,30 +160,23 @@ const Sidebar: React.FC<SidebarProps> = ({ business, user, isCollapsed, toggleCo
|
||||
/>
|
||||
)}
|
||||
</SidebarSection>
|
||||
)}
|
||||
|
||||
{/* Manage Section - Show if user has any manage-related permission */}
|
||||
{(canViewManagementPages ||
|
||||
hasPermission('can_access_gallery') ||
|
||||
hasPermission('can_access_customers') ||
|
||||
{/* Manage Section - Scheduler, Resources, Staff, Customers, Contracts, Time Blocks */}
|
||||
{(hasPermission('can_access_scheduler') ||
|
||||
hasPermission('can_access_resources') ||
|
||||
hasPermission('can_access_staff') ||
|
||||
hasPermission('can_access_customers') ||
|
||||
hasPermission('can_access_contracts') ||
|
||||
hasPermission('can_access_time_blocks')
|
||||
hasPermission('can_access_time_blocks') ||
|
||||
hasPermission('can_access_gallery')
|
||||
) && (
|
||||
<SidebarSection title={t('nav.sections.manage', 'Manage')} isCollapsed={isCollapsed}>
|
||||
{hasPermission('can_access_gallery') && (
|
||||
{hasPermission('can_access_scheduler') && (
|
||||
<SidebarItem
|
||||
to="/dashboard/gallery"
|
||||
icon={Image}
|
||||
label={t('nav.gallery', 'Media Gallery')}
|
||||
isCollapsed={isCollapsed}
|
||||
/>
|
||||
)}
|
||||
{hasPermission('can_access_customers') && (
|
||||
<SidebarItem
|
||||
to="/dashboard/customers"
|
||||
icon={Users}
|
||||
label={t('nav.customers')}
|
||||
to="/dashboard/scheduler"
|
||||
icon={CalendarDays}
|
||||
label={t('nav.scheduler')}
|
||||
isCollapsed={isCollapsed}
|
||||
/>
|
||||
)}
|
||||
@@ -196,6 +196,22 @@ const Sidebar: React.FC<SidebarProps> = ({ business, user, isCollapsed, toggleCo
|
||||
isCollapsed={isCollapsed}
|
||||
/>
|
||||
)}
|
||||
{hasPermission('can_access_customers') && (
|
||||
<SidebarItem
|
||||
to="/dashboard/customers"
|
||||
icon={Users}
|
||||
label={t('nav.customers')}
|
||||
isCollapsed={isCollapsed}
|
||||
/>
|
||||
)}
|
||||
{hasPermission('can_access_gallery') && (
|
||||
<SidebarItem
|
||||
to="/dashboard/gallery"
|
||||
icon={Image}
|
||||
label={t('nav.gallery', 'Media Gallery')}
|
||||
isCollapsed={isCollapsed}
|
||||
/>
|
||||
)}
|
||||
{hasPermission('can_access_contracts') && canUse('contracts') && (
|
||||
<SidebarItem
|
||||
to="/dashboard/contracts"
|
||||
@@ -216,8 +232,8 @@ const Sidebar: React.FC<SidebarProps> = ({ business, user, isCollapsed, toggleCo
|
||||
</SidebarSection>
|
||||
)}
|
||||
|
||||
{/* Communicate Section - Tickets + Messages */}
|
||||
{(canViewTickets || canSendMessages) && (
|
||||
{/* Communicate Section - Messages + Tickets */}
|
||||
{(canSendMessages || canViewTickets) && (
|
||||
<SidebarSection title={t('nav.sections.communicate', 'Communicate')} isCollapsed={isCollapsed}>
|
||||
{canSendMessages && (
|
||||
<SidebarItem
|
||||
@@ -238,19 +254,6 @@ const Sidebar: React.FC<SidebarProps> = ({ business, user, isCollapsed, toggleCo
|
||||
</SidebarSection>
|
||||
)}
|
||||
|
||||
{/* Money Section - Payments */}
|
||||
{hasPermission('can_access_payments') && (
|
||||
<SidebarSection title={t('nav.sections.money', 'Money')} isCollapsed={isCollapsed}>
|
||||
<SidebarItem
|
||||
to="/dashboard/payments"
|
||||
icon={CreditCard}
|
||||
label={t('nav.payments')}
|
||||
isCollapsed={isCollapsed}
|
||||
disabled={!business.paymentsEnabled && role !== 'owner'}
|
||||
/>
|
||||
</SidebarSection>
|
||||
)}
|
||||
|
||||
{/* Extend Section - Automations */}
|
||||
{hasPermission('can_access_automations') && (
|
||||
<SidebarSection title={t('nav.sections.extend', 'Extend')} isCollapsed={isCollapsed}>
|
||||
|
||||
@@ -157,9 +157,9 @@
|
||||
"timeBlocks": "Time Blocks",
|
||||
"helpDocs": "Help & Docs",
|
||||
"sections": {
|
||||
"analytics": "Analytics",
|
||||
"manage": "Manage",
|
||||
"communicate": "Communicate",
|
||||
"money": "Money",
|
||||
"extend": "Extend"
|
||||
}
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user