fix: eliminate regressions caused by using React@18 (#4749)

Refs #4748

package.json

@@ -16,6 +16,7 @@
     "Sahar Jafari <[email protected]>"
   ],
   "scripts": {
+    "postinstall": "patch-package",
     "automated-release": "release-it -VV --config ./release/.release-it.json",
     "analyze": "source-map-explorer 'dist/swagger-editor-bundle.js'",
     "build": "npm run build:stylesheets && rimraf ./dist/swagger-editor.js ./dist/swagger-editor.js.map && npm run build-all-bundles",
@@ -72,6 +73,7 @@
     "json-beautify": "^1.0.1",
     "json-refs": "^3.0.4",
     "lodash": "^4.17.21",
+    "patch-package": "=8.0.0",
     "promise-worker": "^2.0.1",
     "prop-types": "15.8.1",
     "querystring-browser": "^1.0.4",
@@ -103,12 +105,12 @@
     "@babel/preset-react": "^7.13.13",
     "@babel/register": "^7.13.16",
     "@babel/runtime-corejs3": "^7.11.2",
+    "@cfaester/enzyme-adapter-react-18": "^0.7.1",
     "@commitlint/cli": "^18.0.0",
     "@commitlint/config-conventional": "=18.4.4",
     "@jest/globals": "^29.0.1",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.4",
     "@release-it/conventional-changelog": "^8.0.1",
-    "@cfaester/enzyme-adapter-react-18": "^0.7.1",
     "autoprefixer": "^10.2.6",
     "babel-loader": "^9.1.0",
     "babel-plugin-module-resolver": "^5.0.0",

patches/react-ace+4.4.0.patch

@@ -0,0 +1,15 @@
+diff --git a/node_modules/react-ace/lib/ace.js b/node_modules/react-ace/lib/ace.js
+index 031682a..5c51258 100644
+--- a/node_modules/react-ace/lib/ace.js
++++ b/node_modules/react-ace/lib/ace.js
+@@ -142,8 +142,8 @@ var ReactAce = function (_Component) {
+       }
+     }
+   }, {
+-    key: 'componentWillReceiveProps',
+-    value: function componentWillReceiveProps(nextProps) {
++    key: 'UNSAFE_componentWillReceiveProps',
++    value: function UNSAFE_componentWillReceiveProps(nextProps) {
+       var oldProps = this.props;
+
+       for (var i = 0; i < editorOptions.length; i++) {

patches/react-transition-group+1.2.1.patch

@@ -0,0 +1,35 @@
+diff --git a/node_modules/react-transition-group/CSSTransitionGroupChild.js b/node_modules/react-transition-group/CSSTransitionGroupChild.js
+index bb1742b..ef14d74 100644
+--- a/node_modules/react-transition-group/CSSTransitionGroupChild.js
++++ b/node_modules/react-transition-group/CSSTransitionGroupChild.js
+@@ -107,7 +107,7 @@ var CSSTransitionGroupChild = function (_React$Component) {
+     }, _temp), _possibleConstructorReturn(_this, _ret);
+   }
+
+-  CSSTransitionGroupChild.prototype.componentWillMount = function componentWillMount() {
++  CSSTransitionGroupChild.prototype.UNSAFE_componentWillMount = function UNSAFE_componentWillMount() {
+     this.classNameAndNodeQueue = [];
+     this.transitionTimeouts = [];
+   };
+diff --git a/node_modules/react-transition-group/TransitionGroup.js b/node_modules/react-transition-group/TransitionGroup.js
+index 1950176..1160ebd 100644
+--- a/node_modules/react-transition-group/TransitionGroup.js
++++ b/node_modules/react-transition-group/TransitionGroup.js
+@@ -143,7 +143,7 @@ var TransitionGroup = function (_React$Component) {
+     return _this;
+   }
+
+-  TransitionGroup.prototype.componentWillMount = function componentWillMount() {
++  TransitionGroup.prototype.UNSAFE_componentWillMount = function UNSAFE_componentWillMount() {
+     this.currentlyTransitioningKeys = {};
+     this.keysToEnter = [];
+     this.keysToLeave = [];
+@@ -158,7 +158,7 @@ var TransitionGroup = function (_React$Component) {
+     }
+   };
+
+-  TransitionGroup.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
++  TransitionGroup.prototype.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) {
+     var nextChildMapping = (0, _ChildMapping.getChildMapping)(nextProps.children);
+     var prevChildMapping = this.state.children;
+

src/plugins/editor/components/editor.jsx

@@ -66,10 +66,9 @@ export default function makeEditor({ editorPluginsToRun }) {
       markers: {},
       goToLine: {},
       errors: fromJS([]),
-      editorActions: {onLoad(){}},
+      editorActions: { onLoad() {} },
       editorOptions: {},
       debounce: 800 // 0.5 imperial seconds™
-
     }
 
     checkForSilentOnChange = (value) => {
@@ -79,7 +78,6 @@ export default function makeEditor({ editorPluginsToRun }) {
     }
 
     onLoad = (editor) => {
-
       const { props } = this
       const { AST, specObject } = props
 
@@ -88,12 +86,12 @@ export default function makeEditor({ editorPluginsToRun }) {
 
       this.editor = editor
 
-      // fixes a warning, see https://github.com/ajaxorg/ace/issues/2499
+      // https://github.com/angular-ui/ui-ace/issues/104
       editor.$blockScrolling = Infinity
 
-
       session.setUseWrapMode(true)
-      session.on("changeScrollLeft", xPos => { // eslint-disable-line no-unused-vars
+      session.setScrollTop(0)
+      session.on("changeScrollLeft", () => {
         session.setScrollLeft(0)
       })
 

test/mocha/mocks/ace.js

@@ -42,6 +42,8 @@ export class Session extends EventEmitter {
     this.selection.fromJSON = sinon.stub().returns({ fake: true })
   }
 
+  setScrollTop = sinon.stub()
+
   addMarker = sinon.stub().callsFake((marker) => {
     this._markers.push({ ...marker, id: this.$markerId++ })
   })