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.

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}