React Native Fixed Bottom Input Keyboard (Social Media Post UI)

I am trying to create a view post ui for a social media feature of our app. We have a post (the flatlist header component), the comments (the flatlist), and a fixed bottom text input that leverages zIndex to be placed over the flatlist to post comments. The problem is I cannot for the life of me figure out how to properly use a keyboard avoiding view to somehow push this fixed input up when the keyboard is shown. Is there any way to do this or maybe a simpler approach to this ui that I'm missing? I have tried using the keyboard height and adding it to the bottom positioning of the input but its slow and definitely isn't viable.

Code:

<View style={{flex: 1}}><View        style={{          ...styles.container,          marginTop: 0,          zIndex: 1,        }}><FlatList          style={{minHeight: '100%'}}          data={new Array(15)}          renderItem={({item, index}) => <CommentRow index={index} />}          keyExtractor={(item, index) => `${index}`}          ListHeaderComponent={renderHeader}          contentContainerStyle={{paddingBottom: 70}}        /></View><View        style={{          position: 'absolute',          bottom: 0,          backgroundColor: 'white',          width: '100%',          zIndex: 2,          padding: 15,          borderTopWidth: 1,          borderColor: '#f2f2f2',        }}><View style={styles.inputContainer}><TextInput style={styles.input} placeholder="Add a comment.." /><View style={styles.inputTextContainer}><Text style={styles.inputText}>Post</Text></View></View></View></View>  );