[MOO-1553]: Fix failing pipelines in native widgets repository (#162)

.github/actions/create-native-bundle/action.yml

@@ -33,7 +33,7 @@ runs:
         /tmp/mxbuild/modeler/tools/node/linux-x64/node \
         /tmp/mxbuild/modeler/tools/node/node_modules/react-native/local-cli/cli.js \
         bundle --verbose --platform ${{ inputs.platform }} --dev false \
-        --config "$PWD/metro.config.json" \
+        --config "$PWD/metro.config.js" \
         --bundle-output $GITHUB_WORKSPACE/${{ inputs.platform }}/index.${{ inputs.platform }}.bundle \
         --assets-dest $GITHUB_WORKSPACE/${{ inputs.platform }}/assets/ \
         --entry-file ./index.js

.github/pull_request_template.md

@@ -2,7 +2,7 @@
 
 -   Contains unit tests ✅ ❌
 -   Contains breaking changes ✅ ❌
--   Compatible with: MX 7️⃣, 8️⃣, 9️⃣
+-   Compatible with: MX 8, 9, 10
 -   Did you update version and changelog? ✅ ❌
 -   PR title properly formatted (`[XX-000]: description`)? ✅ ❌
 -   Works in Android ✅ ❌

.github/scripts/mxbuild.Dockerfile

@@ -1,4 +1,4 @@
-FROM mcr.microsoft.com/dotnet/runtime:6.0
+FROM mcr.microsoft.com/dotnet/runtime:8.0
 ARG MENDIX_VERSION
 
 RUN \

.github/workflows/Build.yml

@@ -51,6 +51,6 @@ jobs:
       - name: "Installing dependencies"
         run: yarn install
       - name: "Running build for development"
-        run: yarn workspaces foreach ${{ steps.variablesLinux.outputs.arg }} ${{ steps.variablesWindows.outputs.arg }} --parallel run build
+        run: yarn workspaces foreach ${{ steps.variablesLinux.outputs.arg }} ${{ steps.variablesWindows.outputs.arg }} --all --parallel run build
         env:
           NODE_OPTIONS: --max_old_space_size=8192

.github/workflows/Release.yml

@@ -48,6 +48,6 @@ jobs:
       - name: "Installing dependencies"
         run: yarn install
       - name: "Running release for production"
-        run: yarn workspaces foreach ${{ steps.variablesLinux.outputs.arg }} ${{ steps.variablesWindows.outputs.arg }} --parallel run release
+        run: yarn workspaces foreach ${{ steps.variablesLinux.outputs.arg }} ${{ steps.variablesWindows.outputs.arg }} --all --parallel run release
         env:
           NODE_OPTIONS: --max_old_space_size=8192

.github/workflows/UnitTests.yml

@@ -50,6 +50,6 @@ jobs:
       - name: "Installing dependencies"
         run: yarn install
       - name: "Linting code"
-        run: yarn workspaces foreach ${{ steps.variables.outputs.arg }} --parallel run lint
+        run: yarn workspaces foreach ${{ steps.variables.outputs.arg }} --all --parallel run lint
       - name: "Running unit tests"
-        run: yarn workspaces foreach ${{ steps.variables.outputs.arg }} --parallel run test
+        run: yarn workspaces foreach ${{ steps.variables.outputs.arg }} --all --parallel run test

.husky/pre-commit

@@ -1,4 +1,4 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
 
 yarn format && yarn validate-staged-widget-versions

.nvmrc

@@ -1 +1 @@
-18.15.0
+20.16.0

.yarnrc.yml

@@ -5,10 +5,10 @@ changesetBaseRefs:
   - refs/remotes/origin/main
   - +refs/heads/main
 
-nodeLinker: node-modules
+compressionLevel: mixed
+
+enableGlobalCache: false
 
-plugins:
-  - path: .yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs
-    spec: "@yarnpkg/plugin-workspace-tools"
+nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-3.4.1.cjs
+yarnPath: .yarn/releases/yarn-4.4.0.cjs

configs/e2e/mendix-versions.json

@@ -1,4 +1,4 @@
 {
-    "latest": "10.7.0.26214",
+    "latest": "10.13.0.41393",
     "8": "8.18.23.62193"
 }

package.json

@@ -8,23 +8,23 @@
   },
   "license": "Apache-2.0",
   "scripts": {
-    "prepare": "npx husky install && yarn workspaces foreach run prepare",
-    "postinstall": "patch-package --use-yarn && yarn workspaces foreach run postinstall",
+    "prepare": "npx husky install && yarn workspaces foreach --all run prepare",
+    "postinstall": "patch-package --use-yarn && yarn workspaces foreach --all run postinstall",
     "reinstall": "yarn cache clean && git clean -dfx && find . -type dir -name node_modules | xargs rm -rf && yarn && yarn run postinstall",
     "prettier": "prettier --config \"./prettier.config.js\" --write \"**/*.{js,jsx,ts,tsx,scss,html,xml,yml,yaml}\"",
     "format": "pretty-quick --staged --config \"./prettier.config.js\" --pattern \"**/{src,script,typings,test,**}/**/*.{js,jsx,ts,tsx,scss,html,xml,md,json}\"",
     "clean-all-screenshots-mac": "find . -name 'screenshot-baseline' -type d -prune -exec rm -rf '{}' +",
     "information:githubrelease": "yarn workspaces foreach run information:githubrelease",
-    "lint": "yarn lint:src && yarn workspaces foreach --parallel run lint",
+    "lint": "yarn lint:src && yarn workspaces foreach --all --parallel run lint",
     "lint:src": "eslint --config .eslintrc.js --ext .jsx,.js,.ts,.tsx packages/*/*/src --no-error-on-unmatched-pattern",
     "lint:scripts": "eslint --fix --config .eslintrc.js --ext .jsx,.js,.ts,.tsx scripts",
     "lint:detox": "eslint --fix --config .eslintrc.js --ext .jsx,.js,.ts,.tsx detox",
     "lint:configs": "eslint --fix --config .eslintrc.js --ext .jsx,.js,.ts,.tsx configs",
-    "test": "yarn workspaces foreach --parallel run test",
+    "test": "yarn workspaces foreach --all --parallel run test",
     "test:e2e:android": "yarn workspaces foreach run test:e2e:android",
     "test:e2e:ios": "yarn workspaces foreach run test:e2e:ios",
-    "build": "yarn workspaces foreach --parallel run build",
-    "release": "yarn workspaces foreach --parallel run release",
+    "build": "yarn workspaces foreach --all --parallel run build",
+    "release": "yarn workspaces foreach --all --parallel run release",
     "release:marketplace": "yarn workspaces foreach run release:marketplace",
     "release-github:widget": "node ./scripts/release/createWidgetRelease.js",
     "create-modules": "node ./scripts/release/createNativeModules.js",
@@ -33,7 +33,7 @@
     "setup-mobile": "yarn setup-android && yarn setup-ios",
     "setup-android": "node ./detox/scripts/setup-android.js",
     "setup-ios": "node ./detox/scripts/setup-ios.js",
-    "patch-package": "./scripts/patch/patch-package.sh",
+    "patch-package": "sh ./scripts/patch/patch-package.sh",
     "build:widgets": "node ./scripts/widget/buildWidgets.js"
   },
   "workspaces": {
@@ -44,6 +44,7 @@
   "devDependencies": {
     "@commitlint/cli": "^15.0.0",
     "@commitlint/config-conventional": "^15.0.0",
+    "@rollup/plugin-node-resolve": "^13.0.6",
     "@testing-library/jest-native": "^5.4.1",
     "@testing-library/react-native": "^11.5.1",
     "@types/big.js": "^6.0.2",
@@ -65,18 +66,19 @@
     "deepmerge": "^4.2.2",
     "detox": "^19.13.0",
     "eslint": "^7.20.0",
-    "husky": "^7.0.0",
+    "husky": "^8.0.0",
     "identity-obj-proxy": "^3.0.0",
     "image-js": "^0.33.0",
     "jest-canvas-mock": "^2.3.0",
     "jest-environment-jsdom": "^29.4.1",
     "jest-image-snapshot": "^6.1.0",
     "lint-staged": "^10.5.0",
     "mendix-client": "^7.15.8",
-    "patch-package": "^6.4.7",
+    "patch-package": "^8.0.0",
     "prettier": "^2.5.1",
     "pretty-quick": "^3.1.0",
     "recursive-copy": "^2.0.11",
+    "rollup": "^2.68.0",
     "ts-node": "^10.9.1"
   },
   "commitlint": {
@@ -85,7 +87,7 @@
     ]
   },
   "engines": {
-    "node": ">=16"
+    "node": ">=20"
   },
   "resolutions": {
     "@mendix/pluggable-widgets-tools": "9.24.0",
@@ -97,5 +99,5 @@
     "typescript": "^4.9.5",
     "ts-node": "^10.9.1"
   },
