Now handles commenting on a deleted post gracefully, and checks for any areas where data may no longer exist once a post has been deleted

3 files changed, 19 insertions, 20 deletions

diff --git a/web/react/components/create_comment.jsx b/web/react/components/create_comment.jsx
index 9c233ea26..550f85d3d 100644
--- a/web/react/components/create_comment.jsx
+++ b/web/react/components/create_comment.jsx
@@ -106,10 +106,11 @@ export default class CreateComment extends React.Component {
                 let state = {};
 
                 if (err.message === 'Invalid RootId parameter') {
+                    PostStore.removePendingPost(post.channel_id, post.pending_post_id);
+
                     if ($('#post_deleted').length > 0) {
                         $('#post_deleted').modal('show');
                     }
-                    PostStore.removePendingPost(post.pending_post_id);
                 } else {
                     post.state = Constants.POST_FAILED;
                     PostStore.updatePendingPost(post);
diff --git a/web/react/components/post_deleted_modal.jsx b/web/react/components/post_deleted_modal.jsx
index 024097428..3f487d20f 100644
--- a/web/react/components/post_deleted_modal.jsx
+++ b/web/react/components/post_deleted_modal.jsx
@@ -14,9 +14,12 @@ export default class PostDeletedModal extends React.Component {
 
         this.state = {};
     }
-    handleClose(e) {
-        e.preventDefault();
-
+    componentDidMount() {
+        $(React.findDOMNode(this.refs.modal)).on('hidden.bs.modal', () => {
+            this.handleClose();
+        });
+    }
+    handleClose() {
         AppDispatcher.handleServerAction({
             type: ActionTypes.RECIEVED_SEARCH,
             results: null
@@ -56,26 +59,25 @@ export default class PostDeletedModal extends React.Component {
                                     data-dismiss='modal'
                                     aria-label='Close'
                                 >
-                                    <span aria-hidden='true'>&times;</span>
+                                    <span aria-hidden='true'>{'×'}</span>
                                 </button>
                                 <h4
                                     className='modal-title'
                                     id='myModalLabel'
                                 >
-                                    Post deleted
+                                    {'Comment could not be posted'}
                                 </h4>
                             </div>
                             <div className='modal-body'>
-                                <p>The post you were viewing was deleted by the owner.</p>
+                                <p>{'Someone deleted the message on which you tried to post a comment.'}</p>
                             </div>
                             <div className='modal-footer'>
                                 <button
                                     type='button'
                                     className='btn btn-primary'
                                     data-dismiss='modal'
-                                    onClick={this.handleClose}
                                 >
-                                    Okay
+                                    {'Okay'}
                                 </button>
                             </div>
                         </div>
diff --git a/web/react/components/rhs_thread.jsx b/web/react/components/rhs_thread.jsx
index fdcf618d7..27a784701 100644
--- a/web/react/components/rhs_thread.jsx
+++ b/web/react/components/rhs_thread.jsx
@@ -23,7 +23,7 @@ export default class RhsThread extends React.Component {
     }
     getStateFromStores() {
         var postList = PostStore.getSelectedPost();
-        if (!postList || postList.order.length < 1) {
+        if (!postList || postList.order.length < 1 || !postList.posts[postList.order[0]]) {
             return {postList: {}};
         }
 
@@ -49,7 +49,10 @@ export default class RhsThread extends React.Component {
         }.bind(this));
     }
     componentDidUpdate() {
-        $('.post-right__scroll').scrollTop($('.post-right__scroll')[0].scrollHeight);
+        if ($('.post-right__scroll')[0]) {
+            $('.post-right__scroll').scrollTop($('.post-right__scroll')[0].scrollHeight);
+        }
+
         $('.post-right__scroll').perfectScrollbar('update');
         this.resize();
     }
@@ -67,17 +70,10 @@ export default class RhsThread extends React.Component {
         // if something was changed in the channel like adding a
         // comment or post then lets refresh the sidebar list
         var currentSelected = PostStore.getSelectedPost();
-        if (!currentSelected || currentSelected.order.length === 0) {
+        if (!currentSelected || currentSelected.order.length === 0 || !currentSelected.posts[currentSelected.order[0]]) {
             return;
         }
 
-        if (!currentSelected.posts[currentSelected.order[0]]) {
-            if ($('#post_deleted').length > 0) {
-                $('#post_deleted').modal('show');
-                return;
-            }
-        }
-
         var currentPosts = PostStore.getPosts(currentSelected.posts[currentSelected.order[0]].channel_id);
 
         if (!currentPosts || currentPosts.order.length === 0) {
@@ -110,7 +106,7 @@ export default class RhsThread extends React.Component {
     render() {
         var postList = this.state.postList;
 
-        if (postList == null) {
+        if (postList == null || !postList.order) {
             return (
                 <div></div>
             );