[MOO-961] Auto update & patch known outdated dependencies (#39)

Auto migration with known outdated dependencies, including native ones

Author: jeffersonRibeiro

packages/generator-widget/CHANGELOG.md

@@ -6,7 +6,11 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
-- We've updated our templates to support the new version of Pluggable Widgets Tools containing new React and React Native versions. This is necessary due to breaking changes introduced in Studio Pro 9.24.0.
+### Changed
+
+-   We've updated our templates to support the new version of Pluggable Widgets Tools containing new React and React Native versions. This is necessary due to breaking changes introduced in Studio Pro 9.24.0.
+
+-   We've updated our templates to remove `@types/react`, `@types/react-dom` and `@types/react-native` from the generated widget's package.json since those dependencies will be part of the Pluggable Widgets Tools 9.24.
 
 ## [9.20.0] - 2022-12-12
 

packages/generator-widget/generators/app/templates/packages/package_native.json.ejs

@@ -30,9 +30,8 @@
     "@mendix/pluggable-widgets-tools": "^9.24.0"<% if (isLanguageTS) { %>,
     "@types/big.js": "^6.0.2",<% if (hasUnitTests) { %>
     "@types/enzyme": "^3.10.8",
-    "@types/jest": "^29.0.0",<% } %>
-    "@types/react": "~18.0.0",
-    "@types/react-native": "~0.70.0"<% } %>
+    "@types/jest": "^29.0.0"<% } %>
+    <% } %>
   },
   "dependencies": {
 

packages/generator-widget/generators/app/templates/packages/package_web.json.ejs

@@ -30,12 +30,9 @@
   "devDependencies": {
     "@mendix/pluggable-widgets-tools": "^9.24.0"<% if (isLanguageTS) { %>,
     "@types/big.js": "^6.0.2",<% if (hasUnitTests || hasE2eTests) { %>
-    "@types/enzyme": "^3.10.8",
-    "@types/enzyme-adapter-react-16": "^1.0.6",<% } %><% if (hasE2eTests) { %>
+    "@types/enzyme": "^3.10.8",<% } %><% if (hasE2eTests) { %>
     "@types/jasmine": "^3.6.9",<% } %><% if (hasUnitTests) { %>
-    "@types/jest": "^29.0.0",<% } %>
-    "@types/react": "~18.0.0",
-    "@types/react-dom": "~18.0.0"<% if (hasUnitTests) { %>,
+    "@types/jest": "^29.0.0"<% } %><% if (hasUnitTests) { %>,
     "@types/react-test-renderer": "~18.0.0"<% } %><% } %><% if (hasE2eTests) { %>,
     "cypress": "^10.10.0"<% } %>
   },

packages/pluggable-widgets-tools/CHANGELOG.md

@@ -5,14 +5,21 @@ All notable changes to this tool will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
+
 ### Added
 
 -   We added support to the typings generator for the data source caption (`{caption: string}`), introduced in version 9.24.0. This feature will give widget developers the ability to display the same caption for a data source, that Mendix uses in the Page Explorer, within a widget preview.
 
+-   We've added an option to automatically migrate known libraries to versions compatible with Studio Pro 9.24
+
+-   We added `@types/react`, `@types/react-dom` and `@types/react-native` as direct dependencies of the Pluggable Widgets Tools
+
 ### Changed
 
--   We've updated our library versions (React and React Native), please be aware this might break your widgets. New libraries versions: React: 18.0.2, React-Native: 0.70.7. This is necessary due to breaking changes introduced in Studio Pro 9.24.0.
--   We pinned our version of Typescript to 4.9.5
+-   We updated the Mendix package to version 9.24.2965.
+
+-   We bumped the pinned version of TypeScript to 4.9.5.
+
 -   We updated the typings generator for icon properties to support icon collections, introduced in Mendix 9.24.
 
 ### Fixed
@@ -27,6 +34,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 -   Icon properties now use `undefined` instead of `null` when no icon is selected. This change was done for compatibility with the `Icon` component in the pluggable widgets API.
 
+-   We've updated our library versions (React and React Native), please be aware this might break your widgets. New libraries versions: React: 18.0.2, React-Native: 0.70.7. This is necessary due to breaking changes introduced in Studio Pro 9.24.0.
+
 ## [9.23.2] - 2023-03-07
 
 ### Fixed

packages/pluggable-widgets-tools/bin/mx-scripts.js

@@ -2,36 +2,45 @@
 const { execSync, spawnSync } = require("child_process");
 const { existsSync } = require("fs");
 const { delimiter, dirname, join, parse } = require("path");
+const { checkMigration } = require("../utils/migration");
+const { red } = require("ansi-colors");
 
 checkNodeVersion();
+(async () => {
+    try {
+        await checkMigration();
+    } catch (e) {
+        console.log(red("An error occurred while checking migration dependencies"));
+    }
 
-const [, currentScriptPath, cmd, ...args] = process.argv;
-const toolsRoot = currentScriptPath.endsWith("pluggable-widgets-tools")
-    ? join(dirname(currentScriptPath), "../@mendix/pluggable-widgets-tools")
-    : join(dirname(currentScriptPath), "..");
+    const [, currentScriptPath, cmd, ...args] = process.argv;
+    const toolsRoot = currentScriptPath.endsWith("pluggable-widgets-tools")
+        ? join(dirname(currentScriptPath), "../@mendix/pluggable-widgets-tools")
+        : join(dirname(currentScriptPath), "..");
 
-if (args.indexOf("--subprojectPath") > -1) {
-    args.splice(args.indexOf("--subprojectPath"), 2);
-}
-const realCommand = getRealCommand(cmd, toolsRoot) + " " + args.join(" ");
-console.log(`Running MX Widgets Tools script ${cmd}...`);
+    if (args.indexOf("--subprojectPath") > -1) {
+        args.splice(args.indexOf("--subprojectPath"), 2);
+    }
+    const realCommand = getRealCommand(cmd, toolsRoot) + " " + args.join(" ");
+    console.log(`Running MX Widgets Tools script ${cmd}...`);
 
-for (const subCommand of realCommand.split(/&&/g)) {
-    const result = spawnSync(subCommand.trim(), [], {
-        cwd: process.cwd(),
-        env: {
-            ...process.env,
-            PATH: `${process.env.PATH}${delimiter}${findNodeModulesBin()}`,
-            // Hack for Windows using NTFS Filesystem, we cannot add platform specific check otherwise GitBash or other linux based terminal on windows will also fail.
-            Path: `${process.env.Path}${delimiter}${findNodeModulesBin()}`
-        },
-        shell: true,
-        stdio: "inherit"
-    });
-    if (result.status !== 0) {
-        process.exit(result.status);
+    for (const subCommand of realCommand.split(/&&/g)) {
+        const result = spawnSync(subCommand.trim(), [], {
+            cwd: process.cwd(),
+            env: {
+                ...process.env,
+                PATH: `${process.env.PATH}${delimiter}${findNodeModulesBin()}`,
+                // Hack for Windows using NTFS Filesystem, we cannot add platform specific check otherwise GitBash or other linux based terminal on windows will also fail.
+                Path: `${process.env.Path}${delimiter}${findNodeModulesBin()}`
+            },
+            shell: true,
+            stdio: "inherit"
+        });
+        if (result.status !== 0) {
+            process.exit(result.status);
+        }
     }
-}
+})();
 
 function getRealCommand(cmd, toolsRoot) {
     const eslintCommand = "eslint --config .eslintrc.js --ext .jsx,.js,.ts,.tsx src";
@@ -112,19 +121,23 @@ function checkNodeVersion() {
         const nodeVersion = extractMajorVersion(execSync("node --version").toString().trim());
         const npmVersion = extractMajorVersion(execSync("npm --version").toString().trim());
         if (nodeVersion < 16) {
-            console.error("To build this widget a minimum node version 16.0.0 is required. Please upgrade your node version!");
+            console.error(
+                "To build this widget a minimum node version 16.0.0 is required. Please upgrade your node version!"
+            );
             process.exit(1);
         }
         if (npmVersion < 8) {
-            console.error("To build this widget a minimum npm version 8.0.0 is required. Please upgrade your npm version!");
+            console.error(
+                "To build this widget a minimum npm version 8.0.0 is required. Please upgrade your npm version!"
+            );
             process.exit(1);
         }
-    } catch(e) {
-        throw new Error("Cannot find node or npm to determine the version")
+    } catch (e) {
+        throw new Error("Cannot find node or npm to determine the version");
     }
 }
 
 function extractMajorVersion(version) {
-    const majorVersion = version.replace(/^\D+/, '').split(".")[0];
+    const majorVersion = version.replace(/^\D+/, "").split(".")[0];
     return Number(majorVersion);
 }

packages/pluggable-widgets-tools/package-lock.json

@@ -16,11 +16,13 @@
   },
   "files": [
     "bin",
-    "scripts",
     "configs",
-    "test-config",
     "dist",
-    "typings"
+    "patches",
+    "scripts",
+    "test-config",
+    "typings",
+    "utils"
   ],
   "dependencies": {
     "@babel/core": "^7.12.3",
@@ -42,6 +44,9 @@
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^14.4.3",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "@types/react-native": "^0.70.0",
     "@types/testing-library__jest-dom": "^5.14.5",
     "@typescript-eslint/eslint-plugin": "^5.8.1",
     "@typescript-eslint/parser": "^5.8.1",
@@ -72,7 +77,7 @@
     "jest-jasmine2": "^29.0.3",
     "jest-junit": "^13.0.0",
     "jest-react-hooks-shallow": "^1.5.1",
-    "mendix": "^9.22.62233",
+    "mendix": "^9.24.2965",
     "metro-react-native-babel-preset": "^0.74.1",
     "node-fetch": "^2.6.1",
     "postcss": "^8.3.11",

packages/pluggable-widgets-tools/package.json

@@ -0,0 +1,20 @@
+diff --git a/node_modules/react-native-camera/src/RNCamera.js b/node_modules/react-native-camera/src/RNCamera.js
+index 0d9b516..e0eeeec 100644
+--- a/node_modules/react-native-camera/src/RNCamera.js
++++ b/node_modules/react-native-camera/src/RNCamera.js
+@@ -5,7 +5,6 @@ import {
+   findNodeHandle,
+   Platform,
+   NativeModules,
+-  ViewPropTypes,
+   requireNativeComponent,
+   View,
+   ActivityIndicator,
+@@ -13,6 +12,7 @@ import {
+   StyleSheet,
+   PermissionsAndroid,
+ } from 'react-native';
++import {ViewPropTypes} from 'deprecated-react-native-prop-types';
+ 
+ import type { FaceFeature } from './FaceDetector';
+