WIP(ui-top-nav-bar): extract rendering logic into a constant

instructure · Nov 2, 2023 · ba90489 · ba90489
1 parent f5531b8
commit ba90489
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/packages/ui-top-nav-bar/src/TopNavBar/TopNavBarLayout/DesktopLayout/index.tsx b/packages/ui-top-nav-bar/src/TopNavBar/TopNavBarLayout/DesktopLayout/index.tsx
@@ -123,7 +123,6 @@ class TopNavBarDesktopLayout extends Component<TopNavBarDesktopLayoutProps> {
 
   get hasBreadcrumbBlock() {
     const { renderBreadcrumb } = this.props
-    // TODO: check the children part
     return (
       !!renderBreadcrumb &&
       React.Children.count(renderBreadcrumb.props.children) > 0
@@ -141,6 +140,10 @@ class TopNavBarDesktopLayout extends Component<TopNavBarDesktopLayoutProps> {
       styles
     } = this.props
 
+    // only render breadcrumb if there is no brand or menu items
+    const shouldRenderBreadcrumbBlock =
+      !(this.hasBrandBlock || this.hasMenuItemsBlock) && this.hasBreadcrumbBlock
+
     return (
       <nav
         {...omitProps(this.props, allowedProps)}
@@ -156,9 +159,7 @@ class TopNavBarDesktopLayout extends Component<TopNavBarDesktopLayoutProps> {
           <div css={styles?.menuItemsContainer}>{renderMenuItems}</div>
         )}
 
-        {!(this.hasBrandBlock || this.hasMenuItemsBlock) &&
-          this.hasBreadcrumbBlock &&
-          renderBreadcrumb}
+        {shouldRenderBreadcrumbBlock && renderBreadcrumb}
 
         {this.hasActionItemsBlock && (
           <div css={styles?.actionItemsContainer}>{renderActionItems}</div>