feat: add userMenuItems prop to TopBar and export DropdownItem type
All checks were successful
Build & Publish / publish (push) Successful in 1m0s

Allows consumers to inject custom menu items above the Logout action
in the user dropdown. Items are separated from Logout by a divider.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
hsiegeln
2026-04-08 12:07:26 +02:00
parent e572df8558
commit 7e545140a2
2 changed files with 5 additions and 0 deletions

View File

@@ -13,6 +13,7 @@ export type { Column, DataTableProps } from './DataTable/types'
export { DetailPanel } from './DetailPanel/DetailPanel' export { DetailPanel } from './DetailPanel/DetailPanel'
export { EntityList } from './EntityList/EntityList' export { EntityList } from './EntityList/EntityList'
export { Dropdown } from './Dropdown/Dropdown' export { Dropdown } from './Dropdown/Dropdown'
export type { DropdownItem } from './Dropdown/Dropdown'
export { EventFeed } from './EventFeed/EventFeed' export { EventFeed } from './EventFeed/EventFeed'
export { GroupCard } from './GroupCard/GroupCard' export { GroupCard } from './GroupCard/GroupCard'
export { KpiStrip } from './KpiStrip/KpiStrip' export { KpiStrip } from './KpiStrip/KpiStrip'

View File

@@ -17,6 +17,7 @@ interface TopBarProps {
breadcrumb: BreadcrumbItem[] breadcrumb: BreadcrumbItem[]
environment?: ReactNode environment?: ReactNode
user?: { name: string } user?: { name: string }
userMenuItems?: import('../../composites/Dropdown/Dropdown').DropdownItem[]
onLogout?: () => void onLogout?: () => void
className?: string className?: string
} }
@@ -32,6 +33,7 @@ export function TopBar({
breadcrumb, breadcrumb,
environment, environment,
user, user,
userMenuItems,
onLogout, onLogout,
className, className,
}: TopBarProps) { }: TopBarProps) {
@@ -114,6 +116,8 @@ export function TopBar({
</div> </div>
} }
items={[ items={[
...(userMenuItems ?? []),
...(userMenuItems?.length ? [{ label: '', divider: true }] : []),
{ label: 'Logout', icon: <Power size={14} />, onClick: onLogout }, { label: 'Logout', icon: <Power size={14} />, onClick: onLogout },
]} ]}
/> />