chore: hotreload

datalayer · Sep 24, 2023 · c3fb40b · c3fb40b
1 parent 3d20751
commit c3fb40b
Show file tree

Hide file tree

Showing 22 changed files with 236 additions and 175 deletions.
diff --git a/dev/notebooks/ping.ipynb b/dev/notebooks/ping.ipynb
@@ -10,13 +10,21 @@
  ],
  "metadata": {
   "kernelspec": {
-   "display_name": "datalayer",
+   "display_name": "Python 3 (ipykernel)",
    "language": "python",
    "name": "python3"
   },
   "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
    "name": "python",
-   "version": "3.10.4 | packaged by conda-forge | (main, Mar 24 2022, 17:43:32) [Clang 12.0.1 ]"
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.11.4"
   }
  },
  "nbformat": 4,

diff --git a/dev/notebooks/test.ipynb b/dev/notebooks/test.ipynb
@@ -2,7 +2,7 @@
  "cells": [
   {
    "cell_type": "code",
-   "execution_count": 1,
+   "execution_count": 3,
    "metadata": {},
    "outputs": [
     {
@@ -11,7 +11,7 @@
        "2"
       ]
      },
-     "execution_count": 1,
+     "execution_count": 3,
      "metadata": {},
      "output_type": "execute_result"
     }
@@ -20,78 +20,6 @@
     "1+1"
    ]
   },
-  {
-   "cell_type": "markdown",
-   "metadata": {},
-   "source": []
-  },
-  {
-   "cell_type": "markdown",
-   "metadata": {},
-   "source": []
-  },
-  {
-   "cell_type": "markdown",
-   "metadata": {},
-   "source": []
-  },
-  {
-   "cell_type": "markdown",
-   "metadata": {},
-   "source": []
-  },
-  {
-   "cell_type": "code",
-   "execution_count": null,
-   "metadata": {},
-   "outputs": [],
-   "source": []
-  },
-  {
-   "cell_type": "code",
-   "execution_count": null,
-   "metadata": {},
-   "outputs": [],
-   "source": []
-  },
-  {
-   "cell_type": "code",
-   "execution_count": null,
-   "metadata": {},
-   "outputs": [],
-   "source": []
-  },
-  {
-   "cell_type": "code",
-   "execution_count": null,
-   "metadata": {},
-   "outputs": [],
-   "source": []
-  },
-  {
-   "cell_type": "code",
-   "execution_count": null,
-   "metadata": {},
-   "outputs": [],
-   "source": []
-  },
-  {
-   "cell_type": "code",
-   "execution_count": null,
-   "metadata": {},
-   "outputs": [],
-   "source": []
-  },
-  {
-   "cell_type": "markdown",
-   "metadata": {},
-   "source": []
-  },
-  {
-   "cell_type": "markdown",
-   "metadata": {},
-   "source": []
-  },
   {
    "cell_type": "code",
    "execution_count": null,
@@ -116,7 +44,7 @@
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
-   "version": "3.10.4"
+   "version": "3.11.4"
   }
  },
  "nbformat": 4,

diff --git a/package.json b/package.json
@@ -56,15 +56,17 @@
     "start:webpack": "webpack serve",
     "start:jupyter-server": "cd ./dev/sh && ./start-jupyter-server.sh",
     "jupyterlab": "run-p -c 'jupyterlab:*'",
-    "jupyterlab:start": "jupyter lab --watch --config=./dev/config/jupyter_server_config.py",
-    "jupyterlab:watch": "run-p -c watch:src watch:labextension",
+    "jupyterlab:server": "jupyter server --config=./dev/config/jupyter_server_config.py",
+    "jupyterlab:webpack": "webpack serve",
     "watch": "run-p watch:src watch:labextension",
     "watch:src": "tsc -w",
     "watch:labextension": "jupyter labextension watch .",
     "kill": "./dev/sh/kill-jupyter-server.sh || true"
   },
   "dependencies": {
+    "@datalayer/jupyter-react": "0.7.7",
     "@datalayer/primer-addons": "0.1.4",
+    "@jupyter/collaboration-extension": "1.2.0",
     "@jupyterlab/application": "4.0.3",
     "@jupyterlab/coreutils": "6.0.3",
     "@jupyterlab/services": "7.0.3",
@@ -135,7 +137,7 @@
         }
       }
     },
-    "extension": true,
+    "extension": "./lib/jupyterlab/index.js",
     "outputDir": "datalayer/labextension",
     "schemaDir": "schema"
   },

diff --git a/public/index.html b/public/index.html
@@ -3,19 +3,28 @@
   <head>
     <meta charset="UTF-8"/>
     <title>Ξ Datalayer</title>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js"></script>
