Role-based Menu component items

Here, we talk about Menu, Context menu, and Horizontal menu components.

UI Bakery gives you the ability to configure specific menu items, for Menu components, which users can access based on their roles. Below, is an example that you can modify according to the roles in your organization. Once you're ready, specify the code in the Items property of your Menu component.

const userHasAccess = {{user.role}} === 'admin'; // Replace with your actual access condition
const menuItems = [
  {
    title: 'Dashboard',
    route: '/dashboard',
    disabled: false  // This item is always enabled
  },
  {
    title: 'Admin Panel',
    route: '/admin',
    disabled: !userHasAccess  // This item is disabled if the user is not an admin
  }
  // ... other menu items
];

return menuItems;

PreviousManaging Date object time zones NextField types & types recognition

Last updated 2 months ago

Was this helpful?