Aditional updates

Signed-off-by: Luciano Resende <[email protected]>

Author: lresende

jest.config.base.js

@@ -23,4 +23,13 @@ module.exports = {
     // Ignore snapshot tests.
     "!**/*.snap.test.{ts,tsx}",
   ],
+  transformIgnorePatterns: [
+    "node_modules/(?!(uuid|@elyra/canvas)/)"
+  ],
+  extensionsToTreatAsEsm: ['.ts', '.tsx'],
+  globals: {
+    'ts-jest': {
+      useESM: true
+    }
+  }
 };

package.json

@@ -37,14 +37,18 @@
     "eslint-plugin-testing-library": "^3.10.1",
     "husky": "^8.0.3",
     "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.0.0",
     "lerna": "^8.0.1",
     "lint-staged": "^15.2.0",
     "microbundle": "^0.15.1",
     "prettier": "^3.1.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "rimraf": "~5.0.5",
     "start-server-and-test": "^2.0.3",
     "ts-jest": "^29.1.1",
-    "typescript": "5.1.6"
+    "typescript": "~5.5.4",
+    "webpack": "^5.0.0"
   },
   "husky": {
     "hooks": {

packages/pipeline-editor/package.json

@@ -21,6 +21,7 @@
     "link": "yarn link"
   },
   "dependencies": {
+    "@carbon/icons-react": "^10.44.0",
     "@elyra/canvas": "^12.23.2",
     "@elyra/pipeline-services": "^1.12.1",
     "@rjsf/core": "^4.2.3",
@@ -32,13 +33,14 @@
     "downshift": "^6.1.2",
     "immer": "^9.0.7",
     "nanoid": "^3.1.20",
-    "react-dom": "^18.0.9",
+    "react-dom": "^18.2.0",
     "react-intl": "^6.5.5",
     "react-redux": "^7.0.0",
-    "redux": "^4.0.5",
+    "redux": "^4.2.0",
     "styled-components": "^6.0.7"
   },
   "devDependencies": {
+    "@testing-library/dom": "^7.21.4",
     "@testing-library/jest-dom": "^5.11.9",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^12.8.0",

packages/pipeline-editor/src/PalettePanel/index.tsx

@@ -105,7 +105,7 @@ interface Props {
 }
 
 function PalettePanel({ nodes }: Props) {
-  const handleDragStart = useCallback((e, node) => {
+  const handleDragStart = useCallback((e: any, node: any) => {
     const evData = {
       operation: "addToCanvas",
       data: {

packages/pipeline-editor/src/PipelineEditor/index.tsx

@@ -235,7 +235,7 @@ const PipelineEditor = forwardRef(
         }
         // don't call to persist change because it will cause an infinity loop
       } catch (e) {
-        onError?.(e);
+        onError?.(e instanceof Error ? e : new Error(String(e)));
       }
     }, [palette, onError, pipeline, readOnly, theme.palette.error.main]);
 
@@ -604,15 +604,15 @@ const PipelineEditor = forwardRef(
     );
 
     const handlePropertiesChange = useCallback(
-      (nodeID, data) => {
+      (nodeID: string, data: any) => {
         controller.current.updateProperties(nodeID, data);
         onChange?.(controller.current.getPipelineFlow());
       },
       [onChange]
     );
 
     const handlePipelinePropertiesChange = useCallback(
-      (data) => {
+      (data: any) => {
         const pipeline = controller.current.getPipelineFlow();
         if (pipeline?.pipelines?.[0]?.app_data) {
           pipeline.pipelines[0].app_data.properties = {
@@ -627,7 +627,7 @@ const PipelineEditor = forwardRef(
     );
 
     const handlePipelineParametersChange = useCallback(
-      (data) => {
+      (data: any) => {
         const pipeline = controller.current.getPipelineFlow();
         if (pipeline?.pipelines?.[0]?.app_data) {
           pipeline.pipelines[0].app_data.properties = {

packages/pipeline-editor/src/ThemeProvider/index.tsx

@@ -95,7 +95,7 @@ function mergeThemes(systemInfo: {
   };
 }
 
-const ThemeProvider: React.FC<{ theme: DeepPartial<Theme> }> = ({
+const ThemeProvider: React.FC<{ theme: DeepPartial<Theme>; children?: React.ReactNode }> = ({
   theme,
   children,
 }) => {
@@ -104,9 +104,14 @@ const ThemeProvider: React.FC<{ theme: DeepPartial<Theme> }> = ({
   );
 };
 
-export const InternalThemeProvider: React.FC = ({ children }) => {
+export const InternalThemeProvider: React.FC<{ children?: React.ReactNode }> = ({ children }) => {
   const systemInfo = useSystemInfo();
-  const theme = useMemo(() => mergeThemes(systemInfo), [systemInfo]);
+  const theme = useMemo(() => {
+    return deepmerge<Theme>(
+      { ...defaultTheme, ...systemInfo },
+      {} as DeepPartial<Theme>
+    );
+  }, [systemInfo]);
 
   return (
     <StyledThemeProvider theme={theme}>

packages/pipeline-editor/src/ThemeProvider/utils.ts

@@ -32,7 +32,7 @@ export function deepmerge<T>(target: T, source: DeepPartial<T>) {
 
       if (sVal !== undefined) {
         if (isPlainObject(sVal) && tVal !== undefined) {
-          output[key] = deepmerge<typeof tVal>(tVal, sVal);
+          output[key] = deepmerge<typeof tVal>(tVal, sVal as any);
         } else {
           output[key] = sVal as T[keyof T];
         }

packages/pipeline-services/tsconfig.json

@@ -1,7 +1,7 @@
 {
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
-    "target": "es5",
+    "target": "es2018",
     "lib": ["esnext"],
     "module": "commonjs",
     "outDir": "dist",