Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Admin Panel Sidebar Block for Solid

An admin console in a fixed-height window whose sidebar has a View as select for Owner, Editor or Support, locking the pages that role cannot open with the role each one needs.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

See what each role can open with this admin panel sidebar for Solid with Ark UI. A window framed by a hairline with a plus mark on each corner holds a Sidebar for Wardenpoint, an admin console for a membership platform. A View as Select in the header switches between Owner, Editor and Support over ten pages in three groups. A page the role cannot open stays in the list as a row with a lock and the role it needs, marked aria-disabled. Choosing it explains why instead of opening it, and the page line counts what is open, for example Editor: 7 of 10 pages open. Built from Sidebar, Select, Badge and Guides, with a CSS entrance only. For admin panels, back offices and any console where roles see different pages.

FAQ

What does each role lose?

Editor loses Billing, Roles and access and Audit log, so seven of ten pages stay open. Support also loses Events and Posts, so five stay open. The open count is derived from the same list that draws the rows, so it cannot disagree with them.

Why are locked pages still in the list?

Hiding them would leave people guessing where a page went. A locked row stays focusable with aria-disabled, shows a lock and the role it needs, and its name reads, for example, Billing, needs Owner. Choosing it puts the reason in the status line and opens nothing.

What if I switch to a role that cannot open the page I am on?

The page falls back to Overview and the status line says so, naming the page and the role. Switching to a role that can still open the page leaves it alone.

What happens when the sidebar folds to icons?

The rail keeps all ten pages as icons with tooltips, and a locked page's tooltip names the role it needs. The View as select is hidden while folded, so unfold the rail to change role. The provider is set with persist={false} and shortcut={false}, so the block writes no cookie and leaves Ctrl and Command with B to the page it sits on.

What stays in the page, and how do I connect it?

Everything. The role is local state and every table is typed at the top of the file. Read the real role from your session, filter the page list on the server as well, and never rely on a disabled row as the only guard.

How does it work on a phone?

Below the medium breakpoint the sidebar is a sheet that the menu button in the top bar opens from the start edge, the right in a right-to-left layout. Choosing an open page closes the sheet; choosing a locked one keeps it open so the lock stays in view. The status line under the page says what happened, and the sheet carries its own copy of it while it is open.