Implement column toggling and reordering

schema/plugin.json

@@ -3,6 +3,21 @@
   "title": "jupyterlab-new-launcher",
   "description": "jupyterlab-new-launcher settings.",
   "type": "object",
-  "properties": {},
+  "properties": {
+    "hiddenColumns": {
+      "type": "object",
+      "default": {
+        "conda_env_path": true,
+        "conda_raw_kernel_name": true
+      },
+      "additionalProperties": { "type": "boolean" }
+    },
+    "columnOrder": {
+      "type": "array",
+      "items": {
+        "type": "string"
+      }
+    }
+  },
   "additionalProperties": false
 }

src/commands.ts

@@ -0,0 +1,79 @@
+import { JupyterFrontEnd } from '@jupyterlab/application';
+import { ISettingRegistry } from '@jupyterlab/settingregistry';
+import { TranslationBundle } from '@jupyterlab/translation';
+import { CommandIDs } from './types';
+import { ISettingsLayout } from './types';
+
+export function addCommands(
+  app: JupyterFrontEnd,
+  trans: TranslationBundle,
+  settings: ISettingRegistry.ISettings
+) {
+  app.commands.addCommand(CommandIDs.toggleColumn, {
+    label: args => {
+      if (args.label) {
+        return args.label as string;
+      }
+      if (args.id) {
+        const id = args.id as string;
+        return id[0].toLocaleUpperCase() + id.substring(1);
+      }
+      return trans.__('Toggle given column');
+    },
+    execute: async args => {
+      const id = args.id as string | undefined;
+      if (!id) {
+        return console.error('Column ID missing');
+      }
+      const columns =
+        (settings.user.hiddenColumns as
+          | ISettingsLayout['hiddenColumns']
+          | undefined) ?? {};
+      if (columns[id]) {
+        columns[id] = false;
+      } else {
+        columns[id] = true;
+      }
+      await settings.set('hiddenColumns', columns);
+    },
+    isToggleable: true,
+    isToggled: args => {
+      const id = args.id as string | undefined;
+      if (!id) {
+        console.error('Column ID missing for checking if toggled');
+        return false;
+      }
+      const columns =
+        (settings.user.hiddenColumns as
+          | ISettingsLayout['hiddenColumns']
+          | undefined) ?? {};
+      return !columns[id];
+    }
+  });
+  app.commands.addCommand(CommandIDs.moveColumn, {
+    label: args => {
+      if (args.direction === 'left') {
+        return trans.__('Move Column Left');
+      } else if (args.direction === 'right') {
+        return trans.__('Move Column Right');
+      } else {
+        return trans.__('Move column left or right');
+      }
+    },
+    execute: async args => {
+      const order = args.order as ISettingsLayout['columnOrder'];
+      const id = args.id as string;
+      const pos = order.indexOf(id);
+      const shift = args.direction === 'left' ? -1 : +1;
+      const newPos = pos + shift;
+      if (newPos < 0 || newPos >= order.length) {
+        console.log('Cannot move the column any further');
+        return;
+      }
+      const replacement = order[newPos];
+      order[newPos] = id;
+      order[pos] = replacement;
+      await settings.set('columnOrder', order);
+    }
+  });
+}

src/index.ts

@@ -18,13 +18,8 @@ import { DockPanel, TabBar, Widget } from '@lumino/widgets';
 import { NewLauncher as Launcher } from './launcher';
 import { LastUsedDatabase } from './last_used';
 import { FavoritesDatabase } from './favorites';
-
-/**
- * The command IDs used by the launcher plugin.
- */
-namespace CommandIDs {
-  export const create = 'launcher:create';
-}
+import { CommandIDs } from './types';
+import { addCommands } from './commands';
 
 /**
  * Initialization data for the jupyterlab-new-launcher extension.
@@ -34,8 +29,8 @@ const plugin: JupyterFrontEndPlugin<ILauncher> = {
   description: 'A redesigned JupyterLab launcher',
   provides: ILauncher,
   autoStart: true,
-  requires: [ITranslator, IStateDB],
-  optional: [ILabShell, ICommandPalette, IDefaultFileBrowser, ISettingRegistry],
+  requires: [ITranslator, IStateDB, ISettingRegistry],
+  optional: [ILabShell, ICommandPalette, IDefaultFileBrowser],
   activate
 };
 
@@ -48,41 +43,26 @@ function activate(
   app: JupyterFrontEnd,
   translator: ITranslator,
   stateDB: IStateDB,
+  settingRegistry: ISettingRegistry,
   labShell: ILabShell | null,
   palette: ICommandPalette | null,
-  defaultBrowser: IDefaultFileBrowser | null,
-  settingRegistry: ISettingRegistry | null
+  defaultBrowser: IDefaultFileBrowser | null
 ): ILauncher {
   const { commands, shell } = app;
   const trans = translator.load('jupyterlab-new-launcher');
   const model = new LauncherModel();
 
-  console.log('JupyterLab extension jupyterlab-new-launcher is activated!');
-
-  if (settingRegistry) {
-    settingRegistry
-      .load(plugin.id)
-      .then(settings => {
-        console.log(
-          'jupyterlab-new-launcher settings loaded:',
-          settings.composite
-        );
-      })
-      .catch(reason => {
-        console.error(
-          'Failed to load settings for jupyterlab-new-launcher.',
-          reason
-        );
-      });
-  }
-
   const databaseOptions = {
     stateDB,
     fetchInterval: 10000
   };
   const lastUsedDatabase = new LastUsedDatabase(databaseOptions);
   const favoritesDatabase = new FavoritesDatabase(databaseOptions);
 
+  settingRegistry.load(plugin.id).then(settings => {
+    addCommands(app, trans, settings);
+  });
+
   commands.addCommand(CommandIDs.create, {
     label: trans.__('New Launcher'),
     icon: args => (args.toolbar ? addIcon : undefined),
@@ -96,6 +76,8 @@ function activate(
           launcher.dispose();
         }
       };
+
+      const settings = await settingRegistry.load(plugin.id);
       await Promise.all([lastUsedDatabase.ready, favoritesDatabase.ready]);
       const launcher = new Launcher({
         model,
@@ -104,7 +86,8 @@ function activate(
         commands,
         translator,
         lastUsedDatabase,
-        favoritesDatabase
+        favoritesDatabase,
+        settings
       });
 
       launcher.model = model;