feat: convert Deepnote file to Jupyter on the frontend

.yarnrc.yml

@@ -1 +1,6 @@
 nodeLinker: node-modules
+npmScopes:
+  deepnote:
+    npmRegistryServer: 'https://npm.pkg.github.com'
+    npmAlwaysAuth: true
+    npmAuthToken: '${GITHUB_TOKEN}'

deepnote-file-request-examples.txt

@@ -0,0 +1,7 @@
+[W 2025-09-18 11:22:56.083 ServerApp] 404 GET /api/contents/all-block-types-no-outputs.deepnote?content=0&hash=0&1758187376077 (::1): file or directory does not exist: 'all-block-types-no-outputs.deepnote'
+[D 2025-09-18 11:22:56.083 ServerApp] Accepting token-authenticated request from ::1
+[D 2025-09-18 11:22:56.083 ServerApp] 200 GET /api/contents/example.ipynb?content=0&hash=0&1758187376077 (b4931ce4427142b3a2011a47bec521d2@::1) 1.80ms
+[D 2025-09-18 11:22:56.083 ServerApp] Accepting token-authenticated request from ::1
+[D 2025-09-18 11:22:56.083 ServerApp] 200 GET /api/contents/example.deepnote?content=0&hash=0&1758187376077 (b4931ce4427142b3a2011a47bec521d2@::1) 2.10ms
+[D 2025-09-18 11:22:56.288 ServerApp] 200 GET /api/contents/example.deepnote?type=notebook&content=1&hash=1&contentProviderId=undefined&1758187376168 (b4931ce4427142b3a2011a47bec521d2@::1) 57.88ms
+[D 2025-09-18 11:22:56.296 ServerApp] 200 GET /api/contents/example.deepnote/checkpoints?1758187376293 (b4931ce4427142b3a2011a47bec521d2@::1) 1.35ms

jupyterlab_deepnote/contents.py

@@ -2,63 +2,7 @@
 from jupyter_server.services.contents.filemanager import FileContentsManager
 from typing import cast
 
-import yaml
-from nbformat.v4 import new_notebook, new_code_cell, new_markdown_cell
-
-
-def yaml_to_ipynb(yaml_text: str):
-    """Convert Deepnote YAML into a minimal Jupyter nbformat v4 notebook."""
-    try:
-        data = yaml.safe_load(yaml_text)
-    except Exception:
-        return new_notebook(cells=[])
-
-    notebooks = (
-        data.get("project", {}).get("notebooks", []) if isinstance(data, dict) else []
-    )
-
-    if not notebooks:
-        return new_notebook(cells=[])
-
-    # Collect notebook names
-    notebook_names = [nb.get("name", "") for nb in notebooks]
-
-    # Build all_notebooks dict: name -> full nbformat notebook JSON
-    all_notebooks = {}
-    for nb in notebooks:
-        nb_blocks = nb.get("blocks", [])
-        nb_cells = []
-        for block in sorted(nb_blocks, key=lambda b: b.get("sortingKey", "")):
-            btype = block.get("type", "code")
-            content = block.get("content", "")
-            if btype == "code":
-                nb_cells.append(new_code_cell(content))
-            else:
-                nb_cells.append(new_markdown_cell(content))
-        # Use the notebook name as key
-        nb_name = nb.get("name", "")
-        all_notebooks[nb_name] = new_notebook(cells=nb_cells)
-
-    # Use first notebook's cells to render initially
-    nb0 = notebooks[0]
-    blocks = nb0.get("blocks", [])
-    cells = []
-    for block in sorted(blocks, key=lambda b: b.get("sortingKey", "")):
-        btype = block.get("type", "code")
-        content = block.get("content", "")
-        if btype == "code":
-            cells.append(new_code_cell(content))
-        else:
-            cells.append(new_markdown_cell(content))
-
-    metadata = {
-        "deepnote": {"notebook_names": notebook_names, "notebooks": all_notebooks}
-    }
-    return new_notebook(cells=cells, metadata=metadata)
-
-
-def yaml_to_ipynb_dummy(yaml_text: str) -> dict:
-    return {"nbformat": 4, "nbformat_minor": 5, "metadata": {}, "cells": []}
+from nbformat.v4 import new_notebook
 
 
 class DeepnoteContentsManager(FileContentsManager):
@@ -74,15 +18,13 @@ def get(self, path, content=True, type=None, format=None, require_hash=False):
             else:
                 yaml_text = cast(str, _content)
 
-            nb_node = yaml_to_ipynb(yaml_text)
-
             model = self._base_model(path)
             model["type"] = "notebook"
             model["format"] = "json"
-            model["content"] = nb_node
+            model["content"] = new_notebook(
+                cells=[], metadata={"deepnote": {"rawYamlString": yaml_text}}
+            )
             model["writable"] = False