-  "packageManager": "yarn@3.4.1"
+  "packageManager": "yarn@4.4.0"
 }

packages/jsActions/mobile-resources-native/package.json

@@ -9,7 +9,7 @@
     "url": "https://github.com/mendix/native-widgets.git"
   },
   "marketplace": {
-    "minimumMXVersion": "10.12.0.38909",
+    "minimumMXVersion": "10.13.0.41393",
     "marketplaceId": 109513
   },
   "testProject": {

packages/jsActions/nanoflow-actions-native/package.json

@@ -9,7 +9,7 @@
     "url": "https://github.com/mendix/native-widgets.git"
   },
   "marketplace": {
-    "minimumMXVersion": "10.6.0.23934",
+    "minimumMXVersion": "10.13.0.41393",
     "marketplaceId": 109515
   },
   "testProject": {

packages/pluggableWidgets/animation-native/tsconfig.json

@@ -1,5 +1,8 @@
 {
-    "extends": "@mendix/pluggable-widgets-tools/configs/tsconfig.base.json",
+    "extends": "@mendix/pluggable-widgets-tools/configs/tsconfig.base",
     "baseUrl": "./",
-    "include": ["./src"]
+    "include": ["./src", "./typings"],
+    "compilerOptions": {
+        "typeRoots": ["node_modules/@types", "../../../node_modules/@types"]
+    }
 }

packages/pluggableWidgets/app-events-native/src/__tests__/AppEvents.spec.tsx

@@ -1,7 +1,8 @@
 import { actionValue } from "@mendix/piw-utils-internal";
 import { createElement } from "react";
 import { AppStateStatus } from "react-native";
-import { render } from "@testing-library/react-native";
+
+import { mount } from "enzyme";
 
 import { AppEvents, Props } from "../AppEvents";
 
@@ -32,51 +33,53 @@ jest.mock("@react-native-community/netinfo", () => ({
     })
 }));
 
