Sidebar Menu

The sidebar is driven by a tree of MenuItem objects bound from the "AdminLte" config section. Each item maps to a link, a section header, or a collapsible group of children — and items can be hidden behind an authorization policy or role.

The MenuItem model

Property	Type	Purpose
`Header`	string?	When set, renders a non-clickable section header (`<li class="nav-header">`); other fields are ignored.
`Text`	string?	The visible link label.
`Url`	string?	Destination URL (bound to the anchor `href`). Wins over `Route`.
`Route`	string?	Optional named route key, used when `Url` is not set.
`Icon`	string?	Bootstrap Icons class, e.g. `bi bi-speedometer`.
`IconColor`	string?	Text color suffix applied to the icon, e.g. `primary`.
`Badge`	string?	Badge text/number rendered at the end of the row.
`BadgeColor`	string	Bootstrap theme for the badge background; defaults to `secondary`.
`Target`	string?	Anchor `target` attribute, e.g. `_blank`.
`Policy`	string?	Authorization policy required to see the item.
`Role`	string?	Show the item only if the user is in this role.
`Children`	IList<MenuItem>	Nested items; presence renders a collapsible treeview group.

Computed helpers on the model — IsHeader, HasChildren and ResolvedHref (returns Url, else Route, else #) — are used internally by the renderer.

A real appsettings menu

"Menu": [
  { "Header": "MAIN NAVIGATION" },
  {
    "Text": "Dashboard",
    "Icon": "bi bi-speedometer",
    "Children": [
      { "Text": "Dashboard v1", "Url": "/", "Icon": "bi bi-circle" },
      { "Text": "Dashboard v2", "Url": "/dashboard/v2", "Icon": "bi bi-circle" }
    ]
  },
  {
    "Text": "Widgets", "Icon": "bi bi-grid-1x2", "Badge": "New", "BadgeColor": "primary",
    "Children": [
      { "Text": "Small Boxes", "Url": "/widgets/small-boxes", "Icon": "bi bi-circle" },
      { "Text": "Cards", "Url": "/widgets/cards", "Icon": "bi bi-circle" }
    ]
  },
  { "Header": "ACCOUNT" },
  { "Text": "Admin", "Url": "/admin", "Icon": "bi bi-shield-lock", "Policy": "RequireAdmin" },
  {
    "Text": "AdminLTE.io", "Url": "https://adminlte.io",
    "Icon": "bi bi-box-arrow-up-right", "Target": "_blank"
  }
]

Active-item highlighting

DashboardLayout watches NavigationManager.LocationChanged and passes the current path to the sidebar, which highlights the matching item and auto-expands the group that contains it. You do not mark active items yourself — it is derived from the URL.

Authorization filtering

The default IMenuService filters the tree per user. Pass a ClaimsPrincipal to DashboardLayout's AuthorizedUser parameter (typically AuthenticationState.User). For each item:

If Role is set and the user is not in that role, the item is hidden.
If Policy is set, the item is hidden unless IAuthorizationService.AuthorizeAsync(user, policy) succeeds.
A group whose children are all filtered out is dropped entirely.

The same filtered, authorized menu also powers the ⌘K command palette — so users only search pages they are allowed to see.

The command palette

IMenuService.GetCommandsAsync flattens the authorized menu into a list of CommandItem entries (skipping headers and # links). The ⌘K palette searches those entries; it opens from the topbar search pill or with Cmd/Ctrl+K, supports arrow-key navigation, and navigates on Enter. Enable or disable it with the CommandPalette option.

AdminLTE 4 · ASP.NET port Edit on GitHub