add support for JupyterLab 4 (#100)

* fix formatting for jupyterlab 4 * upgrades dependencies * completer compatible with jupyter 4 (we need to connect it to the keywords) * fix * updates * updates index, removes highighting since it no longer works * adds sample codeeditor plugin * applying syntax highlighting * highlight working * clean up syntax highlighting * Fix the completer in Jupyterlab 4 (#99) * Fixes dependencies * Refactore syntax highlight plugin * Test requirements * Update yarn3 command * Update build dependencies in pyproject.toml * Fix jest * update snapshots * Remove syntax highlight (back from rebase), handles now by plugin_editor * update snapshots * last snapshot * Clean syntax highlighting plugin * Parameterized tests for completer --------- Co-authored-by: Eduardo Blancas <[email protected]>
ploomber · Jan 8, 2024 · a59de9c · a59de9c
1 parent b179578
commit a59de9c
Show file tree

Hide file tree

Showing 31 changed files with 14,237 additions and 11,019 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,6 @@
+# yarn
+.yarn
+
 # testing data
 .ini
 .nox

diff --git a/.yarnrc.yml b/.yarnrc.yml
@@ -0,0 +1,3 @@
+enableImmutableInstalls: false
+
+nodeLinker: node-modules
diff --git a/jest.config.js b/jest.config.js
@@ -3,6 +3,7 @@ const jestJupyterLab = require('@jupyterlab/testutils/lib/jest-config');
 const esModules = [
   '@jupyterlab/',
   'lib0',
+  'nanoid',
   'y\\-protocols',
   'y\\-websocket',
   'yjs'
@@ -36,11 +37,7 @@ module.exports = {
   ],
   coverageDirectory: 'coverage',
   coverageReporters: ['lcov', 'text'],
-  globals: {
-    'ts-jest': {
-      tsconfig: 'tsconfig.json'
-    }
-  },
   testRegex: 'src/.*/.*.spec.ts[x]?$',
-  transformIgnorePatterns: [`/node_modules/(?!${esModules}).+`]
+  transformIgnorePatterns: [`/node_modules/(?!${esModules}).+`],
+  testEnvironment: 'jsdom'
 };
diff --git a/noxfile.py b/noxfile.py
@@ -14,7 +14,7 @@ def _setup(session):
     )
 
     # on github actions, we often get a timeout when installing the dependencies
-    session.run("jlpm", "config", "set", "network-timeout", "600000", "-g")
+    session.run("jlpm", "config", "set", "httpTimeout", "600000")
 
     session.run("jlpm", "install")
     session.install("-e", ".")

diff --git a/package.json b/package.json
@@ -71,14 +71,16 @@
         "@emotion/react": "^11.11.0",
         "@emotion/styled": "^11.11.0",
         "@jupyter-widgets/base": "^6.0.4",
-        "@jupyterlab/application": "^3.6.2",
-        "@jupyterlab/codeeditor": "^3.6.2",
-        "@jupyterlab/codemirror": "^3.6.3",
-        "@jupyterlab/completer": "^3.6.2",
-        "@jupyterlab/notebook": "^3.6.2",
-        "@jupyterlab/settingregistry": "^3.6.5",
-        "@jupyterlab/statedb": "^3.6.2",
-        "@lumino/widgets": "<2.0.0",
+        "@jupyterlab/application": "^4.0.5",
+        "@jupyterlab/apputils": "^4.1.5",
+        "@jupyterlab/cells": "^4.0.5",
+        "@jupyterlab/codeeditor": "^4.0.5",
+        "@jupyterlab/codemirror": "^4.0.5",
+        "@jupyterlab/completer": "^4.0.5",
+        "@jupyterlab/notebook": "^4.0.5",
+        "@jupyterlab/settingregistry": "^4.0.5",
+        "@jupyterlab/statedb": "^4.0.5",
+        "@lumino/widgets": "^2.3.0",
         "@mui/icons-material": "^5.11.16",
         "@mui/material": "^5.13.4",
         "@types/codemirror": "^5.60.7",
@@ -92,19 +94,19 @@
     "devDependencies": {
         "@babel/core": "^7.0.0",
         "@babel/preset-env": "^7.0.0",
-        "@jupyterlab/builder": "^3.1.0",
-        "@jupyterlab/testutils": "^3.0.0",
+        "@jupyterlab/builder": "^4.0.5",
+        "@jupyterlab/testutils": "^4.0.5",
         "@testing-library/jest-dom": "^5.16.5",
         "@testing-library/react": "^12.1.2",
         "@types/bootstrap": "^5.2.6",
-        "@types/jest": "^26.0.0",
+        "@types/jest": "^29.0.0",
         "@types/jest-when": "^3.5.2",
         "@typescript-eslint/eslint-plugin": "^4.8.1",
         "@typescript-eslint/parser": "^4.8.1",
         "eslint": "^7.14.0",
         "eslint-config-prettier": "^6.15.0",
         "eslint-plugin-prettier": "^3.1.4",
-        "jest": "^26.0.0",
+        "jest": "^29.0.0",
         "jest-when": "^3.5.2",
         "npm-run-all": "^4.1.5",
         "prettier": "^2.1.1",
@@ -115,7 +117,7 @@
         "stylelint-config-recommended": "^6.0.0",
         "stylelint-config-standard": "~24.0.0",
         "stylelint-prettier": "^2.0.0",
-        "ts-jest": "^26.0.0",
+        "ts-jest": "^29.0.0",
         "typescript": "^4.1.3"
     },
     "sideEffects": [
@@ -132,4 +134,4 @@
         "outputDir": "jupysql_plugin/labextension",
         "sharedPackages": {}
     }
-}
+}
diff --git a/pyproject.toml b/pyproject.toml
@@ -1,7 +1,7 @@
 [build-system]
 requires = [
-    "hatchling>=1.4.0",
-    "jupyterlab>=3.4.7,<4.0.0",
+    "hatchling>=1.10.0",
+    "jupyterlab>=4.0.0",
     "hatch-nodejs-version",
 ]
 build-backend = "hatchling.build"
