react native gifted chat scroll view not adjusting height when keyboard showing (iOS)

I have implemented a chat screen with react-native-gifted-chat and am testing on iOS. The scrollview associated with the gifted chat works fine when the keyboard is not showing. However, when the keyboard is open to type in text, the input bar moves up and there is space below the input (the same height as the keyboard. The {{flex: 1}} is not adjusting the height to just fill the screen and goes below the screen.

Here is my code, it's quite straight forward:

<Content contentContainerStyle={{ flex: 1}}><View><HeaderPanel /></View><View                  style={{                    flex: 1,                    width: Metrics.screenWidth,                    backgroundColor: Colors.error,                  }}><GiftedChat/></View></Content>

My chat is behaving like this:

Image may be NSFW.
Clik here to view.

Image may be NSFW.
Clik here to view.

As you can see there is space below the input when the keyboard is showing and you can keep scrolling down below the chat window.