AP-19528: Update code to support typescript config.

 - Define new Type according to typescript config.
 - Update knime-ui-extension-service to npm package.
 - Add type for svg files.
 - Update submodules.
 - Update .project.
 - Update pom.xml
 - versions need to be
 - monaco-editor: 0.34.1,
 - monaco-languageclient: 4.0.1, see github issue on languageclient.'

AP-19528: (Update the scripting editor frontend to vue3).

Author: David

.gitmodules

@@ -0,0 +1,8 @@
+[submodule "org.knime.python3.js.scripting/js-src/python-scripting-editor/webapps-common"]
+	path = org.knime.python3.js.scripting/js-src/python-scripting-editor/webapps-common
+	url = ../webapps-common
+	branch = vue3
+[submodule "org.knime.python3.js.scripting/js-src/python-scripting-editor/knime-scripting-editor"]
+	path = org.knime.python3.js.scripting/js-src/python-scripting-editor/knime-scripting-editor
+	url = ../knime-scripting-editor
+	branch = enh/AP-19528-update-the-the-scripting-editor

.project

@@ -14,4 +14,15 @@
 	<natures>
 		<nature>org.eclipse.m2e.core.maven2Nature</nature>
 	</natures>
+	<filteredResources>
+		<filter>
+			<id>1667292967902</id>
+			<name></name>
+			<type>30</type>
+			<matcher>
+				<id>org.eclipse.core.resources.regexFilterMatcher</id>
+				<arguments>node_modules|\.git|__CREATED_BY_JAVA_LANGUAGE_SERVER__</arguments>
+			</matcher>
+		</filter>
+	</filteredResources>
 </projectDescription>

README.md

@@ -49,3 +49,4 @@ You can find instructions on how to work with our code or develop extensions for
 ## Join the Community
 
 * [KNIME Forum](https://tech.knime.org/forum/knime-textprocessing)
+

org.knime.python3.js.scripting/js-src/python-scripting-editor/.eslintrc.js

@@ -17,5 +17,6 @@ module.exports = {
                 ]
             }
         }
-    }
+    },
+    ignorePatterns: ['webapps-common/*']
 };

org.knime.python3.js.scripting/js-src/python-scripting-editor/package-lock.json

@@ -11,10 +11,12 @@
     "build-only": "vite build",
     "type-check": "vue-tsc --noEmit",
     "lint": "run-p lint:*",
+    "audit": "npm audit --omit dev",
     "lint:js": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
     "lint:css": "stylelint '**/*.{css,vue}' --fix"
   },
   "dependencies": {
+    "@knime/ui-extension-service": "^0.3.0",
     "@vue/compiler-sfc": "^3.2.40",
     "package.json": "^2.0.1",
     "path-browserify": "^1.0.1",
@@ -23,24 +25,29 @@
     "webapps-common": "file:webapps-common"
   },
   "devDependencies": {
-    "@knime/eslint-config": "7.0.4",
-    "@types/node": "^18.7.12",
+    "@knime/eslint-config": "7.0.5",
+    "@rushstack/eslint-patch": "^1.2.0",
+    "@types/node": "^18.11.9",
     "@vitejs/plugin-vue": "^3.0.1",
     "@vue/tsconfig": "^0.1.3",
-    "eslint": "8.23.0",
+    "consola": "^2.15.3",
+    "eslint": "8.25.0",
+    "i": "^0.3.7",
+    "npm": "^8.19.2",
     "npm-run-all": "^4.1.5",
     "postcss-preset-env": "^7.8.1",
     "stylelint": "^14.11.0",
     "typescript": "~4.7.4",
     "vite": "^3.0.4",
     "vite-plugin-monaco-editor": "^1.1.0",
     "vite-svg-loader": "3.5.1",
-    "vue-tsc": "^1.0.3"
+    "vite-tsconfig-paths": "^3.5.2",
+    "vue-tsc": "^1.0.9"
   },
   "engines": {
     "node": "18.x"
   },
   "volta": {
-    "node": "18.0.0"
+    "node": "18.10.0"
   }
 }

org.knime.python3.js.scripting/js-src/python-scripting-editor/package.json

@@ -23,8 +23,8 @@
 		<sonar.exclusions>node_modules/**/*,dist/**/*,src/dev/**/*,.nyc_output/**/*,coverage/**/*,*.log,config/**/*,**/config.js,**/*.config.js,buildtools/**,webapps-common/**</sonar.exclusions>
 		<sonar.css.stylelint.reportPaths>target/stylelint.json</sonar.css.stylelint.reportPaths>
 		<sonar.eslint.reportPaths>target/eslint.json</sonar.eslint.reportPaths>
-		<node.version>v16.15.1</node.version>
-		<npm.version>8.11.0</npm.version>
+		<node.version>v18.10.0</node.version>
+		<npm.version>8.19.2</npm.version>
 	</properties>
 
 	<build>
@@ -48,8 +48,9 @@
 						</configuration>
 					</execution>
 
+
 					<execution>
-						<id>npm ci</id>
+						<id>npm install</id>
 						<phase>initialize</phase>
 						<goals>
 							<goal>npm</goal>
@@ -61,36 +62,35 @@
 
 					<execution>
 						<id>npm run build</id>
-						<phase>compile</phase>
+						<phase>initialize</phase>
 						<goals>
 							<goal>npm</goal>
 						</goals>
 						<configuration>
 							<arguments>run build</arguments>
 						</configuration>
 					</execution>
-
 					<execution>
-						<id>npm run audit</id>
+						<id>npm run type-check</id>
 						<phase>verify</phase>
 						<goals>
 							<goal>npm</goal>
 						</goals>
 						<configuration>
-							<arguments>run audit</arguments>
+							<arguments>run type-check</arguments>
 						</configuration>
 					</execution>
-
 					<execution>
 						<id>npm run lint</id>
 						<phase>verify</phase>
 						<goals>
 							<goal>npm</goal>
 						</goals>
 						<configuration>
-							<arguments>run lint:ci</arguments>
+							<arguments>run lint:js</arguments>
 						</configuration>
 					</execution>
+
 				</executions>
 			</plugin>
 			<plugin>

org.knime.python3.js.scripting/js-src/python-scripting-editor/pom.xml

@@ -31,7 +31,7 @@ export default defineComponent({
       {{ port.variableName }}
       <ul v-if="port.type === 'table'">
         <li
-          v-for="column in port.columnNames"
+          v-for="column in port?.columnNames"
           :key="column"
         >
           {{ column }}

org.knime.python3.js.scripting/js-src/python-scripting-editor/src/components/InputPortsView.vue

@@ -0,0 +1,4 @@
+declare module '*.svg' {
+  const content: any;
+  export default content;
+}