@@ -14,7 +14,7 @@ requires-python = ">=3.7"
 classifiers = [
     "Framework :: Jupyter",
     "Framework :: Jupyter :: JupyterLab",
-    "Framework :: Jupyter :: JupyterLab :: 3",
+    "Framework :: Jupyter :: JupyterLab :: 4",
     "Framework :: Jupyter :: JupyterLab :: Extensions",
     "Framework :: Jupyter :: JupyterLab :: Extensions :: Prebuilt",
     "License :: OSI Approved :: BSD License",
@@ -72,7 +72,7 @@ version_cmd = "hatch version"
 
 [tool.jupyter-releaser.hooks]
 before-build-npm = [
-    "python -m pip install jupyterlab~=3.1",
+    "python -m pip install jupyterlab~=4.0",
     "jlpm",
     "jlpm build:prod",
 ]

diff --git a/requirements.txt b/requirements.txt
@@ -1,4 +1,4 @@
-jupyterlab<4 # this will install jlpm
+jupyterlab>=4
 build
 twine
 hatch

diff --git a/src/__tests__/dialog.spec.tsx b/src/__tests__/dialog.spec.tsx
@@ -14,15 +14,15 @@ const DEFAULT_INVALID_API_KEY = "invalid_api_key"
 const DEFAULT_PROJECT_ID = "project_id_abc"
 const DEFAULT_JOB_ID = "job_id_abc"
 
-/* 
+/*
 Mock the GET /apikey API
 */
 const mockEnvWithAPI = (APIKey: any = null) => {
     when((requestAPI as jest.Mock)).calledWith("apikey").mockResolvedValue({
         data: APIKey
     })
 }
-/* 
+/*
 Mock the POST /apikey API
 */
 const mockPostAPI = (result: any, api_key: string) => {
@@ -35,7 +35,7 @@ const mockPostAPI = (result: any, api_key: string) => {
 Mock the job deploy API
 There are three types of responses we are mocking:
 1. Successful first time deployment of the notebook, the projectID should be skipped
-2. Successful re-deplyoment of the notebook, the projectID should be provided 
+2. Successful re-deplyoment of the notebook, the projectID should be provided
 3. Failure deployment of the notebook, the projectID and the deployment_result should be provided
 */
 const mockJobDeployResult = (projectID = "", deployment_result: object = {
@@ -80,7 +80,7 @@ describe("Test DeployDialogContent ", () => {
             })
         })
 
-        /* 
+        /*
         Test Flow: When the user inputs invalid API Key
         */
         test("Test Invalid API Key Input", async () => {
@@ -97,8 +97,8 @@ describe("Test DeployDialogContent ", () => {
             })
         })
 
-        /* 
-        Test Flow: 
+        /*
+        Test Flow:
         1. When the user inputs valid API Key
         2. We will see the deploy button in next (assume the user)
         */
@@ -135,7 +135,7 @@ describe("Test DeployDialogContent ", () => {
             expect(await screen.getByRole('button')).toHaveTextContent('CONFIRM')
 
         })
-        /* 
+        /*
         Test Flow: When the notebook has not been deployed before
         */
         test("Test First Time Deployment Click Confim", async () => {
@@ -150,18 +150,16 @@ describe("Test DeployDialogContent ", () => {
             expect(await screen.findByText("Check your deployment status here:")).toBeVisible()
             expect(await screen.findByText(`https://platform.ploomber.io/dashboards/${DEFAULT_PROJECT_ID}/${DEFAULT_JOB_ID}`)).toBeVisible()
         })
-        /* 
+        /*
         Test Flow: When the notebook has been deployed before
         */
         test("Test Existing Project Re-deployment Success", async () => {
             mockJobDeployResult(DEFAULT_PROJECT_ID);
             renderDeployDialogContent(DEFAULT_PROJECT_ID);
-            // TODO: Somehow we need to wait for few seconds to pass the test
-            await new Promise((r) => setTimeout(r, 3000));
             expect(await screen.findByText("Check your deployment status here:")).toBeVisible()
             expect(await screen.findByText(`https://platform.ploomber.io/dashboards/${DEFAULT_PROJECT_ID}/${DEFAULT_JOB_ID}`)).toBeVisible()
         })
-        /* 
+        /*
         Test Flow: When the community user deploys more than one active project
         */
         test("Test Community Users Only One Project Fail", async () => {
@@ -171,7 +169,7 @@ describe("Test DeployDialogContent ", () => {
             renderDeployDialogContent(DEFAULT_PROJECT_ID);
             expect(await screen.findByText("Community users are only allowed to have a single active project. Delete your current project to create a new one.")).toBeVisible()
         })
-        /* 
+        /*
         Test Flow: When the directiory does not contain requirements.txt file
         */
         test("Test requirements.txt file is missing in directiory", async () => {

diff --git a/src/completer/connector.ts b/src/completer/connector.ts