Migrate Elyra extensions to support JupyterLab 4.x

.eslintrc.json

@@ -11,9 +11,16 @@
   "rules": {
     "react/prop-types": "off",
     "func-style": "error",
-    "@typescript-eslint/interface-name-prefix": [
+    "@typescript-eslint/naming-convention": [
       "error",
-      { "prefixWithI": "always" }
+      {
+        "selector": "interface",
+        "format": ["PascalCase"],
+        "custom": {
+          "regex": "^I[A-Z]",
+          "match": true
+        }
+      }
     ],
     "@typescript-eslint/no-unused-vars": ["warn", { "args": "none" }],
     "@typescript-eslint/no-use-before-define": "off",

.github/workflows/build.yml

@@ -32,7 +32,8 @@ jobs:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: "*"
+          node-version: "20.11.0"
+      - run: npm install -g [email protected]
       - uses: actions/cache@v3
         with:
           path: |
@@ -41,8 +42,10 @@ jobs:
             /home/runner/.cache/Cypress
           key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
       - name: Install
-        run: yarn install --frozen-lockfile && tsc -v
-
+        run: |
+          yarn --version
+          yarn install && tsc -v
+          # --frozen-lockfile
   lint-server:
     name: Lint Server
     runs-on: ubuntu-latest

.gitignore

@@ -90,3 +90,5 @@ tsconfig.tsbuildinfo
 node_modules
 
 .vscode/
+
+.yarn/

.yarnrc.yml

@@ -0,0 +1,5 @@
+enableImmutableInstalls: false
+
+nodeLinker: node-modules
+
+yarnPath: .yarn/releases/yarn-3.5.0.cjs

build_requirements.txt

@@ -1,3 +1,3 @@
-jupyterlab>=3.4.6,<4.0
+jupyterlab>=4.0,<4.1
 jupyter-packaging>=0.10
 build

create-release.py

@@ -862,25 +862,25 @@ def initialize_config(args=None) -> SimpleNamespace:
         "source_dir": os.path.join(os.getcwd(), DEFAULT_BUILD_DIR, "elyra"),
         "old_version": elyra._version.__version__,
         "old_npm_version": f"{v['major']}.{v['minor']}.{v['patch']}-dev",
-        "new_version": args.version
-        if (not args.rc or not str.isdigit(args.rc)) and (not args.beta or not str.isdigit(args.beta))
-        else f"{args.version}rc{args.rc}"
-        if args.rc
-        else f"{args.version}b{args.beta}",
-        "new_npm_version": args.version
-        if (not args.rc or not str.isdigit(args.rc)) and (not args.beta or not str.isdigit(args.beta))
-        else f"{args.version}-rc.{args.rc}"
-        if args.rc
-        else f"{args.version}-beta.{args.beta}",
+        "new_version": (
+            args.version
+            if (not args.rc or not str.isdigit(args.rc)) and (not args.beta or not str.isdigit(args.beta))
+            else f"{args.version}rc{args.rc}" if args.rc else f"{args.version}b{args.beta}"
+        ),
+        "new_npm_version": (
+            args.version
+            if (not args.rc or not str.isdigit(args.rc)) and (not args.beta or not str.isdigit(args.beta))
+            else f"{args.version}-rc.{args.rc}" if args.rc else f"{args.version}-beta.{args.beta}"
+        ),
         "rc": args.rc,
         "beta": args.beta,
         "dev_version": f"{args.dev_version}.dev0",
         "dev_npm_version": f"{args.dev_version}-dev",
-        "tag": f"v{args.version}"
-        if (not args.rc or not str.isdigit(args.rc)) and (not args.beta or not str.isdigit(args.beta))
-        else f"v{args.version}rc{args.rc}"
-        if args.rc
-        else f"v{args.version}b{args.beta}",
+        "tag": (
+            f"v{args.version}"
+            if (not args.rc or not str.isdigit(args.rc)) and (not args.beta or not str.isdigit(args.beta))
+            else f"v{args.version}rc{args.rc}" if args.rc else f"v{args.version}b{args.beta}"
+        ),
         "pre_release": True if (args.rc or args.beta) else False,
     }
 

elyra/_version.py

@@ -13,4 +13,4 @@
 # See the License for the specific language governing permissions and
 # limitations under the License.
 #
-__version__ = "3.16.0.dev0"
+__version__ = "4.0.0.dev0"

elyra/pipeline/kfp/kfp_properties.py

@@ -40,7 +40,7 @@ class KfpPropertyInputType(PropertyInputType):
         # "GCRPath": {"type_hint": "GCRPath", "json_type": "string", "default_value": "", "placeholder": "gcr.io/"},
         # "GCPRegion": {"type_hint": "GCPRegion", "json_type": "string", "default_value": ""},
         # "GCPProjectID": {"type_hint": "GCPProjectID", "json_type": "string", "default_value": ""},
-        "CustomString": {"json_type": "string", "type_title": "String-valued parameter of arbitrary type"}
+        "CustomString": {"json_type": "string", "type_title": "String-valued parameter of arbitrary type"},
         # "List": {"type_hint": "list", "json_type": "array", "default_value": []},  # not yet supported by frontend
         # "Dict": {"type_hint": "dict", "json_type": "object", "default_value": {}},  # not yet supported by frontend
     }

