Change the tab renderer to allow adding closable tab

packages/tree-extension/src/index.ts

@@ -3,19 +3,19 @@
 
 import {
   JupyterFrontEnd,
-  JupyterFrontEndPlugin
+  JupyterFrontEndPlugin,
 } from '@jupyterlab/application';
 
 import {
   IToolbarWidgetRegistry,
   createToolbarFactory,
-  setToolbar
+  setToolbar,
 } from '@jupyterlab/apputils';
 
 import {
   IFileBrowserFactory,
   FileBrowser,
-  Uploader
+  Uploader,
 } from '@jupyterlab/filebrowser';
 
 import { ISettingRegistry } from '@jupyterlab/settingregistry';
@@ -27,7 +27,8 @@ import { ITranslator } from '@jupyterlab/translation';
 import {
   caretDownIcon,
   folderIcon,
-  runningIcon
+  runningIcon,
+  TabBarSvg,
 } from '@jupyterlab/ui-components';
 
 import { Menu, MenuBar, TabPanel } from '@lumino/widgets';
@@ -70,10 +71,10 @@ const createNew: JupyterFrontEndPlugin<void> = {
       'terminal:create-new',
       'console:create',
       'filebrowser:create-new-file',
-      'filebrowser:create-new-directory'
+      'filebrowser:create-new-directory',
     ];
 
-    newCommands.forEach(command => {
+    newCommands.forEach((command) => {
       newMenu.addItem({ command });
     });
 
@@ -89,7 +90,7 @@ const createNew: JupyterFrontEndPlugin<void> = {
         }
       );
     }
-  }
+  },
 };
 
 /**
@@ -101,7 +102,7 @@ const browserWidget: JupyterFrontEndPlugin<void> = {
     IFileBrowserFactory,
     ITranslator,
     ISettingRegistry,
-    IToolbarWidgetRegistry
+    IToolbarWidgetRegistry,
   ],
   optional: [IRunningSessionManagers],
   autoStart: true,
@@ -113,7 +114,11 @@ const browserWidget: JupyterFrontEndPlugin<void> = {
     toolbarRegistry: IToolbarWidgetRegistry,
     manager: IRunningSessionManagers | null
   ): void => {
-    const tabPanel = new TabPanel({ tabPlacement: 'top', tabsMovable: true });
+    const tabPanel = new TabPanel({
+      tabPlacement: 'top',
+      tabsMovable: true,
+      renderer: TabBarSvg.defaultRenderer,
+    });
     tabPanel.addClass('jp-TreePanel');
 
     const trans = translator.load('notebook');
@@ -135,7 +140,7 @@ const browserWidget: JupyterFrontEndPlugin<void> = {
         new Uploader({
           model: browser.model,
           translator,
-          label: trans.__('Upload')
+          label: trans.__('Upload'),
         })
     );
 
@@ -173,7 +178,7 @@ const browserWidget: JupyterFrontEndPlugin<void> = {
       });
 
     app.shell.add(tabPanel, 'main', { rank: 100 });
-  }
+  },
 };
 
 /**