From 90ad1cb12f4adee982a3a4016e463b3a8bcbc0ad Mon Sep 17 00:00:00 2001
From: bl00dymarie <ml.kochsiek@mailbox.org>
Date: Thu, 15 Feb 2024 17:38:08 +0100
Subject: [PATCH] Add KeyboardAvoidingView for visible TextInput

---
 components/common/app-modal.js | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/components/common/app-modal.js b/components/common/app-modal.js
index c559ac5..7ee9f90 100644
--- a/components/common/app-modal.js
+++ b/components/common/app-modal.js
@@ -1,6 +1,7 @@
 import React from 'react'
 import {
   Dimensions,
+  KeyboardAvoidingView,
   Modal,
   StyleSheet,
   TouchableOpacity,
@@ -19,13 +20,15 @@ const AppModal = ({ children, onClose }) => (
     transparent={true}
     visible={true}
   >
-    <TouchableOpacity onPress={onClose} style={styles.blackBackground} />
-    <View style={styles.modalWindow}>
-      <View style={styles.headerContainer}>
-        <CloseIcon onClose={onClose} />
+    <KeyboardAvoidingView behavior={'padding'} style={styles.safeAreaView}>
+      <TouchableOpacity onPress={onClose} style={styles.blackBackground} />
+      <View style={styles.modalWindow}>
+        <View style={styles.headerContainer}>
+          <CloseIcon onClose={onClose} />
+        </View>
+        {children}
       </View>
-      {children}
-    </View>
+    </KeyboardAvoidingView>
   </Modal>
 )
 
@@ -62,6 +65,11 @@ const styles = StyleSheet.create({
     elevation: 2, // works on android
     minWidth: '80%',
   },
+  safeAreaView: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
 })
 
 export default AppModal