elyra/pipeline/kfp/processor_kfp.py

@@ -572,8 +572,8 @@ def _generate_pipeline_dsl(
         # Add filter that escapes the " character in strings
         template_env.filters["string_delimiter_safe"] = lambda string: re.sub('"', '\\"', string)
         # Add filter that converts a value to a python variable value (e.g. puts quotes around strings)
-        template_env.filters["param_val_to_python_var"] = (
-            lambda p: "None" if p.value is None else (f'"{p.value}"' if p.input_type.base_type == "String" else p.value)
+        template_env.filters["param_val_to_python_var"] = lambda p: (
+            "None" if p.value is None else (f'"{p.value}"' if p.input_type.base_type == "String" else p.value)
         )
         template = template_env.get_template("python_dsl_template.jinja2")
 

elyra/util/http.py

@@ -59,12 +59,12 @@ def write_error(self, status_code, **kwargs):
             else:
                 if isinstance(exception, Exception) and exception.args:
                     if isinstance(exception.args[0], Exception):
-                        reply[
-                            "message"
-                        ] = f"Error. The server sent an invalid response.\
+                        reply["message"] = (
+                            f"Error. The server sent an invalid response.\
                             \nPlease open an issue and provide this error message,\
                             any error details, and any related JupyterLab log messages.\
                             \n\nError found:\n{str(exception.args[0])}"
+                        )
                     else:
                         reply["message"] = str(exception.args[0])
                 else:

etc/scripts/generate-make-graph.ts

@@ -63,7 +63,7 @@ make.stdout.on('data', (data: Buffer) => {
       graph.push({
         type: 'target',
         name,
-        depth: depthString.length / 2
+        depth: depthString.length / 2,
       });
       continue;
     }
@@ -79,7 +79,7 @@ make.stdout.on('data', (data: Buffer) => {
       depth = depthString.length / 2;
       graph.push({
         type: 'end',
-        depth
+        depth,
       });
       depth = undefined;
       continue;
@@ -89,7 +89,7 @@ make.stdout.on('data', (data: Buffer) => {
       graph.push({
         type: 'code',
         value: msg.toString(),
-        depth
+        depth,
       });
       continue;
     }
@@ -107,7 +107,7 @@ const printGraph = (): void => {
       const spacer = ' '.repeat(cellWidth - g.name.length - 2);
       console.log(`${padLeft}┌${bar}┐${padRight}`);
       console.log(
-        `${padLeft}│ ${chalk.cyan.bold(g.name)}${spacer} |${padRight}`
+        `${padLeft}│ ${chalk.cyan.bold(g.name)}${spacer} |${padRight}`,
       );
       continue;
     }

lerna.json

@@ -1,7 +1,6 @@
 {
-  "version": "3.16.0-dev",
+  "version": "4.0.0-dev",
   "npmClient": "yarn",
-  "useWorkspaces": true,
   "command": {
     "publish": {
       "ignoreChanges": ["ignored-file", "*.md"],

package.json

@@ -1,6 +1,6 @@
 {
   "name": "elyra",
-  "version": "3.16.0-dev",
+  "version": "4.0.0-dev",
   "private": true,
   "workspaces": {
     "packages": [
@@ -30,56 +30,59 @@
     }
   },
   "resolutions": {
-    "@types/react": "^17.0.0",
-    "@types/react-dom": "^17.0.0",
-    "@types/react-intl": "^3.0.0",
-    "ansi-html": "^0.0.8",
-    "ejs": "^3.1.7",
+    "@types/react": "^18.0.26",
+    "@types/react-dom": "^18.0.9",
+    "ansi-html": "^0.0.9",
+    "ejs": "^3.1.9",
     "cypress": "^6.2.0",
     "glob-parent": "^5.1.2",
     "node-forge": "^1.3.0",
-    "react": "^17.0.1",
-    "react-dev-utils": "^12.0.0",
-    "react-dom": "^17.0.1",
-    "react-intl": "^3.0.0",
-    "trim-newlines": "^3.0.1"
+    "react": "^18.2.0",
+    "react-dev-utils": "^12.0.1",
+    "react-dom": "^18.0.9",
+    "react-intl": "^6.5.5",
+    "trim-newlines": "^5.0.0",
+    "yjs": "^13.5.40"
   },
   "devDependencies": {
     "@4tw/cypress-drag-drop": "^1.3.1",
     "@cypress/webpack-preprocessor": "^5.5.0",
-    "@jupyterlab/testutils": "^3.4.6",
+    "@jupyterlab/testutils": "^4.0.6",
     "@testing-library/cypress": "^7.0.4",
     "@types/jest": "^26.0.20",
     "@types/lodash": "^4.14.170",
     "@types/node": "^15.0.1",
-    "@types/react": "^17.0.0",
-    "@types/react-dom": "~17.0.0",
-    "@types/react-intl": "^3.0.0",
-    "@typescript-eslint/eslint-plugin": "~2.23.0",
-    "@typescript-eslint/parser": "~2.23.0",
+    "@types/react": "^18.0.26",
+    "@types/react-dom": "~18.0.9",
+    "@typescript-eslint/eslint-plugin": "~6.13.2",
+    "@typescript-eslint/parser": "~6.13.2",
     "cypress": "^6.2.0",
-    "eslint": "^6.5.0",
-    "eslint-config-prettier": "^6.9.0",
-    "eslint-plugin-cypress": "^2.11.2",
-    "eslint-plugin-header": "^3.0.0",
-    "eslint-plugin-import": "^2.20.2",
-    "eslint-plugin-mocha": "^9.0.0",
-    "eslint-plugin-prettier": "^3.1.2",
-    "eslint-plugin-react": "^7.18.3",
-    "eslint-plugin-react-hooks": "^4.1.2",
-    "husky": "^2.3.0",
-    "jest": "^26.6.3",
+    "eslint": "~8.55.0",
+    "eslint-config-prettier": "~9.1.0",
+    "eslint-plugin-cypress": "^2.15.1",
+    "eslint-plugin-header": "^3.1.1",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jest": "~27.6.0",
+    "eslint-plugin-mocha": "^10.2.0",
+    "eslint-plugin-prettier": "~5.0.1",
+    "eslint-plugin-react": "~7.33.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "husky": "^8.0.3",
+    "jest": "^29.7.0",
     "jest-raw-loader": "^1.0.1",
-    "lerna": "^5.5.0",
-    "lint-staged": "^9.5.0",
+    "lerna": "^8.0.1",
+    "lint-staged": "^15.2.0",
     "npm-run-all": "^4.1.5",
-    "prettier": "^1.19.1",
-    "rimraf": "~3.0.2",
-    "start-server-and-test": "^1.12.1",
-    "ts-jest": "^26.4.4",
-    "ts-loader": "^6.2.2",
-    "ts-node": "^9.1.1",
-    "typescript": "~4.1.3",
-    "webpack": "^5.0.0"
-  }
+    "prettier": "^3.1.1",
+    "rimraf": "~5.0.5",
+    "start-server-and-test": "^2.0.3",
+    "ts-jest": "^29.1.1",
+    "ts-loader": "^9.5.1",
+    "ts-node": "^10.9.2",
+    "typedoc": "~0.24.7",
+    "typedoc-plugin-mdn-links": "^3.0.3",
+    "typescript": "~5.1.6",
+    "webpack": "^5.76.1"
+  },
+  "packageManager": "[email protected]"
 }

packages/code-snippet/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elyra/code-snippet-extension",
-  "version": "3.16.0-dev",
+  "version": "4.0.0-dev",
   "description": "JupyterLab extension - Reusable code snippets for your Notebook and Python Scripts",
   "keywords": [
     "jupyter",
@@ -43,35 +43,35 @@
     "unlink:dev": "yarn unlink @jupyterlab/builder"
   },
   "dependencies": {
-    "@elyra/metadata-common": "3.16.0-dev",
-    "@elyra/services": "3.16.0-dev",
-    "@elyra/ui-components": "3.16.0-dev",
-    "@jupyterlab/application": "^3.4.6",
-    "@jupyterlab/apputils": "^3.4.6",
-    "@jupyterlab/builder": "^3.4.6",
-    "@jupyterlab/cells": "^3.4.6",
-    "@jupyterlab/codeeditor": "^3.4.6",
-    "@jupyterlab/coreutils": "^5.4.6",
-    "@jupyterlab/docmanager": "^3.4.6",
-    "@jupyterlab/docregistry": "^3.4.6",
-    "@jupyterlab/fileeditor": "^3.4.6",
-    "@jupyterlab/mainmenu": "^3.4.6",
-    "@jupyterlab/markdownviewer": "^3.4.6",
-    "@jupyterlab/notebook": "^3.4.6",
-    "@jupyterlab/ui-components": "^3.4.6",
-    "@lumino/algorithm": "^1.3.3",
-    "@lumino/coreutils": "^1.5.6",
-    "@lumino/messaging": "^1.4.3",
-    "@lumino/signaling": "^1.4.3",
-    "@lumino/widgets": "^1.19.0",
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1"
+    "@elyra/metadata-common": "4.0.0-dev",
+    "@elyra/services": "4.0.0-dev",
+    "@elyra/ui-components": "4.0.0-dev",
+    "@jupyterlab/application": "^4.0.6",
+    "@jupyterlab/apputils": "^4.1.6",
+    "@jupyterlab/builder": "^4.0.6",
+    "@jupyterlab/cells": "^4.0.6",
+    "@jupyterlab/codeeditor": "^4.0.6",
+    "@jupyterlab/coreutils": "^6.0.6",
+    "@jupyterlab/docmanager": "^4.0.6",
+    "@jupyterlab/docregistry": "^4.0.6",
+    "@jupyterlab/fileeditor": "^4.0.6",
+    "@jupyterlab/mainmenu": "^4.0.6",
+    "@jupyterlab/markdownviewer": "^4.0.6",
+    "@jupyterlab/notebook": "^4.0.6",
+    "@jupyterlab/ui-components": "^4.0.6",
+    "@lumino/algorithm": "*",
+    "@lumino/coreutils": "^2.1.2",
+    "@lumino/messaging": "^2.0.1",
+    "@lumino/signaling": "^2.1.2",
+    "@lumino/widgets": "^2.3.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.0.9"
   },
   "devDependencies": {
-    "@types/react": "^17.0.0",
-    "@types/react-dom": "^17.0.0",
-    "rimraf": "^3.0.2",
-    "typescript": "~4.1.3"
+    "@types/react": "^18.0.26",
+    "@types/react-dom": "^18.0.9",
+    "rimraf": "~5.0.5",
+    "typescript": "~5.1.6"
   },
   "publishConfig": {
     "access": "public"

packages/code-snippet/src/CodeSnippetService.ts

@@ -57,13 +57,13 @@ export class CodeSnippetService {
   static deleteCodeSnippet(codeSnippet: IMetadata): Promise<boolean> {
     return showDialog({
       title: `Delete snippet '${codeSnippet.display_name}'?`,
-      buttons: [Dialog.cancelButton(), Dialog.okButton()]
+      buttons: [Dialog.cancelButton(), Dialog.okButton()],
     }).then((result: any) => {
       // Do nothing if the cancel button is pressed
       if (result.button.accept) {
         return MetadataService.deleteMetadata(
           CODE_SNIPPET_SCHEMASPACE,
-          codeSnippet.name
+          codeSnippet.name,
         ).then(() => true);
       } else {
         return false;