-const defaultProps: Props = {
-    name: "app-events-test",
-    onResumeTimeout: 0,
-    onOnlineTimeout: 0,
-    onOfflineTimeout: 0,
-    delayTime: 30,
-    timerType: "once",
-    style: []
-};
-
 describe("AppEvents", () => {
+    let defaultProps: Props;
+
+    beforeEach(() => {
+        defaultProps = {
+            name: "app-events-test",
+            onResumeTimeout: 0,
+            onOnlineTimeout: 0,
+            onOfflineTimeout: 0,
+            delayTime: 30,
+            timerType: "once",
+            style: []
+        };
+    });
+
     afterEach(() => {
         appStateChangeHandler = undefined;
         connectionChangeHandler = undefined;
         // setTimeout(); NodeJS.Timeout;
     });
 
     it("does not render anything", () => {
-        const component = render(<AppEvents {...defaultProps} />);
-
-        expect(component.toJSON()).toBeNull();
+        const wrapper = mount(<AppEvents {...defaultProps} />);
+        expect(wrapper).toMatchObject({});
     });
 
     describe("with on load action", () => {
         it("executes the on load action", () => {
             const onLoadAction = actionValue();
-            const { update } = render(<AppEvents {...defaultProps} onLoadAction={onLoadAction} />);
-            update(<AppEvents {...defaultProps} onLoadAction={onLoadAction} />);
+            mount(<AppEvents {...defaultProps} onLoadAction={onLoadAction} />);
             expect(onLoadAction.execute).toHaveBeenCalledTimes(1);
         });
     });
 
     describe("with on resume action", () => {
         it("registers and unregisters an event listener", () => {
             const onResumeAction = actionValue();
-            const component = render(<AppEvents {...defaultProps} onResumeAction={onResumeAction} />);
+            const wrapper = mount(<AppEvents {...defaultProps} onResumeAction={onResumeAction} />);
 
             expect(appStateChangeHandler).toBeDefined();
-            component.unmount();
+            wrapper.unmount();
             expect(appStateChangeHandler).toBeUndefined();
         });
 
         it("executes the on resume action", () => {
             const onResumeAction = actionValue();
-            render(<AppEvents {...defaultProps} onResumeAction={onResumeAction} />);
+            mount(<AppEvents {...defaultProps} onResumeAction={onResumeAction} />);
 
             appStateChangeHandler!("background");
             appStateChangeHandler!("active");
@@ -85,7 +88,7 @@ describe("AppEvents", () => {
 
         it("does not execute the on resume action when the app state hasn't changed", () => {
             const onResumeAction = actionValue();
-            render(<AppEvents {...defaultProps} onResumeAction={onResumeAction} />);
+            mount(<AppEvents {...defaultProps} onResumeAction={onResumeAction} />);
 
             appStateChangeHandler!("active");
             appStateChangeHandler!("active");
@@ -96,7 +99,7 @@ describe("AppEvents", () => {
             const dateNowSpy = jest.spyOn(Date, "now").mockReturnValue(0);
 
             const onResumeAction = actionValue();
-            render(<AppEvents {...defaultProps} onResumeAction={onResumeAction} onResumeTimeout={5} />);
+            mount(<AppEvents {...defaultProps} onResumeAction={onResumeAction} onResumeTimeout={5} />);
 
             dateNowSpy.mockReturnValue(4000);
             appStateChangeHandler!("background");
@@ -115,17 +118,17 @@ describe("AppEvents", () => {
     describe("with on online action", () => {
         it("registers and unregisters an event listener", async () => {
             const onOnlineAction = actionValue();
-            const component = render(<AppEvents {...defaultProps} onOnlineAction={onOnlineAction} />);
+            const wrapper = mount(<AppEvents {...defaultProps} onOnlineAction={onOnlineAction} />);
             await flushMicrotasksQueue();
 
             expect(connectionChangeHandler).toBeDefined();
-            component.unmount();
+            wrapper.unmount();
             expect(connectionChangeHandler).toBeUndefined();
         });
 
         it("executes the on online action", async () => {
             const onOnlineAction = actionValue();
-            render(<AppEvents {...defaultProps} onOnlineAction={onOnlineAction} />);
+            mount(<AppEvents {...defaultProps} onOnlineAction={onOnlineAction} />);
             await flushMicrotasksQueue();
 
             connectionChangeHandler!({ isConnected: false });
@@ -137,7 +140,7 @@ describe("AppEvents", () => {
             const dateNowSpy = jest.spyOn(Date, "now").mockReturnValue(0);
 
             const onOnlineAction = actionValue();
-            render(<AppEvents {...defaultProps} onOnlineAction={onOnlineAction} onOnlineTimeout={5} />);
+            mount(<AppEvents {...defaultProps} onOnlineAction={onOnlineAction} onOnlineTimeout={5} />);
             await flushMicrotasksQueue();
 
             dateNowSpy.mockReturnValue(4000);
@@ -155,7 +158,7 @@ describe("AppEvents", () => {
 
         it("does not execute the on online action if the connection state didn't change", async () => {
             const onOnlineAction = actionValue();
-            render(<AppEvents {...defaultProps} onOnlineAction={onOnlineAction} />);
+            mount(<AppEvents {...defaultProps} onOnlineAction={onOnlineAction} />);
             await flushMicrotasksQueue();
 
             connectionChangeHandler!({ isConnected: true });
@@ -176,7 +179,7 @@ describe("AppEvents", () => {
 
         it("executes the on timeout action once after the timeout has passed", () => {
             const onTimeoutAction = actionValue();
-            render(<AppEvents {...defaultProps} onTimeoutAction={onTimeoutAction} />);
+            mount(<AppEvents {...defaultProps} onTimeoutAction={onTimeoutAction} />);
 
             expect(onTimeoutAction.execute).toHaveBeenCalledTimes(0);
             jest.advanceTimersByTime(30000);
@@ -187,16 +190,16 @@ describe("AppEvents", () => {
 
         it("does not execute the on timeout action after the component has been unmounted", () => {
             const onTimeoutAction = actionValue();
-            const component = render(<AppEvents {...defaultProps} onTimeoutAction={onTimeoutAction} />);
+            const wrapper = mount(<AppEvents {...defaultProps} onTimeoutAction={onTimeoutAction} />);
             jest.advanceTimersByTime(15000);
-            component.unmount();
+            wrapper.unmount();
             jest.advanceTimersByTime(15000);
             expect(onTimeoutAction.execute).toHaveBeenCalledTimes(0);
         });
 
         it("executes the interval on timeout action after every interval", () => {
             const onTimeoutAction = actionValue();
-            render(<AppEvents {...defaultProps} onTimeoutAction={onTimeoutAction} timerType={"interval"} />);
+            mount(<AppEvents {...defaultProps} onTimeoutAction={onTimeoutAction} timerType={"interval"} />);
 
             expect(onTimeoutAction.execute).toHaveBeenCalledTimes(0);
             jest.advanceTimersByTime(30000);
@@ -207,20 +210,20 @@ describe("AppEvents", () => {
 
         it("does not execute the interval on timeout action after the component has been unmounted", () => {
             const onTimeoutAction = actionValue();
-            const component = render(
+            const wrapper = mount(
                 <AppEvents {...defaultProps} onTimeoutAction={onTimeoutAction} timerType={"interval"} />
             );
 
             jest.advanceTimersByTime(30000);
             expect(onTimeoutAction.execute).toHaveBeenCalledTimes(1);
-            component.unmount();
+            wrapper.unmount();
             jest.advanceTimersByTime(30000);
             expect(onTimeoutAction.execute).toHaveBeenCalledTimes(1);
         });
 
         it("does not execute the interval on timeout action when it is already executing", () => {
             const onTimeoutAction = actionValue(true, true);
-            render(<AppEvents {...defaultProps} onTimeoutAction={onTimeoutAction} timerType={"interval"} />);
+            mount(<AppEvents {...defaultProps} onTimeoutAction={onTimeoutAction} timerType={"interval"} />);
 
             jest.advanceTimersByTime(30000);
             expect(onTimeoutAction.execute).not.toHaveBeenCalled();

packages/tools/piw-utils-internal/package.json

@@ -23,6 +23,7 @@
   },
   "devDependencies": {
     "@mendix/pluggable-widgets-tools": "^9.0.0",
+    "@testing-library/react": "^16.0.0",
     "eslint": "^7.20.0",
     "rimraf": "^2.7.1",
     "typescript": "4.5.4"