trying to fix modal scaling

src/components/Map/Panels/AddLandmarkPanel.tsx

@@ -8,7 +8,7 @@
 import { FontAwesome } from "@expo/vector-icons";
 import { ImageInfo } from "expo-image-picker/build/ImagePicker.types";
 import React, { memo, useEffect, useState } from "react";
-import { ActivityIndicator, Dimensions, Image, Keyboard, SafeAreaView, Text, TextInput, TouchableOpacity, View } from 'react-native';
+import { ActivityIndicator, Dimensions, Image, Keyboard, KeyboardEventName, Platform, SafeAreaView, Text, TextInput, TouchableOpacity, View } from 'react-native';
 import { ScrollView } from "react-native-gesture-handler";
 import Modal from 'react-native-modal';
 import Picker from 'react-native-picker-select';
@@ -55,23 +55,29 @@ const AddLandmarkPanel: React.FC<AddLandmarkProps> = ({newLandmark, setNewLandma
     const addLandmarkMutation = useAddLandmark()
 
     useEffect(() => {
-        const keyboardDidShowListener = Keyboard.addListener(
-          'keyboardWillShow',
-          () => {
-            setKeyboardOpened(true); // or some other action
-          }
-        );
-        const keyboardDidHideListener = Keyboard.addListener(
-          'keyboardWillHide',
-          () => {
-            setKeyboardOpened(false); // or some other action
-          }
-        );
-    
-        return () => {
-          keyboardDidHideListener.remove();
-          keyboardDidShowListener.remove();
-        };
+        let eventString= Platform.OS == "android" ? 'keyboardDidShow' : Platform.OS == "ios" ? 'keyboardWillShow' : null;
+        if (eventString) {
+            const validEventString: KeyboardEventName = eventString as KeyboardEventName;
+
+            const keyboardDidShowListener = Keyboard.addListener(
+                validEventString,
+                () => {
+                    console.log("Keyboard shown");
+                  setKeyboardOpened(true); // or some other action
+                }
+              );
+              const keyboardDidHideListener = Keyboard.addListener(
+                validEventString,
+                () => {
+                  setKeyboardOpened(false); // or some other action
+                }
+              );
+          
+              return () => {
+                keyboardDidHideListener.remove();
+                keyboardDidShowListener.remove();
+              };
+        }
       }, []);
 
     /**
@@ -79,6 +85,7 @@ const AddLandmarkPanel: React.FC<AddLandmarkProps> = ({newLandmark, setNewLandma
      */
      const determineModalHeight = () => {
         if (keyboardOpened) {
+            console.log('changing height')
             return Dimensions.get("window").height * .45
         }
         else if (photos?.length > 0) 
@@ -138,9 +145,9 @@ const AddLandmarkPanel: React.FC<AddLandmarkProps> = ({newLandmark, setNewLandma
             useNativeDriver={true}
             useNativeDriverForBackdrop={true}
             testID="addLMModal"
-            avoidKeyboard={true}
+            avoidKeyboard={false}
             onBackdropPress={close}
-            style={{justifyContent: "flex-end", height: '100%', margin: 0}}
+            style={{flex: 0,justifyContent: "flex-end", height: '100%', margin: 0}}
             isVisible={visible} >
             <SafeAreaView style={{backgroundColor: colors.red, height: determineModalHeight()}}>
                 {addLandmarkMutation.isIdle ?