From f35af0b9a2f891878ee4b7af13893c19023971f8 Mon Sep 17 00:00:00 2001
From: Achille Urbain <7644970+WaldoJeffers@users.noreply.github.com>
Date: Mon, 16 Apr 2018 22:57:13 +0200
Subject: [PATCH 1/4] Save initial frame height & reuse it

---
 .../Keyboard/KeyboardAvoidingView.js           | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/Libraries/Components/Keyboard/KeyboardAvoidingView.js b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
index ffb6c58fe6379f..32005dacd22587 100644
--- a/Libraries/Components/Keyboard/KeyboardAvoidingView.js
+++ b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
@@ -86,6 +86,8 @@ const KeyboardAvoidingView = createReactClass({
     };
   },
 
+  initialFrameHeight: 0,
+
   subscriptions: ([]: Array<EmitterSubscription>),
   frame: (null: ?ViewLayout),
 
@@ -129,15 +131,9 @@ const KeyboardAvoidingView = createReactClass({
 
   _onLayout(event: ViewLayoutEvent) {
     this.frame = event.nativeEvent.layout;
-  },
-
-  UNSAFE_componentWillUpdate(nextProps: Object, nextState: Object, nextContext?: Object): 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;
     }
   },
 
@@ -165,12 +161,12 @@ const KeyboardAvoidingView = createReactClass({
     switch (behavior) {
       case 'height':
         let heightStyle;
-        if (this.frame) {
+        if (this.frame && this.state.bottom) {
           // Note that we only apply a height change when there is keyboard present,
           // i.e. this.state.bottom is greater than 0. If we remove that condition,
           // 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, flex: 0};
+          heightStyle = {height: this.initialFrameHeight - bottomHeight, flex: 0};
         }
         return (
           <View ref={viewRef} style={[style, heightStyle]} onLayout={this._onLayout} {...props}>

From 12384ae9305ba0fc3b889c77c1f9c4eb298dc150 Mon Sep 17 00:00:00 2001
From: Achille Urbain <7644970+WaldoJeffers@users.noreply.github.com>
Date: Sat, 18 Aug 2018 14:15:45 +0200
Subject: [PATCH 2/4] Fix frame reference

---
 Libraries/Components/Keyboard/KeyboardAvoidingView.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Libraries/Components/Keyboard/KeyboardAvoidingView.js b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
index af85549515d4d6..d1af0bd7f43dd8 100644
--- a/Libraries/Components/Keyboard/KeyboardAvoidingView.js
+++ b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
@@ -150,7 +150,7 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
     switch (behavior) {
       case 'height':
         let heightStyle;
-        if (this.frame !== null && this.state.bottom) {
+        if (this._frame != null && this.state.bottom > 0) {
           // Note that we only apply a height change when there is keyboard present,
           // i.e. this.state.bottom is greater than 0. If we remove that condition,
           // this.frame.height will never go back to its original value.

From e9dae83492dfb05e6801fa892dafddf0f4434143 Mon Sep 17 00:00:00 2001
From: Achille Urbain <7644970+WaldoJeffers@users.noreply.github.com>
Date: Sat, 18 Aug 2018 14:17:51 +0200
Subject: [PATCH 3/4] Fix onLayout definition

---
 Libraries/Components/Keyboard/KeyboardAvoidingView.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/Libraries/Components/Keyboard/KeyboardAvoidingView.js b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
index d1af0bd7f43dd8..f4293add7bff02 100644
--- a/Libraries/Components/Keyboard/KeyboardAvoidingView.js
+++ b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
@@ -109,13 +109,13 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
     this.setState({bottom: height});
   };
 
-  _onLayout(event: ViewLayoutEvent) {
+  _onLayout = (event: ViewLayoutEvent) => {
     this._frame = event.nativeEvent.layout;
     if (!this._initialFrameHeight) {
       // save the initial frame height, before the keyboard is visible
       this._initialFrameHeight = this._frame.height;
     }
-  }
+  };
 
   componentDidMount(): void {
     if (Platform.OS === 'ios') {

From 708a789e7e1d39e8735fa75122fed74f1345a117 Mon Sep 17 00:00:00 2001
From: Achille Urbain <7644970+WaldoJeffers@users.noreply.github.com>
Date: Sat, 18 Aug 2018 14:42:07 +0200
Subject: [PATCH 4/4] Fix flow type

---
 Libraries/Components/Keyboard/KeyboardAvoidingView.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Libraries/Components/Keyboard/KeyboardAvoidingView.js b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
index f4293add7bff02..c2152d2bc91f38 100644
--- a/Libraries/Components/Keyboard/KeyboardAvoidingView.js
+++ b/Libraries/Components/Keyboard/KeyboardAvoidingView.js
@@ -65,7 +65,7 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
 
   _frame: ?ViewLayout = null;
   _subscriptions: Array<EmitterSubscription> = [];
-  _initialFrameHeight: 0;
+  _initialFrameHeight: number = 0;
 
   state = {
     bottom: 0,