From cd613791b621c578ba0fd29f9013657cc4038a5c Mon Sep 17 00:00:00 2001
From: colin-grant-work <colin.grant@ericsson.com>
Date: Thu, 30 Mar 2023 06:29:29 -0600
Subject: [PATCH] core: show tabbar when items are present (#12307)

The commit fixes an issue with the `TabBarToolbar`, where at the React 18 uplift, an old `onRender` disposable in the `TabBarToolbar` class was replaced with a new-style `onRender` mechanism, which, however, doesn't appear to work reliably. Simpler is just revealing the toolbar immediately, knowing that a render will come soon.

The changes mean that on application start the toolbar will be correctly rendered without the needed to switch view containers first.
---
 .../src/browser/shell/tab-bar-toolbar/tab-bar-toolbar.tsx | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/packages/core/src/browser/shell/tab-bar-toolbar/tab-bar-toolbar.tsx b/packages/core/src/browser/shell/tab-bar-toolbar/tab-bar-toolbar.tsx
index 3eef36552e953..4e21eeefe911a 100644
--- a/packages/core/src/browser/shell/tab-bar-toolbar/tab-bar-toolbar.tsx
+++ b/packages/core/src/browser/shell/tab-bar-toolbar/tab-bar-toolbar.tsx
@@ -56,11 +56,8 @@ export class TabBarToolbar extends ReactWidget {
         super();
         this.addClass(TabBarToolbar.Styles.TAB_BAR_TOOLBAR);
         this.hide();
-        this.onRender = this.onRender.bind(this);
     }
 
-    protected onRender = () => this.show();
-
     updateItems(items: Array<TabBarToolbarItem | ReactTabBarToolbarItem>, current: Widget | undefined): void {
         this.inline.clear();
         this.more.clear();
@@ -81,7 +78,9 @@ export class TabBarToolbar extends ReactWidget {
         this.updateContextKeyListener(contextKeys);
 
         this.setCurrent(current);
-        if (!items.length) {
+        if (items.length) {
+            this.show();
+        } else {
             this.hide();
         }
         this.update();
@@ -152,7 +151,6 @@ export class TabBarToolbar extends ReactWidget {
         const toolbarItemClassNames = this.getToolbarItemClassNames(item);
         if (item.menuPath && !item.command) { toolbarItemClassNames.push('enabled'); }
         return <div key={item.id}
-            ref={this.onRender}
             className={toolbarItemClassNames.join(' ')}
             onMouseDown={this.onMouseDownEvent}
             onMouseUp={this.onMouseUpEvent}