diff --git a/packages/app/src/components/Root/Root.tsx b/packages/app/src/components/Root/Root.tsx index 2e1952327e..62cda47a9a 100644 --- a/packages/app/src/components/Root/Root.tsx +++ b/packages/app/src/components/Root/Root.tsx @@ -1,6 +1,7 @@ import React, { PropsWithChildren, useContext, useState } from 'react'; import { + ErrorBoundary, Sidebar, SidebarDivider, SidebarGroup, @@ -29,8 +30,8 @@ import { makeStyles } from 'tss-react/mui'; import { policyEntityReadPermission } from '@janus-idp/backstage-plugin-rbac-common'; import DynamicRootContext, { - MountPoints, ResolvedMenuItem, + ScalprumMountPoint, } from '../DynamicRoot/DynamicRootContext'; import { MenuIcon } from './MenuIcon'; import { SidebarLogo } from './SidebarLogo'; @@ -102,24 +103,31 @@ const getMenuItem = (menuItem: ResolvedMenuItem, isNestedMenuItem = false) => { ); }; -const ApplicationHeader = ({ mountPoints }: { mountPoints: MountPoints }) => - mountPoints['application/header']?.map(({ Component, config }) => ( - +const ApplicationHeader = ({ + headerMountPoints, +}: { + headerMountPoints: ScalprumMountPoint[]; +}) => + headerMountPoints?.map(({ Component, config }) => ( + + + )); export const Root = ({ children }: PropsWithChildren<{}>) => { const { dynamicRoutes, menuItems, mountPoints } = useContext(DynamicRootContext); const [openItems, setOpenItems] = useState<{ [key: string]: boolean }>({}); + const headerMountPoints = mountPoints['application/header'] ?? []; - const headerPositions = mountPoints['application/header']?.map( - ({ config }) => { - return config?.layout?.position; - }, - ); + const headerPositions = headerMountPoints.map(({ config }) => { + return config?.layout?.position; + }); const { loading: loadingPermission, allowed: canDisplayRBACMenuItem } = usePermission({ @@ -266,11 +274,11 @@ export const Root = ({ children }: PropsWithChildren<{}>) => { return ( <> {headerPositions.includes('above-sidebar') && ( - + )} {headerPositions.includes('above-main-content') && ( - + )}