Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 14x 14x 14x 14x 14x 14x 1x 1x 1x 1x 1x 1x 1x 1x | import { NavLink, Outlet } from 'react-router-dom';
import '@/styles/backoffice.css';
const SIDEBAR_ITEMS = [
{ to: '/backoffice/users', label: 'Users' },
{ to: '/backoffice/events', label: 'Events' },
{ to: '/backoffice/event-reports', label: 'Event Reports' },
{ to: '/backoffice/categories', label: 'Categories' },
{ to: '/backoffice/participations', label: 'Participations' },
{ to: '/backoffice/tickets', label: 'Tickets' },
{ to: '/backoffice/invitations', label: 'Invitations' },
{ to: '/backoffice/join-requests', label: 'Join Requests' },
{ to: '/backoffice/comments', label: 'Comments' },
{ to: '/backoffice/ratings', label: 'Ratings' },
{ to: '/backoffice/favorites', label: 'Favorites' },
{ to: '/backoffice/badges', label: 'Badges' },
{ to: '/backoffice/push-devices', label: 'Push Devices' },
{ to: '/backoffice/notifications', label: 'Notifications' },
];
export default function BackofficeLayout() {
return (
<div className="bo-layout">
<aside className="bo-sidebar" aria-label="Admin Panel navigation">
<div className="bo-sidebar-title">
<svg className="bo-sidebar-title-icon" viewBox="0 0 24 24" aria-hidden="true">
<path d="M12 3.5 18 6v5.2c0 3.9-2.4 7.4-6 8.8-3.6-1.4-6-4.9-6-8.8V6l6-2.5Z" />
</svg>
<span>Admin Panel</span>
</div>
<nav className="bo-sidebar-nav">
{SIDEBAR_ITEMS.map((item) => (
<NavLink
key={item.to}
to={item.to}
className={({ isActive }) => `bo-sidebar-link ${isActive ? 'active' : ''}`}
>
{item.label}
</NavLink>
))}
</nav>
</aside>
<section className="bo-content">
<Outlet />
</section>
</div>
);
}
|