PLT-751: Enable arrow to edit posts in comment threads

2 files changed, 34 insertions, 3 deletions

diff --git a/web/react/components/create_comment.jsx b/web/react/components/create_comment.jsx
index 2df3dc40f..73d5e27a6 100644
--- a/web/react/components/create_comment.jsx
+++ b/web/react/components/create_comment.jsx
@@ -13,8 +13,10 @@ const MsgTyping = require('./msg_typing.jsx');
 const FileUpload = require('./file_upload.jsx');
 const FilePreview = require('./file_preview.jsx');
 const Utils = require('../utils/utils.jsx');
+
 const Constants = require('../utils/constants.jsx');
 const ActionTypes = Constants.ActionTypes;
+const KeyCodes = Constants.KeyCodes;
 
 export default class CreateComment extends React.Component {
     constructor(props) {
@@ -25,6 +27,7 @@ export default class CreateComment extends React.Component {
         this.handleSubmit = this.handleSubmit.bind(this);
         this.commentMsgKeyPress = this.commentMsgKeyPress.bind(this);
         this.handleUserInput = this.handleUserInput.bind(this);
+        this.handleArrowUp = this.handleArrowUp.bind(this);
         this.handleUploadStart = this.handleUploadStart.bind(this);
         this.handleFileUploadComplete = this.handleFileUploadComplete.bind(this);
         this.handleUploadError = this.handleUploadError.bind(this);
@@ -147,6 +150,26 @@ export default class CreateComment extends React.Component {
         $('.post-right__scroll').perfectScrollbar('update');
         this.setState({messageText: messageText});
     }
+    handleArrowUp(e) {
+        if (e.keyCode === KeyCodes.UP && this.state.messageText === '') {
+            e.preventDefault();
+
+            const channelId = ChannelStore.getCurrentId();
+            const lastPost = PostStore.getCurrentUsersLatestPost(channelId, this.props.rootId);
+            if (!lastPost) {
+                return;
+            }
+
+            AppDispatcher.handleViewAction({
+                type: ActionTypes.RECIEVED_EDIT_POST,
+                refocusId: '#reply_textbox',
+                title: 'Comment',
+                message: lastPost.message,
+                postId: lastPost.id,
+                channelId: lastPost.channel_id
+            });
+        }
+    }
     handleUploadStart(clientIds) {
         let draft = PostStore.getCommentDraft(this.props.rootId);
 
@@ -279,6 +302,7 @@ export default class CreateComment extends React.Component {
                             <Textbox
                                 onUserInput={this.handleUserInput}
                                 onKeyPress={this.commentMsgKeyPress}
+                                onKeyDown={this.handleArrowUp}
                                 messageText={this.state.messageText}
                                 createMessage='Add a comment...'
                                 initialText=''
diff --git a/web/react/stores/post_store.jsx b/web/react/stores/post_store.jsx
index 8609d8bbf..90adc408d 100644
--- a/web/react/stores/post_store.jsx
+++ b/web/react/stores/post_store.jsx
@@ -230,7 +230,7 @@ class PostStoreClass extends EventEmitter {
     getPosts(channelId) {
         return BrowserStore.getItem('posts_' + channelId);
     }
-    getCurrentUsersLatestPost(channelId) {
+    getCurrentUsersLatestPost(channelId, rootId) {
         const userId = UserStore.getCurrentId();
         var postList = makePostListNonNull(this.getPosts(channelId));
         var i = 0;
@@ -239,8 +239,15 @@ class PostStoreClass extends EventEmitter {
 
         for (i; i < len; i++) {
             if (postList.posts[postList.order[i]].user_id === userId) {
-                lastPost = postList.posts[postList.order[i]];
-                break;
+                if (rootId) {
+                    if (postList.posts[postList.order[i]].root_id === rootId) {
+                        lastPost = postList.posts[postList.order[i]];
+                        break;
+                    }
+                } else {
+                    lastPost = postList.posts[postList.order[i]];
+                    break;
+                }
             }
         }