-            self.mark_trusted_cells(nb_node, path)
-            self.validate_notebook_model(model, validation_error={})
 
             if require_hash:
                 # Accept 2- or 3-tuple; we only need the bytes

package.json

@@ -58,12 +58,17 @@
         "watch:labextension": "jupyter labextension watch ."
     },
     "dependencies": {
+        "@deepnote/blocks": "^1.0.0",
         "@jupyterlab/application": "^4.0.0",
         "@jupyterlab/coreutils": "^6.0.0",
         "@jupyterlab/notebook": "^4.4.7",
         "@jupyterlab/services": "^7.0.0",
         "@jupyterlab/settingregistry": "^4.0.0",
-        "@lumino/widgets": "^2.7.1"
+        "@lumino/widgets": "^2.7.1",
+        "@types/lodash": "^4.17.20",
+        "lodash": "^4.17.21",
+        "yaml": "^2.8.1",
+        "zod": "^4.1.11"
     },
     "devDependencies": {
         "@jupyterlab/builder": "^4.0.0",
@@ -141,19 +146,6 @@
             "@typescript-eslint"
         ],
         "rules": {
-            "@typescript-eslint/naming-convention": [
-                "error",
-                {
-                    "selector": "interface",
-                    "format": [
-                        "PascalCase"
-                    ],
-                    "custom": {
-                        "regex": "^I[A-Z]",
-                        "match": true
-                    }
-                }
-            ],
             "@typescript-eslint/no-unused-vars": [
                 "warn",
                 {

src/index.tsx → src/components/NotebookPicker.tsx

@@ -1,59 +1,9 @@
-import {
-  JupyterFrontEnd,
-  JupyterFrontEndPlugin
-} from '@jupyterlab/application';
 import React from 'react';
-import { IToolbarWidgetRegistry, ReactWidget } from '@jupyterlab/apputils';
-import {
-  INotebookWidgetFactory,
-  NotebookPanel,
-  NotebookWidgetFactory
-} from '@jupyterlab/notebook';
-import { Widget } from '@lumino/widgets';
+import { ReactWidget } from '@jupyterlab/apputils';
+import { NotebookPanel } from '@jupyterlab/notebook';
 import { HTMLSelect } from '@jupyterlab/ui-components';
 
-const plugin: JupyterFrontEndPlugin<void> = {
-  id: 'jupyterlab-deepnote:plugin',
-  description: 'Open .deepnote files as notebooks.',
-  autoStart: true,
-  requires: [INotebookWidgetFactory, IToolbarWidgetRegistry],
-  activate: (
-    app: JupyterFrontEnd,
-    notebookWidgetFactory: NotebookWidgetFactory,
-    toolbarRegistry: IToolbarWidgetRegistry
-  ) => {
-    app.docRegistry.addFileType(
-      {
-        name: 'deepnote',
-        displayName: 'Deepnote Notebook',
-        extensions: ['.deepnote'],
-        mimeTypes: ['text/yaml', 'application/x-yaml'],
-        fileFormat: 'text',
-        contentType: 'file'
-      },
-      [notebookWidgetFactory.name]
-    );
-
-    app.docRegistry.setDefaultWidgetFactory(
-      'deepnote',
-      notebookWidgetFactory.name
-    );
-
-    toolbarRegistry.addFactory<NotebookPanel>(
-      notebookWidgetFactory.name,
-      'deepnote:switch-notebook',
-      panel => {
-        if (!panel.context.path.endsWith('.deepnote')) {
-          return new Widget(); // don’t render for .ipynb or others
-        }
-
-        return new NotebookPicker(panel);
-      }
-    );
-  }
-};
-
-class NotebookPicker extends ReactWidget {
+export class NotebookPicker extends ReactWidget {
   private selected: string | null = null;
 
   constructor(private panel: NotebookPanel) {
@@ -68,7 +18,7 @@ class NotebookPicker extends ReactWidget {
           ? metadataNames
           : [];
 
-      this.selected = names.length > 0 ? names[0] : null;
+      this.selected = names.length === 0 ? null : (names[0] ?? null);
       this.update();
     });
   }
@@ -115,7 +65,6 @@ class NotebookPicker extends ReactWidget {
 
     return (
       <HTMLSelect
-        id="deepnote-notebook-picker"
         value={this.selected ?? '-'}
         onChange={this.handleChange}
         onKeyDown={() => {}}
@@ -141,5 +90,3 @@ class NotebookPicker extends ReactWidget {
     );
   }
 }
-
-export default plugin;

src/convert-deepnote-block-to-jupyter-cell.ts

@@ -0,0 +1,47 @@
+import {
+  createMarkdown,
+  createPythonCode,
+  DeepnoteBlock
+} from '@deepnote/blocks';
+import _cloneDeep from 'lodash/cloneDeep';
+import { ICodeCell, IMarkdownCell } from '@jupyterlab/nbformat';
+import { convertDeepnoteBlockTypeToJupyter } from './convert-deepnote-block-type-to-jupyter';
+
+export function convertDeepnoteBlockToJupyterCell(block: DeepnoteBlock) {
+  const blockCopy = _cloneDeep(block);
+  const jupyterCellMetadata = { ...blockCopy.metadata, cell_id: blockCopy.id };
+  const jupyterCellType = convertDeepnoteBlockTypeToJupyter(blockCopy.type);
+
+  if (jupyterCellType === 'code') {
+    const blockOutputs = blockCopy.outputs ?? [];
+
+    if (Array.isArray(blockOutputs)) {
+      blockOutputs.forEach(output => {
+        delete output.truncated;
+      });
+    }
+
+    const source = createPythonCode(blockCopy);
+
+    const jupyterCell: ICodeCell = {
+      cell_type: 'code',
+      metadata: jupyterCellMetadata,
+      execution_count:
+        blockCopy.executionCount !== undefined
+          ? blockCopy.executionCount
+          : null,
+      outputs: blockOutputs,
+      source
+    };
+    return jupyterCell;
+  } else {
+    // Markdown cell
+    const source = createMarkdown(blockCopy);
+    const jupyterCell: IMarkdownCell = {
+      cell_type: 'markdown',
+      metadata: {},
+      source
+    };
+    return jupyterCell;
+  }
+}

src/convert-deepnote-block-type-to-jupyter.ts

@@ -0,0 +1,32 @@
+export function convertDeepnoteBlockTypeToJupyter(blockType: string) {
+  switch (blockType) {
+    case 'big-number':
+    case 'code':
+    case 'sql':
+    case 'notebook-function':
+    case 'input-text':
+    case 'input-checkbox':
+    case 'input-textarea':
+    case 'input-file':
+    case 'input-select':
+    case 'input-date-range':
+    case 'input-date':
+    case 'input-slider':
+    case 'visualization':
+      return 'code';
+
+    case 'markdown':
+    case 'text-cell-h1':
+    case 'text-cell-h3':
+    case 'text-cell-h2':
+    case 'text-cell-p':
+    case 'text-cell-bullet':
+    case 'text-cell-todo':
+    case 'text-cell-callout':
+    case 'image':
+    case 'button':
+    case 'separator':
+    default:
+      return 'markdown';
+  }
+}

src/deepnote-content-provider.ts

@@ -0,0 +1,58 @@
+import { Contents, RestContentProvider } from '@jupyterlab/services';
+import { z } from 'zod';
+import { transformDeepnoteYamlToNotebookContent } from './transform-deepnote-yaml-to-notebook-content';
+
+export const deepnoteContentProviderName = 'deepnote-content-provider';
+
+const deepnoteNotebookSchema = z.object({
+  cells: z.array(z.any()), // or refine further with nbformat
+  metadata: z.object({
+    deepnote: z.object({
+      rawYamlString: z.string()
+    })
+  }),
+  nbformat: z.number(),
+  nbformat_minor: z.number()
+});
+
+export class DeepnoteContentProvider extends RestContentProvider {
+  async get(
+    localPath: string,
+    options?: Contents.IFetchOptions
+  ): Promise<Contents.IModel> {
+    const model = await super.get(localPath, options);
+    const isDeepnoteFile =
+      localPath.endsWith('.deepnote') && model.type === 'notebook';
+
+    if (!isDeepnoteFile) {
+      // Not a .deepnote file, return as-is
+      return model;
+    }
+
+    const validatedModelContent = deepnoteNotebookSchema.safeParse(
+      model.content
+    );
+
+    if (!validatedModelContent.success) {
+      console.error(
+        'Invalid .deepnote file content:',
+        validatedModelContent.error
+      );
+      // Return an empty notebook instead of throwing an error
+      model.content.cells = [];
+      return model;
+    }
+
+    const transformedModelContent =
+      await transformDeepnoteYamlToNotebookContent(
+        validatedModelContent.data.metadata.deepnote.rawYamlString
+      );
+
+    const transformedModel = {
+      ...model,
+      content: transformedModelContent
+    };
+
+    return transformedModel;
+  }
+}

src/fallback-data.ts

@@ -0,0 +1,30 @@
+import { ICodeCell } from '@jupyterlab/nbformat';
+import { IDeepnoteNotebookContent } from './types';
+
+export const blankCodeCell: ICodeCell = {
+  cell_type: 'code',
+  source: '',
+  metadata: {},
+  outputs: [],
+  execution_count: null
+};
+
+export const blankDeepnoteNotebookContent: IDeepnoteNotebookContent = {
+  cells: [
+    {
+      cell_type: 'code',
+      source: '# Transformed from Deepnote YAML\n',
+      metadata: {},
+      outputs: [],
+      execution_count: null
+    }
+  ],
+  metadata: {
+    deepnote: {
+      rawYamlString: null,
+      deepnoteFile: null
+    }
+  },
+  nbformat: 4,
+  nbformat_minor: 0
+};