From 7faed795300224da418e7f668c5336899feb1b64 Mon Sep 17 00:00:00 2001
From: Matiss Janis Aboltins <matiss@mja.lv>
Date: Sun, 5 Mar 2023 13:46:13 +0000
Subject: [PATCH] :arrow_up:  upgrade react-modal to v3.16.1 and remove the
 patch (#718)

---
 packages/desktop-client/package.json          |  1 -
 .../src/components/accounts/Filters.js        | 26 +++----------------
 packages/loot-design/package.json             |  2 +-
 patches/react-modal+3.4.4.patch               | 13 ----------
 yarn.lock                                     | 19 +++++++-------
 5 files changed, 13 insertions(+), 48 deletions(-)
 delete mode 100644 patches/react-modal+3.4.4.patch

diff --git a/packages/desktop-client/package.json b/packages/desktop-client/package.json
index e3fe343c4d..2f2180cf6b 100644
--- a/packages/desktop-client/package.json
+++ b/packages/desktop-client/package.json
@@ -34,7 +34,6 @@
     "react-app-rewired": "^2.2.1",
     "react-dnd": "^10.0.2",
     "react-dom": "16.13.1",
-    "react-modal": "3.4.4",
     "react-redux": "7.2.1",
     "react-router": "5.2.0",
     "react-router-dom": "5.2.0",
diff --git a/packages/desktop-client/src/components/accounts/Filters.js b/packages/desktop-client/src/components/accounts/Filters.js
index f0bf658591..5a75914e2a 100644
--- a/packages/desktop-client/src/components/accounts/Filters.js
+++ b/packages/desktop-client/src/components/accounts/Filters.js
@@ -1,12 +1,12 @@
 import React, { useState, useRef, useEffect, useReducer } from 'react';
 import { useSelector } from 'react-redux';
 
+import { FocusScope } from '@react-aria/focus';
 import {
   parse as parseDate,
   format as formatDate,
   isValid as isDateValid,
 } from 'date-fns';
-import scopeTab from 'react-modal/lib/helpers/scopeTab';
 
 import { send } from 'loot-core/src/platform/client/fetch';
 import { getMonthYearFormat } from 'loot-core/src/shared/months';
@@ -89,26 +89,6 @@ function subfieldToOptions(field, subfield) {
   }
 }
 
-function ScopeTab({ children }) {
-  let contentRef = useRef();
-
-  function onKeyDown(e) {
-    if (e.keyCode === 9) {
-      scopeTab(contentRef.current, e);
-    }
-  }
-
-  useEffect(() => {
-    contentRef.current.focus();
-  }, []);
-
-  return (
-    <div ref={contentRef} tabIndex={-1} onKeyDown={onKeyDown}>
-      {children}
-    </div>
-  );
-}
-
 function OpButton({ op, selected, style, onClick }) {
   return (
     <Button
@@ -186,7 +166,7 @@ function ConfigureField({
       width={300}
       onClose={() => dispatch({ type: 'close' })}
     >
-      <ScopeTab>
+      <FocusScope contain>
         <View style={{ marginBottom: 10 }}>
           {field === 'amount' || field === 'date' ? (
             <CustomSelect
@@ -289,7 +269,7 @@ function ConfigureField({
             </Button>
           </View>
         </form>
-      </ScopeTab>
+      </FocusScope>
     </Tooltip>
   );
 }
diff --git a/packages/loot-design/package.json b/packages/loot-design/package.json
index 96c966b178..cce3166295 100644
--- a/packages/loot-design/package.json
+++ b/packages/loot-design/package.json
@@ -32,7 +32,7 @@
     "pikaday": "1.8.0",
     "react-dnd": "^10.0.2",
     "react-merge-refs": "^1.1.0",
-    "react-modal": "3.4.4",
+    "react-modal": "3.16.1",
     "react-spring": "^8.0.27",
     "react-virtualized-auto-sizer": "^1.0.2"
   },
diff --git a/patches/react-modal+3.4.4.patch b/patches/react-modal+3.4.4.patch
deleted file mode 100644
index 7a2e29fcec..0000000000
--- a/patches/react-modal+3.4.4.patch
+++ /dev/null
@@ -1,13 +0,0 @@
-diff --git a/node_modules/react-modal/lib/components/ModalPortal.js b/node_modules/react-modal/lib/components/ModalPortal.js
-index 1dcab7d..0fa19dc 100644
---- a/node_modules/react-modal/lib/components/ModalPortal.js
-+++ b/node_modules/react-modal/lib/components/ModalPortal.js
-@@ -286,7 +286,7 @@ var ModalPortal = function (_Component) {
-   }, {
-     key: "componentWillUnmount",
-     value: function componentWillUnmount() {
--      this.afterClose();
-+      setTimeout(() => { this.afterClose() }, 0)
-       clearTimeout(this.closeTimer);
-     }
-   }, {
diff --git a/yarn.lock b/yarn.lock
index aad5be80e5..048b5bc10d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -80,7 +80,6 @@ __metadata:
     react-app-rewired: ^2.2.1
     react-dnd: ^10.0.2
     react-dom: 16.13.1
-    react-modal: 3.4.4
     react-redux: 7.2.1
     react-router: 5.2.0
     react-router-dom: 5.2.0
@@ -13829,7 +13828,7 @@ __metadata:
     react-dnd-html5-backend: ^10.0.2
     react-dom: 16.13.1
     react-merge-refs: ^1.1.0
-    react-modal: 3.4.4
+    react-modal: 3.16.1
     react-spring: ^8.0.27
     react-virtualized-auto-sizer: ^1.0.2
     wobble: ^1.5.0
@@ -17339,18 +17338,18 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-modal@npm:3.4.4":
-  version: 3.4.4
-  resolution: "react-modal@npm:3.4.4"
+"react-modal@npm:3.16.1":
+  version: 3.16.1
+  resolution: "react-modal@npm:3.16.1"
   dependencies:
     exenv: ^1.2.0
-    prop-types: ^15.5.10
+    prop-types: ^15.7.2
     react-lifecycles-compat: ^3.0.0
-    warning: ^3.0.0
+    warning: ^4.0.3
   peerDependencies:
-    react: ^0.14.0 || ^15.0.0 || ^16
-    react-dom: ^0.14.0 || ^15.0.0 || ^16
-  checksum: d01d83e7081fcfaea9556bf0aaa460c4ae2f7c371df2ce4e7bac7d4eac884970d57ec89d27c04b4adeb56488801558e0784925c996488747a592ce700f059be9
+    react: ^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18
+    react-dom: ^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18
+  checksum: 978936e9320fad839c039b9ee4de55d40888156cb40e093615d6fbc2ff07139d5db06f14782cb7767f780bd5fb57956778669426c535ebc0068a7a03882c7e75
   languageName: node
   linkType: hard