Enhanced Sidebar

Gruppiert Collections und Globals im Payload-Admin in Tabs mit Icons, sodass die Seitennavigation übersichtlicher wird.

Community 28 1024/Wo. MIT v0.6.2

Installation

pnpm add @veiag/payload-enhanced-sidebar

Über

Das Plugin ersetzt die Standardnavigation des Payload-Admins durch eine Seitenleiste mit Tabs. Eine vertikale Icon-Leiste links wechselt zwischen den Panels, und jedes Panel listet die Collections und Globals auf, die dem Tab zugeordnet sind. Ein Tab ohne collections oder globals zeigt alle. Icons lassen sich über den Namen aus dem Lucide-Set angeben oder per iconComponent durch eine eigene Komponente ersetzen. Setzt ein Tab zusätzlich href, navigiert ein Klick zur Route und öffnet gleichzeitig das zugehörige Panel. Registriert wird das Plugin mit payloadEnhancedSidebar(options) in der plugins-Liste von buildConfig. Ohne eigene Optionen entstehen ein Dashboard-Link und ein Tab mit allen Collections. Neben tabs stehen showLogout (Standard: true), disabled, badges und customComponents für NavContent, NavGroup, NavItem und TabButton zur Verfügung. Tabs vom Typ 'tab' öffnen ein Panel mit Collections, Globals, customItems und contentComponent, Tabs vom Typ 'link' navigieren direkt und unterstützen isExternal. Mit der Option access auf Tab-Ebene, einer Funktion, die auf dem Server läuft, lässt sich ein Tab bei false ausblenden. Custom Items erhalten slug, href, label und group (fügt sich in eine bestehende Gruppe ein) und können mit position: 'top' an den Anfang gesetzt werden. Doppelte Tab-IDs führen beim Build der Konfiguration zu einem Fehler. Das Plugin überschreibt bei jedem Lauf admin.components.Nav. Eine eigene Nav in der Konfiguration geht dabei verloren. Labels können als LocalizedString angegeben werden, etwa mit en und uk, die Plugin-eigenen Übersetzungen werden in config.i18n.translations zusammengeführt. Badges lassen sich über einen API-Endpunkt, einen Collection-Zähler oder einen Provider speisen, der über admin.components.providers eingebunden wird. Vorausgesetzt wird payload in Version ^3.75.0. Das Paket nutzt @payloadcms/translations und lucide-react. Der Root-Export stellt das Config-Plugin bereit. Der Export ./client enthält React-Komponenten und Hooks und benötigt die SCSS-Styles. Der Export ./rsc liefert die Server-Komponente EnhancedSidebar.

Paketinformationen

Paketname
@veiag/payload-enhanced-sidebar
Neueste Version
0.6.2
Entpackte Größe
284 kB
Lizenz
MIT
Wöchentliche Downloads
1024
Zuletzt veröffentlicht
23. Sep. 2026

Ähnliche Plugins

Mehr in Admin