From a73aa08e68b300a4e2d30b067cc4b41051d232fa Mon Sep 17 00:00:00 2001
From: Samuel Holmes <sam@edge.app>
Date: Wed, 24 Jan 2024 15:58:54 -0800
Subject: [PATCH] Move NotificationView render location to no longer avoid
 keyboard

The NotificationView should be rendered outside of the keyboard tracking
so it doesn't move when the keyboard is open.
---
 .../__snapshots__/SendScene2.ui.test.tsx.snap | 200 +++++++++---------
 src/components/common/SceneWrapper.tsx        |  54 +++--
 2 files changed, 126 insertions(+), 128 deletions(-)

diff --git a/src/__tests__/scenes/__snapshots__/SendScene2.ui.test.tsx.snap b/src/__tests__/scenes/__snapshots__/SendScene2.ui.test.tsx.snap
index cd585282378..38eb99a1fd3 100644
--- a/src/__tests__/scenes/__snapshots__/SendScene2.ui.test.tsx.snap
+++ b/src/__tests__/scenes/__snapshots__/SendScene2.ui.test.tsx.snap
@@ -1307,6 +1307,16 @@ exports[`SendScene2 1 spendTarget 1`] = `
       </View>
     </View>
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -1330,16 +1340,6 @@ exports[`SendScene2 1 spendTarget 1`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
 
@@ -2838,6 +2838,16 @@ exports[`SendScene2 1 spendTarget with info tiles 1`] = `
       </View>
     </View>
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -2861,16 +2871,6 @@ exports[`SendScene2 1 spendTarget with info tiles 1`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
 
@@ -4346,6 +4346,16 @@ exports[`SendScene2 2 spendTargets 1`] = `
       </View>
     </View>
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -4369,16 +4379,6 @@ exports[`SendScene2 2 spendTargets 1`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
 
@@ -5555,6 +5555,16 @@ exports[`SendScene2 2 spendTargets hide tiles 1`] = `
       </View>
     </View>
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -5578,16 +5588,6 @@ exports[`SendScene2 2 spendTargets hide tiles 1`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
 
@@ -6740,6 +6740,16 @@ exports[`SendScene2 2 spendTargets hide tiles 2`] = `
       </View>
     </View>
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -6763,16 +6773,6 @@ exports[`SendScene2 2 spendTargets hide tiles 2`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
 
@@ -7764,6 +7764,16 @@ exports[`SendScene2 2 spendTargets hide tiles 3`] = `
       </View>
     </View>
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -7787,16 +7797,6 @@ exports[`SendScene2 2 spendTargets hide tiles 3`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
 
@@ -9093,6 +9093,16 @@ exports[`SendScene2 2 spendTargets lock tiles 1`] = `
       </View>
     </View>
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -9116,16 +9126,6 @@ exports[`SendScene2 2 spendTargets lock tiles 1`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
 
@@ -10357,6 +10357,16 @@ exports[`SendScene2 2 spendTargets lock tiles 2`] = `
       </View>
     </View>
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -10380,16 +10390,6 @@ exports[`SendScene2 2 spendTargets lock tiles 2`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
 
@@ -11580,6 +11580,16 @@ exports[`SendScene2 2 spendTargets lock tiles 3`] = `
       </View>
     </View>
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -11603,16 +11613,6 @@ exports[`SendScene2 2 spendTargets lock tiles 3`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
 
@@ -12788,6 +12788,16 @@ exports[`SendScene2 Render SendScene 1`] = `
       }
     />
   </View>,
+  <View
+    style={
+      {
+        "bottom": 0,
+        "left": 0,
+        "position": "absolute",
+        "right": 0,
+      }
+    }
+  />,
   <View
     footerHeight={0}
     footerOpenRatio={
@@ -12811,15 +12821,5 @@ exports[`SendScene2 Render SendScene 1`] = `
       ]
     }
   />,
-  <View
-    style={
-      {
-        "bottom": 0,
-        "left": 0,
-        "position": "absolute",
-        "right": 0,
-      }
-    }
-  />,
 ]
 `;
diff --git a/src/components/common/SceneWrapper.tsx b/src/components/common/SceneWrapper.tsx
index 6f726ec3f7e..c7c0ef25f5d 100644
--- a/src/components/common/SceneWrapper.tsx
+++ b/src/components/common/SceneWrapper.tsx
@@ -192,34 +192,32 @@ export function SceneWrapper(props: SceneWrapperProps): JSX.Element {
     const info: SceneWrapperInfo = { insets, insetStyle, undoInsetStyle, hasTabs, isKeyboardOpen }
 
     return (
-      <MaybeAnimatedView when={avoidKeyboard} style={[styles.sceneContainer, layoutStyle, insetStyle, { maxHeight: keyboardAnimation, padding }]}>
-        <DotsBackground
-          accentColors={accentColors}
-          overrideDots={overrideDots}
-          backgroundGradientColors={backgroundGradientColors}
-          backgroundGradientStart={backgroundGradientStart}
-          backgroundGradientEnd={backgroundGradientEnd}
-        />
-        <MaybeAnimatedScrollView
-          when={scroll && !avoidKeyboard}
-          style={[layoutStyle, { padding }]}
-          keyboardShouldPersistTaps={keyboardShouldPersistTaps}
-          contentContainerStyle={insetStyle}
-          onScroll={hasTabs || hasHeader ? handleScroll : () => {}}
-          // Fixes middle-floating scrollbar issue
-          scrollIndicatorInsets={{ right: 1 }}
-        >
-          <MaybeView when={!scroll && !avoidKeyboard} style={[styles.sceneContainer, layoutStyle, insetStyle, { padding }]}>
-            {isFuncChildren ? children(info) : children}
-          </MaybeView>
-        </MaybeAnimatedScrollView>
-        {renderFooter != null || hasNotifications ? (
-          <>
-            {hasNotifications ? <NotificationView hasTabs={hasTabs} navigation={navigation} /> : null}
-            {renderFooter != null && !hasTabs ? <SceneFooter>{renderFooter(info)}</SceneFooter> : null}
-          </>
-        ) : null}
-      </MaybeAnimatedView>
+      <>
+        <MaybeAnimatedView when={avoidKeyboard} style={[styles.sceneContainer, layoutStyle, insetStyle, { maxHeight: keyboardAnimation, padding }]}>
+          <DotsBackground
+            accentColors={accentColors}
+            overrideDots={overrideDots}
+            backgroundGradientColors={backgroundGradientColors}
+            backgroundGradientStart={backgroundGradientStart}
+            backgroundGradientEnd={backgroundGradientEnd}
+          />
+          <MaybeAnimatedScrollView
+            when={scroll && !avoidKeyboard}
+            style={[layoutStyle, { padding }]}
+            keyboardShouldPersistTaps={keyboardShouldPersistTaps}
+            contentContainerStyle={insetStyle}
+            onScroll={hasTabs || hasHeader ? handleScroll : () => {}}
+            // Fixes middle-floating scrollbar issue
+            scrollIndicatorInsets={{ right: 1 }}
+          >
+            <MaybeView when={!scroll && !avoidKeyboard} style={[styles.sceneContainer, layoutStyle, insetStyle, { padding }]}>
+              {isFuncChildren ? children(info) : children}
+            </MaybeView>
+          </MaybeAnimatedScrollView>
+          {renderFooter != null && !hasTabs ? <SceneFooter>{renderFooter(info)}</SceneFooter> : null}
+        </MaybeAnimatedView>
+        {hasNotifications ? <NotificationView hasTabs={hasTabs} navigation={navigation} /> : null}
+      </>
     )
   }