From ae3de5c1f26fc331996b3fcf75b5c22b80410c08 Mon Sep 17 00:00:00 2001
From: Chris Duarte <csduarte@users.noreply.github.com>
Date: Thu, 30 Mar 2017 19:46:20 -0700
Subject: [PATCH] PLT-6145 RN: File upload overlay doesn't clear (#437)

---
 app/components/file_upload_preview/file_upload_preview.js | 3 ++-
 app/components/file_upload_preview/index.js               | 1 +
 app/components/post_textbox/post_textbox.js               | 7 +++++--
 app/components/post_textbox/post_textbox_container.js     | 1 +
 app/scenes/image_preview/image_preview.js                 | 8 +++++++-
 app/scenes/load_team/load_team.js                         | 2 +-
 6 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/app/components/file_upload_preview/file_upload_preview.js b/app/components/file_upload_preview/file_upload_preview.js
index 4e072a68d..85d6ebc93 100644
--- a/app/components/file_upload_preview/file_upload_preview.js
+++ b/app/components/file_upload_preview/file_upload_preview.js
@@ -26,6 +26,7 @@ export default class FileUploadPreview extends PureComponent {
             handleRemoveFile: PropTypes.func.isRequired
         }).isRequired,
         channelId: PropTypes.string.isRequired,
+        channelIsLoading: PropTypes.bool,
         createPostRequestStatus: PropTypes.string.isRequired,
         fetchCache: PropTypes.object.isRequired,
         files: PropTypes.array.isRequired,
@@ -70,7 +71,7 @@ export default class FileUploadPreview extends PureComponent {
     }
 
     render() {
-        if (!this.props.files.length && this.props.uploadFileRequestStatus !== RequestStatus.STARTED) {
+        if (this.props.channelIsLoading || (!this.props.files.length && this.props.uploadFileRequestStatus !== RequestStatus.STARTED)) {
             return null;
         }
 
diff --git a/app/components/file_upload_preview/index.js b/app/components/file_upload_preview/index.js
index beffe33ab..203d0bb8f 100644
--- a/app/components/file_upload_preview/index.js
+++ b/app/components/file_upload_preview/index.js
@@ -13,6 +13,7 @@ import FileUploadPreview from './file_upload_preview';
 function mapStateToProps(state, ownProps) {
     return {
         ...ownProps,
+        channelIsLoading: state.views.channel.loading,
         createPostRequestStatus: state.requests.posts.createPost.status,
         fetchCache: state.views.fetchCache,
         uploadFileRequestStatus: state.requests.files.uploadFiles.status,
diff --git a/app/components/post_textbox/post_textbox.js b/app/components/post_textbox/post_textbox.js
index f4bd0a2c0..53cfdacbe 100644
--- a/app/components/post_textbox/post_textbox.js
+++ b/app/components/post_textbox/post_textbox.js
@@ -26,6 +26,7 @@ const MAX_CONTENT_HEIGHT = 100;
 
 export default class PostTextbox extends PureComponent {
     static propTypes = {
+        channelIsLoading: PropTypes.bool.isRequired,
         currentUserId: PropTypes.string.isRequired,
         typing: PropTypes.array.isRequired,
         teamId: PropTypes.string.isRequired,
@@ -238,11 +239,13 @@ export default class PostTextbox extends PureComponent {
     };
 
     render() {
-        const {theme} = this.props;
+        const {channelIsLoading, theme, value} = this.props;
 
         const style = getStyleSheet(theme);
         const textInputHeight = Math.min(this.state.contentHeight, MAX_CONTENT_HEIGHT);
 
+        const textValue = channelIsLoading ? '' : value;
+
         let placeholder;
         if (this.props.rootId) {
             placeholder = {id: 'create_comment.addComment', defaultMessage: 'Add a comment...'};
@@ -290,7 +293,7 @@ export default class PostTextbox extends PureComponent {
                         <View style={style.inputContainer}>
                             <TextInputWithLocalizedPlaceholder
                                 ref='input'
-                                value={this.props.value}
+                                value={textValue}
                                 onChangeText={this.handleTextChange}
                                 onSelectionChange={this.handleSelectionChange}
                                 onContentSizeChange={this.handleContentSizeChange}
diff --git a/app/components/post_textbox/post_textbox_container.js b/app/components/post_textbox/post_textbox_container.js
index 1c7ad47f5..4b7bb975f 100644
--- a/app/components/post_textbox/post_textbox_container.js
+++ b/app/components/post_textbox/post_textbox_container.js
@@ -17,6 +17,7 @@ import PostTextbox from './post_textbox';
 function mapStateToProps(state, ownProps) {
     return {
         ...ownProps,
+        channelIsLoading: state.views.channel.loading,
         currentUserId: getCurrentUserId(state),
         typing: getUsersTyping(state),
         theme: getTheme(state),
diff --git a/app/scenes/image_preview/image_preview.js b/app/scenes/image_preview/image_preview.js
index f1d899d65..6d8168cba 100644
--- a/app/scenes/image_preview/image_preview.js
+++ b/app/scenes/image_preview/image_preview.js
@@ -130,6 +130,12 @@ export default class ImagePreview extends PureComponent {
         }
     }
 
+    handleClose = () => {
+        if (this.state.showFileInfo) {
+            this.props.actions.goBack();
+        }
+    }
+
     handleImageTap = () => {
         /*if (!this.lastPress) {
             this.lastPress = Date.now();
@@ -268,7 +274,7 @@ export default class ImagePreview extends PureComponent {
                         <View style={style.header}>
                             <View style={style.headerControls}>
                                 <TouchableOpacity
-                                    onPress={this.props.actions.goBack}
+                                    onPress={this.handleClose}
                                     style={style.headerIcon}
                                 >
                                     <Icon
diff --git a/app/scenes/load_team/load_team.js b/app/scenes/load_team/load_team.js
index 2941596d8..142c4e7ff 100644
--- a/app/scenes/load_team/load_team.js
+++ b/app/scenes/load_team/load_team.js
@@ -26,7 +26,7 @@ export default class LoadTeam extends PureComponent {
 
     static navigationProps = {
         renderBackButton: () => null,
-        renderTitleComponent: () => <View style={{flex: 1, backgroundColor: 'blue'}}/>
+        renderTitleComponent: () => null
     }
 
     componentDidMount() {