Build navigator on top of @lumino/application

Author: fcollonval

packages/navigator/.eslintrc.js

@@ -1,3 +1,9 @@
 const eslintBase = require('../../eslint-base');
 
-module.exports = eslintBase;
+module.exports = {
+  ...eslintBase,
+  parserOptions: {
+    project: 'tsconfig.json',
+    sourceType: 'module'
+  }
+};

packages/navigator/package.json

@@ -30,12 +30,11 @@
     "watch": "npm-run-all --parallel watch:ts watch:webpack"
   },
   "dependencies": {
-    "@jupyterlab/application": "^2.0.0",
     "@jupyterlab/apputils": "^2.0.0",
-    "@jupyterlab/buildutils": "^2.0.0",
     "@jupyterlab/mainmenu": "^2.0.0",
     "@jupyterlab/theme-light-extension": "^2.0.0",
     "@jupyterlab/ui-components": "^2.0.0",
+    "@lumino/application": "^1.11.0",
     "@lumino/widgets": "^1.13.2",
     "@mamba-org/common": "^1.0.0",
     "es6-promise": "~4.2.8",
@@ -44,6 +43,7 @@
     "react-dom": "~16.9.0"
   },
   "devDependencies": {
+    "@jupyterlab/buildutils": "^2.0.0",
     "@typescript-eslint/eslint-plugin": "^2.25.0",
     "@typescript-eslint/parser": "^2.25.0",
     "css-loader": "~3.2.0",

packages/navigator/src/app/app.ts

@@ -1,22 +1,26 @@
-import {
-  JupyterFrontEnd,
-  JupyterFrontEndPlugin
-} from '@jupyterlab/application';
-
-import { PageConfig } from '@jupyterlab/coreutils';
+import { Application, IPlugin } from '@lumino/application';
 
 import { IGatorShell, GatorShell } from './shell';
 
+/**
+ * The type for all JupyterFrontEnd application plugins.
+ *
+ * @typeparam T - The type that the plugin `provides` upon being activated.
+ */
+export type GatorFrontEndPlugin<T> = IPlugin<Gator, T>;
+
 /**
  * Gator is the main application class. It is instantiated once and shared.
  */
-export class Gator extends JupyterFrontEnd<IGatorShell> {
+export class Gator extends Application<IGatorShell> {
   /**
    * Construct a new App object.
    *
    * @param options The instantiation options for an Gator application.
    */
-  constructor(options: Gator.IOptions = { shell: new GatorShell() }) {
+  constructor(
+    options: Application.IOptions<IGatorShell> = { shell: new GatorShell() }
+  ) {
     super({
       shell: options.shell
     });
@@ -37,38 +41,6 @@ export class Gator extends JupyterFrontEnd<IGatorShell> {
    */
   readonly version = 'unknown';
 
-  /**
-   * The JupyterLab application paths dictionary.
-   */
-  get paths(): JupyterFrontEnd.IPaths {
-    return {
-      urls: {
-        base: PageConfig.getOption('baseUrl'),
-        notFound: PageConfig.getOption('notFoundUrl'),
-        app: PageConfig.getOption('appUrl'),
-        static: PageConfig.getOption('staticUrl'),
-        settings: PageConfig.getOption('settingsUrl'),
-        themes: PageConfig.getOption('themesUrl'),
-        tree: PageConfig.getOption('treeUrl'),
-        workspaces: PageConfig.getOption('workspacesUrl'),
-        hubHost: PageConfig.getOption('hubHost') || undefined,
-        hubPrefix: PageConfig.getOption('hubPrefix') || undefined,
-        hubUser: PageConfig.getOption('hubUser') || undefined,
-        hubServerName: PageConfig.getOption('hubServerName') || undefined
-      },
-      directories: {
-        appSettings: PageConfig.getOption('appSettingsDir'),
-        schemas: PageConfig.getOption('schemasDir'),
-        static: PageConfig.getOption('staticDir'),
-        templates: PageConfig.getOption('templatesDir'),
-        themes: PageConfig.getOption('themesDir'),
-        userSettings: PageConfig.getOption('userSettingsDir'),
-        serverRoot: PageConfig.getOption('serverRoot'),
-        workspaces: PageConfig.getOption('workspacesDir')
-      }
-    };
-  }
-
   /**
    * Register plugins from a plugin module.
    *
@@ -108,11 +80,6 @@ export class Gator extends JupyterFrontEnd<IGatorShell> {
  * A namespace for Gator statics.
  */
 export namespace Gator {
-  /**
-   * The instantiation options for an Gator application.
-   */
-  export type IOptions = JupyterFrontEnd.IOptions<IGatorShell>;
-
   /**
    * The interface for a module that exports a plugin or plugins as
    * the default value.
@@ -121,6 +88,6 @@ export namespace Gator {
     /**
      * The default export.
      */
-    default: JupyterFrontEndPlugin<any> | JupyterFrontEndPlugin<any>[];
+    default: IPlugin<Gator, any> | IPlugin<Gator, any>[];
   }
 }

packages/navigator/src/app/shell.ts

@@ -1,5 +1,3 @@
-import { JupyterFrontEnd } from '@jupyterlab/application';
-
 import { classes, DockPanelSvg, LabIcon } from '@jupyterlab/ui-components';
 
 import { IIterator, iter, toArray } from '@lumino/algorithm';
@@ -21,7 +19,7 @@ export namespace IGatorShell {
 /**
  * The application shell.
  */
-export class GatorShell extends Widget implements JupyterFrontEnd.IShell {
+export class GatorShell extends Widget {
   constructor() {
     super();
     this.id = 'main';

packages/navigator/src/index.ts

@@ -13,16 +13,11 @@ import '../style/index.css';
  */
 async function main(): Promise<void> {
   const app = new Gator();
-  const mods = [
-    require('./plugins/paths'),
-    require('./plugins/navigator'),
-    require('./plugins/top')
-  ];
+  const mods = [require('./plugins/navigator'), require('./plugins/top')];
 
   app.registerPluginModules(mods);
 
   await app.start();
-  await app.restored;
 }
 
 window.addEventListener('load', main);

packages/navigator/src/plugins/navigator/index.ts

@@ -1,36 +1,20 @@
-import {
-  JupyterFrontEnd,
-  JupyterFrontEndPlugin
-} from '@jupyterlab/application';
 import { DOMUtils, MainAreaWidget } from '@jupyterlab/apputils';
-import { Widget } from '@lumino/widgets';
 import {
   CondaEnvironments,
   CondaEnvWidget,
   condaIcon,
   CONDA_WIDGET_CLASS
 } from '@mamba-org/common';
 import { INotification } from 'jupyterlab_toastify';
-import { mambaIcon } from '../../icons';
-import { IMainMenu } from '../top/tokens';
-
-/**
- * The command ids used by the main navigator plugin.
- */
-export namespace CommandIDs {
-  export const open = '@mamba-org/navigator:open';
-}
+import { Gator, GatorFrontEndPlugin } from '../../app/app';
 
 /**
  * The main navigator plugin.
  */
-const plugin: JupyterFrontEndPlugin<void> = {
+const plugin: GatorFrontEndPlugin<void> = {
   id: '@mamba-org/navigator:main',
   autoStart: true,
-  optional: [IMainMenu],
-  activate: (app: JupyterFrontEnd, menu: IMainMenu | null): void => {
-    const { commands } = app;
-
+  activate: (app: Gator): void => {
     const model = new CondaEnvironments();
 
     // Request listing available package as quickly as possible
@@ -44,27 +28,6 @@ const plugin: JupyterFrontEndPlugin<void> = {
     content.title.icon = condaIcon;
     const widget = new MainAreaWidget({ content });
     app.shell.add(widget, 'main');
-
-    commands.addCommand(CommandIDs.open, {
-      label: 'Open',
-      execute: () => {
-        const widget = new Widget();
-        mambaIcon.element({
-          container: widget.node,
-          elementPosition: 'center',
-          margin: '5px 5px 5px 5px',
-          height: 'auto',
-          width: 'auto'
-        });
-        widget.id = DOMUtils.createDomID();
-        widget.title.label = 'Mamba Logo';
-        app.shell.add(widget, 'main');
-      }
-    });
-
-    if (menu) {
-      menu.fileMenu.addGroup([{ command: CommandIDs.open }]);
-    }
   }
 };
 

packages/navigator/src/plugins/paths/index.ts

@@ -1,20 +1,11 @@
-import {
-  JupyterFrontEnd,
-  JupyterFrontEndPlugin
-} from '@jupyterlab/application';
-
-import { showDialog, Dialog } from '@jupyterlab/apputils';
-
+import { Dialog, showDialog } from '@jupyterlab/apputils';
 import { Widget } from '@lumino/widgets';
-
+import * as React from 'react';
+import { Gator, GatorFrontEndPlugin } from '../../app/app';
+import { mambaIcon } from '../../icons';
 import { MainMenu } from './menu';
-
 import { IMainMenu } from './tokens';
 
-import { mambaIcon } from '../../icons';
-
-import * as React from 'react';
-
 /**
  * The command IDs used by the top plugin.
  */
@@ -25,11 +16,11 @@ namespace CommandIDs {
 /**
  * The main menu plugin.
  */
-const plugin: JupyterFrontEndPlugin<IMainMenu> = {
+const plugin: GatorFrontEndPlugin<IMainMenu> = {
   id: '@mamba-org/navigator:menu',
   autoStart: true,
   provides: IMainMenu,
-  activate: (app: JupyterFrontEnd): IMainMenu => {
+  activate: (app: Gator): IMainMenu => {
     const logo = new Widget();
     mambaIcon.element({
       container: logo.node,

packages/navigator/src/plugins/top/file.ts

@@ -4,8 +4,6 @@ import { CommandRegistry } from '@lumino/commands';
 
 import { MenuBar } from '@lumino/widgets';
 
-import { FileMenu } from './file';
-
 import { HelpMenu } from './help';
 
 import { IMainMenu } from './tokens';
@@ -22,28 +20,18 @@ export class MainMenu extends MenuBar implements IMainMenu {
   constructor(options: MainMenu.IOptions) {
     super();
     const { commands } = options;
-    this._fileMenu = new FileMenu({ commands });
     this._helpMenu = new HelpMenu({ commands });
 
-    this.addMenu(this._fileMenu.menu);
     this.addMenu(this._helpMenu.menu);
   }
 
-  /**
-   * Get the file menu.
-   */
-  get fileMenu(): IJupyterLabMenu {
-    return this._fileMenu;
-  }
-
   /**
    * Get the help menu.
    */
   get helpMenu(): IJupyterLabMenu {
     return this._helpMenu;
   }
 
-  private _fileMenu: FileMenu;
   private _helpMenu: HelpMenu;
 }