From dc554bdfa7fb51c6311977fc4d0aab1f100f8093 Mon Sep 17 00:00:00 2001
From: Miguel Alatzar <migbot@users.noreply.github.com>
Date: Thu, 25 Apr 2019 07:51:47 -0700
Subject: [PATCH] Delay PostTextbox animation on iOS when clearing text (#2739)

---
 app/components/post_textbox/post_textbox.js | 48 ++++++++++++++-------
 1 file changed, 33 insertions(+), 15 deletions(-)

diff --git a/app/components/post_textbox/post_textbox.js b/app/components/post_textbox/post_textbox.js
index 18641f91f..333cd36e1 100644
--- a/app/components/post_textbox/post_textbox.js
+++ b/app/components/post_textbox/post_textbox.js
@@ -380,23 +380,41 @@ export default class PostTextbox extends PureComponent {
                 }
             }
 
-            this.handleTextChange('');
-            this.changeDraft('');
-
-            // Shrink the input textbox since the layout events lag slightly
-            const nextState = {
-                contentHeight: INITIAL_HEIGHT,
-            };
-
-            // Fixes the issue where Android predictive text would prepend suggestions to the post draft when messages
-            // are typed successively without blurring the input
-            let callback;
-            if (Platform.OS === 'android') {
-                nextState.keyboardType = 'email-address';
-                callback = () => this.setState({keyboardType: 'default'});
+            if (Platform.OS === 'ios') {
+                // On iOS, if the PostTextbox height increases from its
+                // initial height (due to a multiline post or a post whose
+                // message wraps, for example), then when the text is cleared
+                // the PostTextbox height decrease will be animated. This
+                // animation in conjunction with the PostList animation as it
+                // receives the newly created post is causing issues in the iOS
+                // PostList component as it fails to properly react to its content
+                // size changes. While a proper fix is determined for the PostList
+                // component, a small delay in triggering the height decrease
+                // animation gives the PostList enough time to first handle content
+                // size changes from the new post.
+                setTimeout(() => {
+                    this.handleTextChange('');
+                }, 250);
+            } else {
+                this.handleTextChange('');
             }
 
-            this.setState(nextState, callback);
+            this.changeDraft('');
+
+            let callback;
+            if (Platform.OS === 'android') {
+                // Shrink the input textbox since the layout events lag slightly
+                const nextState = {
+                    contentHeight: INITIAL_HEIGHT,
+                };
+
+                // Fixes the issue where Android predictive text would prepend suggestions to the post draft when messages
+                // are typed successively without blurring the input
+                nextState.keyboardType = 'email-address';
+                callback = () => this.setState({keyboardType: 'default'});
+
+                this.setState(nextState, callback);
+            }
         }
     };