WIP Adds left and right widgets area

.gitignore

@@ -5,6 +5,8 @@ node_modules/
 .ipynb_checkpoints
 *.tsbuildinfo
 
+*/yarn-error.log
+
 # Created by https://www.gitignore.io/api/python
 # Edit at https://www.gitignore.io/?templates=python
 

packages/application-extension/src/index.ts

@@ -39,7 +39,7 @@ import { PromiseDelegate } from '@lumino/coreutils';
 
 import { DisposableDelegate, DisposableSet } from '@lumino/disposable';
 
-import { Widget } from '@lumino/widgets';
+import { Menu, Widget } from '@lumino/widgets';
 
 /**
  * The default notebook factory.
@@ -70,6 +70,11 @@ namespace CommandIDs {
    */
   export const toggleTop = 'application:toggle-top';
 
+  /**
+   * Toggle sidebar visibility
+   */
+  export const togglePanel = 'application:toggle-panel';
+
   /**
    * Toggle the Zen mode
    */
@@ -96,6 +101,13 @@ namespace CommandIDs {
   export const resolveTree = 'application:resolve-tree';
 }
 
+/**
+ * Are the left and right panels available on the current page?
+ */
+const sidePanelsEnabled: () => boolean = () => {
+  return PageConfig.getOption('retroPage') === 'notebooks';
+};
+
 /**
  * Check if the application is dirty before closing the browser tab.
  */
@@ -581,6 +593,135 @@ const topVisibility: JupyterFrontEndPlugin<void> = {
   autoStart: true
 };
 
+/**
+ * Plugin to toggle the left or right sidebar's visibility.
+ */
+const sidebarVisibility: JupyterFrontEndPlugin<void> = {
+  id: '@retrolab/application-extension:sidebar',
+  requires: [IRetroShell, ITranslator],
+  optional: [IMainMenu, ISettingRegistry],
+  activate: (
+    app: JupyterFrontEnd<JupyterFrontEnd.IShell>,
+    retroShell: IRetroShell,
+    translator: ITranslator,
+    menu: IMainMenu | null,
+    settingRegistry: ISettingRegistry | null
+  ) => {
+    if (!sidePanelsEnabled()) {
+      return;
+    }
+
+    const trans = translator.load('retrolab');
+
+    /* Arguments for togglePanel command:
+     * side, left or right area
+     * title, widget title to show in the menu
+     * id, widget ID to activate in the sidebar
+     */
+    app.commands.addCommand(CommandIDs.togglePanel, {
+      label: args => args['title'] as string,
+      caption: args => {
+        // We do not substitute the parameter into the string because the parameter is not
+        // localized (e.g., it is always 'left') even though the string is localized.
+        if (args['side'] === 'left') {
+          return trans.__(
+            'Show %1 in the left sidebar',
+            args['title'] as string
+          );
+        } else if (args['side'] === 'right') {
+          return trans.__(
+            'Show %1 in the right sidebar',
+            args['title'] as string
+          );
+        }
+        return trans.__('Show %1 in the sidebar', args['title'] as string);
+      },
+      execute: args => {
+        switch (args['side'] as string) {
+          case 'left':
+            if (retroShell.leftCollapsed) {
+              retroShell.activateById(args['id'] as string);
+              retroShell.expandLeft();
+            } else {
+              retroShell.collapseLeft();
+              if (retroShell.currentWidget) {
+                retroShell.activateById(retroShell.currentWidget.id);
+              }
+            }
+            break;
+          case 'right':
+            if (retroShell.rightCollapsed) {
+              retroShell.activateById(args['id'] as string);
+              retroShell.expandRight();
+            } else {
+              retroShell.collapseRight();
+              if (retroShell.currentWidget) {
+                retroShell.activateById(retroShell.currentWidget.id);
+              }
+            }
+            break;
+        }
+      },
+      isToggled: args => {
+        if (retroShell.leftCollapsed) {
+          return false;
+        }
+        const currentWidget = retroShell.leftHandler.current;
+        if (!currentWidget) {
+          return false;
+        }
+
+        return currentWidget.id === (args['id'] as string);
+      }
+    });
+
+    const leftSidebarMenu = new Menu({ commands: app.commands });
+    leftSidebarMenu.title.label = trans.__('Show Left Sidebar');
+
+    const rightSidebarMenu = new Menu({ commands: app.commands });
+    rightSidebarMenu.title.label = trans.__('Show Right Sidebar');
+
+    app.restored.then(() => {
+      const leftWidgets = retroShell.widgetsList('left');
+      leftWidgets.forEach(widget => {
+        leftSidebarMenu.addItem({
+          command: CommandIDs.togglePanel,
+          args: {
+            side: 'left',
+            title: widget.title.caption,
+            id: widget.id
+          }
+        });
+      });
+
+      const rightWidgets = retroShell.widgetsList('right');
+      rightWidgets.forEach(widget => {
+        rightSidebarMenu.addItem({
+          command: CommandIDs.togglePanel,
+          args: {
+            side: 'right',
+            title: widget.title.caption,
+            id: widget.id
+          }
+        });
+      });
+
+      const menuItemsToAdd: Menu.IItemOptions[] = [];
+      if (leftWidgets.length > 0) {
+        menuItemsToAdd.push({ type: 'submenu', submenu: leftSidebarMenu });
+      }
+      if (rightWidgets.length > 0) {
+        menuItemsToAdd.push({ type: 'submenu', submenu: rightSidebarMenu });
+      }
+
+      if (menu && menuItemsToAdd) {
+        menu.viewMenu.addGroup(menuItemsToAdd, 2);
+      }
+    });
+  },
+  autoStart: true
+};
+
 /**
  * The default tree route resolver plugin.
  */
@@ -740,6 +881,7 @@ const plugins: JupyterFrontEndPlugin<any>[] = [
   router,
   sessionDialogs,
   shell,
+  sidebarVisibility,
   spacer,
   status,
   tabTitle,