KeyboardAvoidingView leaves white space when user navigates to prev screen using swipe gesture in react native

I am trying to build a react native app but have navigation issues. When the user navigates between screens using gestures, I believe KeyboardAvoidingView creates empty space on the screen. In the following example. When the user swipes back from FormMainScreen to HomeScreen while the keyboard is active, an empty space appears on the Homepage. Please see the screenshots. appretiate any help in advance

App.jsx

import React from "react";
import { KeyboardAvoidingView, Platform } from "react-native";
import { Provider } from "react-redux";
import { store } from "./store";
import { NavigationContainer } from "@react-navigation/native";
import AuthNavigator from "./navigation/AuthNavigator";
import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";

export default function App() {
  return (
    <Provider store={store}>
      <NavigationContainer>
        <KeyboardAvoidingView
          style={{ flex: 1 }}
          behavior={Platform.OS === "ios" ? "padding" : "height"}
          // keyboardVerticalOffset={Platform.OS === "ios" ? -64 : 0}
        >
          {/* NAVIGATION */}
          <AuthNavigator />
        </KeyboardAvoidingView>
      </NavigationContainer>
    </Provider>
  );
}

AuthNavigator

const AuthNavigator = () => {
  return (
    <Stack.Navigator
      screenOptions={{
        headerShown: false
      }}
      initialRouteName="Home"
    >
      {/* <Stack.Screen name="Welcome" component={WelcomeScreen} /> */}
      <Stack.Screen name="Login" component={LoginScreen} />
      <Stack.Screen name="Register" component={RegisterScreen} />
      <Stack.Screen name="Home" component={TabNavigator} />
      <Stack.Screen name="FormMain" component={FormMain} />
      <Stack.Screen
        name="TaskConfirmation"
        component={TaskConfirmationScreen}
      />
      <Stack.Screen name="ProFound" component={ProFoundScreen} />
    </Stack.Navigator>
  );
};

HomeScreen in AuthNavigator

return (
    <Screen style={tw`bg-white h-full`}>
      <View>
        <View style={tw`px-2 py-1`}>
          <Image
            style={{
              width: 200,
              height: 100,
              resizeMode: "contain"
            }}
            source={logo}
          />
          <AppAutocomplete
            suggestions={autoCompleteSuggestions}
            onSuggestionPress={onSuggestionPress}
            onTextChange={handleTextChange}
            placeholder="What can we help with"
            inputValue={inputValue}
          />
        </View>
      </View>
    </Screen>
  );
};

FormMainScreen in AuthNavigator

<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
      <Screen style={{ flex: 1 }}>
        <ScrollView style={tw`p-2`} keyboardShouldPersistTaps="handled">
          <Text style={tw`text-center text-xl`}>More Info</Text>
          {isError && (
            <AppText style={tw`text-red-500 py-1`}>{errorMessage}</AppText>
          )}
          <View>
            <View>
              <AppText>Street</AppText>
              <GooglePlacesAutocomplete
                placeholder="1234 N Main St"
                styles={toInputBoxStyles}
                enablePoweredByContainer={false}
                query={{
                  key: GOOGLE_MAP_APIKEY,
                  language: "en",
                  components: "country:us" // Limit results to USA
                }}
                fetchDetails={true}
                returnKeyType={"search"}
                nearbyPlacesAPI="GooglePlacesSearch"
                debounce={400}
                onPress={handleGoogleAutocomplete}
                restrictions={{ country: "us" }}
              />
            </View>
            <AppText>Apt/Unit (optional)</AppText>
            <AppInput
              placeholder="Apt 2"
              value={unitNumber}
              onChangeText={setUnitNumber}
              keyboardType="numeric"
            />
            <AppText>Task</AppText>
            <AppInput
              placeholder="Task"
              value={currentTask.name}
              editable={false}
            />
            <AppText>Task</AppText>
            <AppInput
              placeholder="Task"
              value={currentTask.name}
              editable={false}
            />
            <AppText>Task</AppText>
            <AppInput
              placeholder="Task"
              value={currentTask.name}
              editable={false}
            />
            <AppText>Task</AppText>
            <AppInput
              placeholder="Task"
              value={currentTask.name}
              editable={false}
            />
            <AppText>Task</AppText>
            <AppInput placeholder="Task" value={currentTask.name} />
            <AppText>Task</AppText>
            <AppInput placeholder="Task" value={currentTask.name} />
            <AppText>Service Type</AppText>
            <AppInput value={currentTask.service.name} editable={false} />
            <AppButton text="Next" onPress={() => handleSubmit()} />
          </View>
        </ScrollView>
      </Screen>
    </TouchableWithoutFeedback>

HomePage

FormMain

Swiping back to Home from FormMain