From 7140a7f7d15d0d00385e001c8cad6cdda7332bd0 Mon Sep 17 00:00:00 2001
From: Achille Urbain <7644970+waldojeffers@users.noreply.github.com>
Date: Fri, 22 Mar 2019 15:01:56 -0700
Subject: [PATCH] Make KeyboardAvoidingView with behavior="height" resize on
 keyboard close (#18889)

Summary:
<!--
  Required: Write your motivation here.
  If this PR fixes an issue, type "Fixes #issueNumber" to automatically close the issue when the PR is merged.
-->
Fixes #13754
Pull Request resolved: https://github.com/facebook/react-native/pull/18889

Differential Revision: D14486115

Pulled By: PeteTheHeat

fbshipit-source-id: 7b8b4fa9d2c99fc5d6145fed4681afdc4bb14fb8
---
 .../Keyboard/KeyboardAvoidingView.js          | 19 ++++++-------------
 1 file changed, 6 insertions(+), 13 deletions(-)

diff --git a/Libraries/Components/Keyboard/KeyboardAvoidingView.js b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
index b8b123c86bb2fa..c0ba05093cd51c 100644
--- a/Libraries/Components/Keyboard/KeyboardAvoidingView.js
+++ b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
@@ -65,6 +65,7 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
   _frame: ?ViewLayout = null;
   _subscriptions: Array<EmitterSubscription> = [];
   viewRef: {current: React.ElementRef<any> | null};
+  _initialFrameHeight: number = 0;
 
   constructor(props: Props) {
     super(props);
@@ -113,19 +114,11 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
 
   _onLayout = (event: ViewLayoutEvent) => {
     this._frame = event.nativeEvent.layout;
-  };
-
-  UNSAFE_componentWillUpdate(nextProps: Props, nextState: State): void {
-    if (
-      nextState.bottom === this.state.bottom &&
-      this.props.behavior === 'height' &&
-      nextProps.behavior === 'height'
-    ) {
-      // If the component rerenders without an internal state change, e.g.
-      // triggered by parent component re-rendering, no need for bottom to change.
-      nextState.bottom = 0;
+    if (!this._initialFrameHeight) {
+      // save the initial frame height, before the keyboard is visible
+      this._initialFrameHeight = this._frame.height;
     }
-  }
+  };
 
   componentDidMount(): void {
     if (Platform.OS === 'ios') {
@@ -166,7 +159,7 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
           // this.frame.height will never go back to its original value.
           // When height changes, we need to disable flex.
           heightStyle = {
-            height: this._frame.height - bottomHeight,
+            height: this._initialFrameHeight - bottomHeight,
             flex: 0,
           };
         }