From 1d123db6e922cb32fea241e47badba03438812b3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hanno=20J=2E=20G=C3=B6decke?= <die.drei99@yahoo.de>
Date: Sat, 15 Oct 2022 17:20:35 +0200
Subject: [PATCH 1/2] move platform code to specific functions

---
 .../ScreenWrapper/BaseScreenWrapper.js        | 28 ++++++++++++++-----
 1 file changed, 21 insertions(+), 7 deletions(-)

diff --git a/src/components/ScreenWrapper/BaseScreenWrapper.js b/src/components/ScreenWrapper/BaseScreenWrapper.js
index a80a013a1c66..436c4d6b494a 100644
--- a/src/components/ScreenWrapper/BaseScreenWrapper.js
+++ b/src/components/ScreenWrapper/BaseScreenWrapper.js
@@ -2,7 +2,7 @@ import {KeyboardAvoidingView, View} from 'react-native';
 import React from 'react';
 import {SafeAreaInsetsContext} from 'react-native-safe-area-context';
 import _ from 'underscore';
-import {withOnyx} from 'react-native-onyx';
+import Onyx from 'react-native-onyx';
 import CONST from '../../CONST';
 import KeyboardShortcut from '../../libs/KeyboardShortcut';
 import Navigation from '../../libs/Navigation/Navigation';
@@ -29,9 +29,19 @@ class BaseScreenWrapper extends React.Component {
     }
 
     componentDidMount() {
+        let willAlertModalBecomeVisible = false;
+
+        // TODO: move to lib, note: i think this whole thing with the keyboard could be moved to another place?
+        this.onyxConnectionId = Onyx.connect({
+            key: ONYXKEYS.MODAL,
+            callback: (object) => {
+                willAlertModalBecomeVisible = object.willAlertModalBecomeVisible;
+            },
+        });
+
         const shortcutConfig = CONST.KEYBOARD_SHORTCUTS.ESCAPE;
         this.unsubscribeEscapeKey = KeyboardShortcut.subscribe(shortcutConfig.shortcutKey, () => {
-            if (this.props.modal.willAlertModalBecomeVisible) {
+            if (willAlertModalBecomeVisible) {
                 return;
             }
 
@@ -51,6 +61,9 @@ class BaseScreenWrapper extends React.Component {
         if (this.unsubscribeTransitionEnd) {
             this.unsubscribeTransitionEnd();
         }
+        if (this.onyxConnectionId) {
+            Onyx.disconnect(this.onyxConnectionId);
+        }
     }
 
     render() {
@@ -106,10 +119,11 @@ BaseScreenWrapper.defaultProps = defaultProps;
 export default compose(
     withNavigation,
     withWindowDimensions,
-    withOnyx({
-        modal: {
-            key: ONYXKEYS.MODAL,
-        },
-    }),
+
+    // withOnyx({
+    //     modal: {
+    //         key: ONYXKEYS.MODAL,
+    //     },
+    // }),
     withNetwork(),
 )(BaseScreenWrapper);

From 6816236de3c47e46f0c3afd8cc693a1823978387 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hanno=20J=2E=20G=C3=B6decke?= <die.drei99@yahoo.de>
Date: Sat, 15 Oct 2022 17:51:09 +0200
Subject: [PATCH 2/2] clean code

---
 src/components/ScreenWrapper/BaseScreenWrapper.js | 15 ++++-----------
 src/libs/onyxSubscribe.js                         | 12 ++++++++++++
 2 files changed, 16 insertions(+), 11 deletions(-)
 create mode 100644 src/libs/onyxSubscribe.js

diff --git a/src/components/ScreenWrapper/BaseScreenWrapper.js b/src/components/ScreenWrapper/BaseScreenWrapper.js
index 436c4d6b494a..732c98418457 100644
--- a/src/components/ScreenWrapper/BaseScreenWrapper.js
+++ b/src/components/ScreenWrapper/BaseScreenWrapper.js
@@ -2,7 +2,6 @@ import {KeyboardAvoidingView, View} from 'react-native';
 import React from 'react';
 import {SafeAreaInsetsContext} from 'react-native-safe-area-context';
 import _ from 'underscore';
-import Onyx from 'react-native-onyx';
 import CONST from '../../CONST';
 import KeyboardShortcut from '../../libs/KeyboardShortcut';
 import Navigation from '../../libs/Navigation/Navigation';
@@ -18,6 +17,7 @@ import withWindowDimensions from '../withWindowDimensions';
 import ONYXKEYS from '../../ONYXKEYS';
 import {withNetwork} from '../OnyxProvider';
 import {propTypes, defaultProps} from './propTypes';
+import onyxSubscribe from '../../libs/onyxSubscribe';
 
 class BaseScreenWrapper extends React.Component {
     constructor(props) {
@@ -31,8 +31,7 @@ class BaseScreenWrapper extends React.Component {
     componentDidMount() {
         let willAlertModalBecomeVisible = false;
 
-        // TODO: move to lib, note: i think this whole thing with the keyboard could be moved to another place?
-        this.onyxConnectionId = Onyx.connect({
+        this.unsubscribeOnyx = onyxSubscribe({
             key: ONYXKEYS.MODAL,
             callback: (object) => {
                 willAlertModalBecomeVisible = object.willAlertModalBecomeVisible;
@@ -61,8 +60,8 @@ class BaseScreenWrapper extends React.Component {
         if (this.unsubscribeTransitionEnd) {
             this.unsubscribeTransitionEnd();
         }
-        if (this.onyxConnectionId) {
-            Onyx.disconnect(this.onyxConnectionId);
+        if (this.unsubscribeOnyx) {
+            this.unsubscribeOnyx();
         }
     }
 
@@ -119,11 +118,5 @@ BaseScreenWrapper.defaultProps = defaultProps;
 export default compose(
     withNavigation,
     withWindowDimensions,
-
-    // withOnyx({
-    //     modal: {
-    //         key: ONYXKEYS.MODAL,
-    //     },
-    // }),
     withNetwork(),
 )(BaseScreenWrapper);
diff --git a/src/libs/onyxSubscribe.js b/src/libs/onyxSubscribe.js
new file mode 100644
index 000000000000..600d010ed27f
--- /dev/null
+++ b/src/libs/onyxSubscribe.js
@@ -0,0 +1,12 @@
+import Onyx from 'react-native-onyx';
+
+/**
+ * Connect to onyx data. Same params as Onyx.connect(), but returns a function to unsubscribe.
+ *
+ * @param {Object} mapping Same as for Onyx.connect()
+ * @return {function(): void} Unsubscribe callback
+ */
+export default (mapping) => {
+    const connectionId = Onyx.connect(mapping);
+    return () => Onyx.disconnect(connectionId);
+};