diff --git a/src/renderer/components/app.tsx b/src/renderer/components/app.tsx index 7aea1125ad..fb7d4a7df0 100755 --- a/src/renderer/components/app.tsx +++ b/src/renderer/components/app.tsx @@ -100,7 +100,7 @@ export class App extends React.Component { const tabRoutes = this.getTabLayoutRoutes(menu); if (tabRoutes.length > 0) { const pageComponent = () => ; - return ; + return tab.routePath)} />; } else { const page = clusterPageRegistry.getByPageMenuTarget(menu.target); if (page) { diff --git a/src/renderer/components/layout/sidebar.tsx b/src/renderer/components/layout/sidebar.tsx index 0c56923c28..32e55bebc4 100644 --- a/src/renderer/components/layout/sidebar.tsx +++ b/src/renderer/components/layout/sidebar.tsx @@ -98,23 +98,30 @@ export class Sidebar extends React.Component { } renderRegisteredMenus() { - return clusterPageMenuRegistry.getRootItems().map((menuItem) => { + return clusterPageMenuRegistry.getRootItems().map((menuItem, index) => { const registeredPage = clusterPageRegistry.getByPageMenuTarget(menuItem.target); + const tabRoutes = this.getTabLayoutRoutes(menuItem); let pageUrl: string; + let routePath: string; let isActive = false; if (registeredPage) { const { extensionId, id: pageId } = registeredPage; pageUrl = getExtensionPageUrl({ extensionId, pageId, params: menuItem.target.params }); - isActive = pageUrl === navigation.location.pathname; - } - const tabRoutes = this.getTabLayoutRoutes(menuItem); - if (!registeredPage && tabRoutes.length == 0) { + routePath = registeredPage.routePath; + isActive = isActiveRoute(registeredPage.routePath); + } else if (tabRoutes.length > 0) { + pageUrl = tabRoutes[0].url; + routePath = tabRoutes[0].routePath; + isActive = isActiveRoute(tabRoutes.map((tab) => tab.routePath)); + } else { return; } return ( } + key={"registered-item-" + index} + url={pageUrl} + text={menuItem.title} + icon={} isActive={isActive} subMenus={tabRoutes} />