-    <link rel="shortcut icon" href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC7SURBVFiF7ZU9CgIxEIXfTHbPopfYc+pJ9AALtmJnZSOIoJWFoCTzLHazxh/Ebpt5EPIxM8XXTCKTxYyMCYwJFhOYCo4JFiMuu317PZwaqEBUIar4YMmskL73DytGjgu4gAt4PDJdzkkzMBloBhqBgcu69XW+1I+rNSQESNDuaMEhdP/Fj/7oW+ACLuACHk/3F5BAfuMLBjm8/ZnxNvNtHmY4b7Ztut0bqStoVSHfWj9Z6mr8LXABF3CBB3nvkDfEVN6PAAAAAElFTkSuQmCC" type="image/x-icon" />
+    <script id="datalayer-config-data" type="application/json">
+      {
+        "jupyterServerHttpUrl": "http://localhost:8888",
+        "jupyterServerWsUrl": "ws://localhost:8888",
+        "jupyterToken": "60c1661cc408f978c309d04157af55c9588ff9557c9380e4fb50785750703da6"
+      }
+    </script>
     <script id="jupyter-config-data" type="application/json">
       {
-        "baseUrl": "http://localhost:8686/api/jupyter",
-        "wsUrl": "ws://localhost:8686/api/jupyter",
+        "baseUrl": "http://localhost:8888",
+        "wsUrl": "ws://localhost:8888",
         "token": "60c1661cc408f978c309d04157af55c9588ff9557c9380e4fb50785750703da6",
-        "collaborative": "false",
-        "terminalsAvailable": "false",
+        "appUrl": "/lab",
+        "themesUrl": "/lab/api/themes",
+        "collaborative": "true",
+        "terminalsAvailable": "true",
         "mathjaxUrl": "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js",
         "mathjaxConfig": "TeX-AMS_CHTML-full,Safe"
       }
     </script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js"></script>
+    <link rel="shortcut icon" href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC7SURBVFiF7ZU9CgIxEIXfTHbPopfYc+pJ9AALtmJnZSOIoJWFoCTzLHazxh/Ebpt5EPIxM8XXTCKTxYyMCYwJFhOYCo4JFiMuu317PZwaqEBUIar4YMmskL73DytGjgu4gAt4PDJdzkkzMBloBhqBgcu69XW+1I+rNSQESNDuaMEhdP/Fj/7oW+ACLuACHk/3F5BAfuMLBjm8/ZnxNvNtHmY4b7Ztut0bqStoVSHfWj9Z6mr8LXABF3CBB3nvkDfEVN6PAAAAAElFTkSuQmCC" type="image/x-icon" />
   </head>
   <body>
     <div id="root"></div>

diff --git a/schema/plugin.json b/schema/plugin.json
@@ -1,8 +1,8 @@
 {
-  "jupyter.lab.shortcuts": [],
   "title": "@datalayer/core",
   "description": "@datalayer/core settings.",
   "type": "object",
   "properties": {},
-  "additionalProperties": false
+  "additionalProperties": false,
+  "jupyter.lab.shortcuts": []
 }
diff --git a/src/Datalayer.tsx b/src/Datalayer.tsx
@@ -5,7 +5,7 @@ import { UnderlineNav } from '@primer/react/drafts';
 import { DatalayerGreenIcon, JupyterBaseIcon } from '@datalayer/icons-react';
 import AboutTab from './tabs/AboutTab';
 import JupyterLabTab from './tabs/JupyterLabTab';
