Conditionally render toolbar item

Signed-off-by: Andy Jakubowski <hello@andyjakubowski.com>

Author: andyjakubowski

.copier-answers.yml

@@ -4,7 +4,7 @@ _src_path: https://github.com/jupyterlab/extension-template
 author_email: andy@deepnote.com
 author_name: Andy Jakubowski
 has_binder: false
-has_settings: false
+has_settings: true
 kind: frontend-and-server
 labextension_name: jupyterlab-deepnote
 project_short_description: A Deepnote extension for JupyterLab

jupyterlab_deepnote/contents.py

@@ -63,6 +63,7 @@ def get(self, path, content=True, type=None, format=None, require_hash=False):
             model["type"] = "notebook"
             model["format"] = "json"
             model["content"] = nb_node
+            model["writable"] = False
             self.mark_trusted_cells(nb_node, path)
             self.validate_notebook_model(model, validation_error={})
 

package.json

@@ -19,7 +19,8 @@
     "files": [
         "lib/**/*.{d.ts,eot,gif,html,jpg,js,js.map,json,png,svg,woff2,ttf}",
         "style/**/*.{css,js,eot,gif,html,jpg,json,png,svg,woff2,ttf}",
-        "src/**/*.{ts,tsx}"
+        "src/**/*.{ts,tsx}",
+        "schema/*.json"
     ],
     "main": "lib/index.js",
     "types": "lib/index.d.ts",
@@ -59,7 +60,9 @@
         "@jupyterlab/application": "^4.0.0",
         "@jupyterlab/coreutils": "^6.0.0",
         "@jupyterlab/notebook": "^4.4.7",
-        "@jupyterlab/services": "^7.0.0"
+        "@jupyterlab/services": "^7.0.0",
+        "@jupyterlab/settingregistry": "^4.0.0",
+        "@lumino/widgets": "^2.7.1"
     },
     "devDependencies": {
         "@jupyterlab/builder": "^4.0.0",
@@ -109,7 +112,8 @@
             }
         },
         "extension": true,
-        "outputDir": "jupyterlab_deepnote/labextension"
+        "outputDir": "jupyterlab_deepnote/labextension",
+        "schemaDir": "schema"
     },
     "eslintIgnore": [
         "node_modules",

schema/plugin.json

@@ -0,0 +1,11 @@
+{
+  "jupyter.lab.shortcuts": [],
+  "jupyter.lab.toolbars": {
+    "Notebook": [{ "name": "deepnote:switch-notebook", "rank": 1 }]
+  },
+  "title": "jupyterlab-deepnote",
+  "description": "jupyterlab-deepnote settings.",
+  "type": "object",
+  "properties": {},
+  "additionalProperties": false
+}

src/index.ts

@@ -3,22 +3,16 @@ import {
   JupyterFrontEndPlugin
 } from '@jupyterlab/application';
 
-import { NotebookPanel, NotebookWidgetFactory } from '@jupyterlab/notebook';
-import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
-import { IEditorServices } from '@jupyterlab/codeeditor';
-
-const factoryName = 'Deepnote Notebook';
+import { IToolbarWidgetRegistry, ToolbarButton } from '@jupyterlab/apputils';
+import { NotebookPanel } from '@jupyterlab/notebook';
+import { Widget } from '@lumino/widgets';
 
 const plugin: JupyterFrontEndPlugin<void> = {
   id: 'jupyterlab-deepnote:plugin',
   description: 'Open .deepnote files as notebooks.',
   autoStart: true,
-  requires: [IRenderMimeRegistry, IEditorServices],
-  activate: (
-    app: JupyterFrontEnd,
-    rendermime: IRenderMimeRegistry,
-    editorServices: IEditorServices
-  ) => {
+  requires: [IToolbarWidgetRegistry],
+  activate: (app: JupyterFrontEnd, toolbarRegistry: IToolbarWidgetRegistry) => {
     // 1) File type
     app.docRegistry.addFileType(
       {
@@ -27,27 +21,31 @@ const plugin: JupyterFrontEndPlugin<void> = {
         extensions: ['.deepnote'],
         mimeTypes: ['text/yaml', 'application/x-yaml'],
         fileFormat: 'text',
-        contentType: 'notebook'
+        contentType: 'file'
       },
-      [factoryName]
+      ['Notebook']
     );
 
-    // 2) Widget factory that reuses the stock notebook UI
-    const contentFactory = new NotebookPanel.ContentFactory({
-      editorFactory: editorServices.factoryService.newInlineEditor
-    });
+    app.docRegistry.setDefaultWidgetFactory('deepnote', 'Notebook');
 
-    const widgetFactory = new NotebookWidgetFactory({
-      name: factoryName,
-      modelName: 'notebook', // built-in notebook model
-      fileTypes: ['deepnote'],
-      defaultFor: ['deepnote'],
-      rendermime,
-      contentFactory,
-      mimeTypeService: editorServices.mimeTypeService
-    });
+    toolbarRegistry.addFactory<NotebookPanel>(
+      'Notebook',
+      'deepnote:switch-notebook',
+      panel => {
+        if (!panel.context.path.endsWith('.deepnote')) {
+          return new Widget(); // don’t render for .ipynb or others
+        }
 
-    app.docRegistry.addWidgetFactory(widgetFactory);
+        return new ToolbarButton({
+          className: 'debug-deepnote-button',
+          label: 'Deepnote',
+          tooltip: 'Do a Deepnote action',
+          onClick: () => {
+            console.log('clicked for', panel.context.path);
+          }
+        });
+      }
+    );
   }
 };
 

yarn.lock

@@ -2502,7 +2502,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@jupyterlab/settingregistry@npm:^4.4.7":
+"@jupyterlab/settingregistry@npm:^4.0.0, @jupyterlab/settingregistry@npm:^4.4.7":
   version: 4.4.7
   resolution: "@jupyterlab/settingregistry@npm:4.4.7"
   dependencies:
@@ -6799,7 +6799,9 @@ __metadata:
     "@jupyterlab/coreutils": ^6.0.0
     "@jupyterlab/notebook": ^4.4.7
     "@jupyterlab/services": ^7.0.0
+    "@jupyterlab/settingregistry": ^4.0.0
     "@jupyterlab/testutils": ^4.0.0
+    "@lumino/widgets": ^2.7.1
     "@types/jest": ^29.2.0
     "@types/json-schema": ^7.0.11
     "@types/react": ^18.0.26