-import { requestAPI } from './handler';
+import { requestAPI } from './jupyterlab/handler';
 
 export type JupyterFrontEndProps = {
   app?: JupyterFrontEnd;

diff --git a/src/DatalayerDev.tsx b/src/DatalayerDev.tsx
@@ -0,0 +1,41 @@
+import { createRoot } from 'react-dom/client';
+import { Jupyter, JupyterLabApp, JupyterLabPluginsCore } from '@datalayer/jupyter-react';
+import { JupyterLab } from '@jupyterlab/application';
+import * as collaborationExtension from '@jupyter/collaboration-extension';
+import * as datalayerExtension from './jupyterlab/index';
+
+const { extensionsPromises, mimeExtensionsPromises } = JupyterLabPluginsCore;
+
+const onReady = (jupyterLab: JupyterLab) => {
+  console.log('JupyterLab is ready.')
+  /*
+  jupyterLab.deactivatePlugin(datalayerExtension.PLUGIN_ID).then((deactivatedDownstreamPlugins) => {
+    console.log('Deeactivated downstream plugins', deactivatedDownstreamPlugins);
+  });
+  jupyterLab.deregisterPlugin(datalayerExtension.PLUGIN_ID, true);
+  */
+}
+const DatalayerDev = () => (
+  <JupyterLabApp
+    extensions={[
+      datalayerExtension,
+      collaborationExtension,
+    ]}
+    extensionPromises={extensionsPromises}
+    mimeExtensionsPromises={mimeExtensionsPromises}
+    position="absolute"
+    hostId="jupyterlab-app-id"
+    height="100vh"
+    onReady={onReady}
+  />
+)
+
+const div = document.createElement('div');
+document.body.appendChild(div);
+const root = createRoot(div);
+
+root.render(
+  <Jupyter startDefaultKernel={false} disableCssLoading={true}>
+    <DatalayerDev/>
+  </Jupyter>
+);
diff --git a/src/handler.ts → src/jupyterlab/handler.ts b/src/handler.ts → src/jupyterlab/handler.ts
diff --git a/src/index.ts → src/jupyterlab/index.ts b/src/index.ts → src/jupyterlab/index.ts
@@ -6,7 +6,7 @@ import icon from '@datalayer/icons-react/data1/DatalayerGreenIconLabIcon';
 import { requestAPI } from './handler';
 import { DatalayerWidget } from './widget';
 
-import '../style/index.css';
+import '../../style/index.css';
 
 /**
  * The command IDs used by the plugin.
@@ -15,14 +15,28 @@ namespace CommandIDs {
   export const create = 'datalayer:create-datalayer-widget';
 }
 
+export const PLUGIN_ID = '@datalayer/core:plugin';
+
+let tracker: WidgetTracker<MainAreaWidget<DatalayerWidget>>;
+
 /**
  * Initialization data for the @datalayer/core extension.
  */
 const plugin: JupyterFrontEndPlugin<void> = {
-  id: '@datalayer/core:plugin',
+  id: PLUGIN_ID,
   autoStart: true,
   requires: [ICommandPalette],
   optional: [ISettingRegistry, ILauncher, ILayoutRestorer],
+  deactivate: (
+    app: JupyterFrontEnd,
+    palette: ICommandPalette,
+    settingRegistry?: ISettingRegistry,
+    launcher?: ILauncher,
+    restorer?: ILayoutRestorer,
+  ) => {
+    tracker.forEach(widget => widget.dispose());
+    console.log(`${PLUGIN_ID} is deactivated`);
+  },
   activate: (
     app: JupyterFrontEnd,
     palette: ICommandPalette,
@@ -32,9 +46,11 @@ const plugin: JupyterFrontEndPlugin<void> = {
   ) => {
     const { commands } = app;
     const command = CommandIDs.create;
-    const tracker = new WidgetTracker<MainAreaWidget<DatalayerWidget>>({
-      namespace: 'datalayer',
-    });
+    if (!tracker) {
+      tracker = new WidgetTracker<MainAreaWidget<DatalayerWidget>>({
+        namespace: 'datalayer',
+      });
+    }
     if (restorer) {
       void restorer.restore(tracker, {
         command,
@@ -63,27 +79,27 @@ const plugin: JupyterFrontEndPlugin<void> = {
         rank: 1.1,
       });
     }
-    console.log('JupyterLab plugin @datalayer/core is activated!');
     if (settingRegistry) {
       settingRegistry
         .load(plugin.id)
         .then(settings => {
-          console.log('@datalayer/core settings loaded:', settings.composite);
+          console.log(`${PLUGIN_ID} settings loaded:`, settings.composite);
         })
         .catch(reason => {
-          console.error('Failed to load settings for @datalayer/core.', reason);
+          console.error(`Failed to load settings for ${PLUGIN_ID}`, reason);
         });
     }
     requestAPI<any>('config')
       .then(data => {
-        console.log(data);
+        console.log('Received config', data);
       })
       .catch(reason => {
         console.error(
           `Error while accessing the jupyter server extension.\n${reason}`
         );
       }
     );
+    console.log(`JupyterLab plugin ${PLUGIN_ID} is activated.`);
   }
 };
 

diff --git a/src/widget.tsx → src/jupyterlab/widget.tsx b/src/widget.tsx → src/jupyterlab/widget.tsx
@@ -1,6 +1,6 @@
 import { JupyterFrontEnd } from '@jupyterlab/application';
 import { ReactWidget } from '@jupyterlab/apputils';
-import Datalayer from './Datalayer';
+import Datalayer from '../Datalayer';
 
 export class DatalayerWidget extends ReactWidget {
   private _app: JupyterFrontEnd;