From 63c122bc028198704485e00cc47c7ba2218e9708 Mon Sep 17 00:00:00 2001
From: Harrison Healey <harrisonmhealey@gmail.com>
Date: Fri, 7 Apr 2017 14:21:58 -0400
Subject: PLT-6201/PLT-6220 Don't show pin or reaction options for system
 messages (#6010)

* PLT-6220 Removed ability to react to system messages

* PLT-6201 Removed ability to pin system messages
---
 .../post_view/components/post_header.jsx           |   1 -
 .../components/post_view/components/post_info.jsx  | 167 ++++++++++-----------
 2 files changed, 82 insertions(+), 86 deletions(-)

(limited to 'webapp/components/post_view')

diff --git a/webapp/components/post_view/components/post_header.jsx b/webapp/components/post_view/components/post_header.jsx
index 5e0a8a5a4..3b5df47d5 100644
--- a/webapp/components/post_view/components/post_header.jsx
+++ b/webapp/components/post_view/components/post_header.jsx
@@ -82,7 +82,6 @@ export default class PostHeader extends React.Component {
                         commentCount={this.props.commentCount}
                         handleCommentClick={this.props.handleCommentClick}
                         handleDropdownOpened={this.props.handleDropdownOpened}
-                        allowReply={!isSystemMessage}
                         isLastComment={this.props.isLastComment}
                         sameUser={this.props.sameUser}
                         currentUser={this.props.currentUser}
diff --git a/webapp/components/post_view/components/post_info.jsx b/webapp/components/post_view/components/post_info.jsx
index 1da3ecd24..509809c8c 100644
--- a/webapp/components/post_view/components/post_info.jsx
+++ b/webapp/components/post_view/components/post_info.jsx
@@ -63,13 +63,8 @@ export default class PostInfo extends React.Component {
         $('#post_dropdown' + this.props.post.id).on('hidden.bs.dropdown', () => this.props.handleDropdownOpened(false));
     }
 
-    createDropdown() {
+    createDropdown(isSystemMessage) {
         const post = this.props.post;
-        const isSystemMessage = PostUtils.isSystemMessage(post);
-
-        if (post.state === Constants.POST_FAILED || post.state === Constants.POST_LOADING) {
-            return '';
-        }
 
         var type = 'Post';
         if (post.root_id && post.root_id.length > 0) {
@@ -82,7 +77,7 @@ export default class PostInfo extends React.Component {
             dataComments = this.props.commentCount;
         }
 
-        if (this.props.allowReply) {
+        if (!isSystemMessage) {
             dropdownContents.push(
                 <li
                     key='replyLink'
@@ -157,42 +152,42 @@ export default class PostInfo extends React.Component {
                     </a>
                 </li>
             );
-        }
 
-        if (this.props.post.is_pinned) {
-            dropdownContents.push(
-                <li
-                    key='unpinLink'
-                    role='presentation'
-                >
-                    <a
-                        href='#'
-                        onClick={this.unpinPost}
+            if (this.props.post.is_pinned) {
+                dropdownContents.push(
+                    <li
+                        key='unpinLink'
+                        role='presentation'
                     >
-                        <FormattedMessage
-                            id='post_info.unpin'
-                            defaultMessage='Un-pin from channel'
-                        />
-                    </a>
-                </li>
-            );
-        } else {
-            dropdownContents.push(
-                <li
-                    key='pinLink'
-                    role='presentation'
-                >
-                    <a
-                        href='#'
-                        onClick={this.pinPost}
+                        <a
+                            href='#'
+                            onClick={this.unpinPost}
+                        >
+                            <FormattedMessage
+                                id='post_info.unpin'
+                                defaultMessage='Un-pin from channel'
+                            />
+                        </a>
+                    </li>
+                );
+            } else {
+                dropdownContents.push(
+                    <li
+                        key='pinLink'
+                        role='presentation'
                     >
-                        <FormattedMessage
-                            id='post_info.pin'
-                            defaultMessage='Pin to channel'
-                        />
-                    </a>
-                </li>
-            );
+                        <a
+                            href='#'
+                            onClick={this.pinPost}
+                        >
+                            <FormattedMessage
+                                id='post_info.pin'
+                                defaultMessage='Pin to channel'
+                            />
+                        </a>
+                    </li>
+                );
+            }
         }
 
         if (this.canDelete) {
@@ -331,21 +326,28 @@ export default class PostInfo extends React.Component {
 
     render() {
         var post = this.props.post;
-        var comments = '';
-        var showCommentClass = '';
-        var commentCountText = this.props.commentCount;
         const flagIcon = Constants.FLAG_ICON_SVG;
 
         this.canDelete = PostUtils.canDeletePost(post);
         this.canEdit = PostUtils.canEditPost(post, this.editDisableAction);
 
-        if (this.props.commentCount >= 1) {
-            showCommentClass = ' icon--show';
-        } else {
-            commentCountText = '';
-        }
+        const isEphemeral = Utils.isPostEphemeral(post);
+        const isPending = post.state === Constants.POST_FAILED || post.state === Constants.POST_LOADING;
+        const isSystemMessage = PostUtils.isSystemMessage(post);
+
+        let comments = null;
+        let react = null;
+        if (!isEphemeral && !isPending && !isSystemMessage) {
+            let showCommentClass;
+            let commentCountText;
+            if (this.props.commentCount >= 1) {
+                showCommentClass = ' icon--show';
+                commentCountText = this.props.commentCount;
+            } else {
+                showCommentClass = '';
+                commentCountText = '';
+            }
 
-        if (post.state !== Constants.POST_FAILED && post.state !== Constants.POST_LOADING && !Utils.isPostEphemeral(post) && this.props.allowReply) {
             comments = (
                 <a
                     href='#'
@@ -361,51 +363,48 @@ export default class PostInfo extends React.Component {
                     </span>
                 </a>
             );
-        }
 
-        let react;
-        if (post.state !== Constants.POST_FAILED &&
-            post.state !== Constants.POST_LOADING &&
-            !Utils.isPostEphemeral(post) &&
-            Utils.isFeatureEnabled(Constants.PRE_RELEASE_FEATURES.EMOJI_PICKER_PREVIEW)) {
-            react = (
-                <span>
-                    <Overlay
-                        show={this.state.showEmojiPicker}
-                        placement='top'
-                        rootClose={true}
-                        container={this}
-                        onHide={() => this.setState({showEmojiPicker: false})}
-                        target={() => ReactDOM.findDOMNode(this.refs['reactIcon_' + post.id])}
+            if (Utils.isFeatureEnabled(Constants.PRE_RELEASE_FEATURES.EMOJI_PICKER_PREVIEW)) {
+                react = (
+                    <span>
+                        <Overlay
+                            show={this.state.showEmojiPicker}
+                            placement='top'
+                            rootClose={true}
+                            container={this}
+                            onHide={() => this.setState({showEmojiPicker: false})}
+                            target={() => ReactDOM.findDOMNode(this.refs['reactIcon_' + post.id])}
 
-                    >
-                        <EmojiPicker
-                            onEmojiClick={this.reactEmojiClick}
-                            pickerLocation='top'
+                        >
+                            <EmojiPicker
+                                onEmojiClick={this.reactEmojiClick}
+                                pickerLocation='top'
 
-                        />
-                    </Overlay>
-                    <a
-                        href='#'
-                        className='reacticon__container'
-                        onClick={this.emojiPickerClick}
-                        ref={'reactIcon_' + post.id}
-                    ><i className='fa fa-smile-o'/>
-                    </a>
-                </span>
+                            />
+                        </Overlay>
+                        <a
+                            href='#'
+                            className='reacticon__container'
+                            onClick={this.emojiPickerClick}
+                            ref={'reactIcon_' + post.id}
+                        ><i className='fa fa-smile-o'/>
+                        </a>
+                    </span>
 
-            );
+                );
+            }
         }
 
         let options;
-        if (Utils.isPostEphemeral(post)) {
+        if (isEphemeral) {
             options = (
                 <li className='col col__remove'>
                     {this.createRemovePostButton()}
                 </li>
             );
-        } else {
-            const dropdown = this.createDropdown();
+        } else if (!isPending) {
+            const dropdown = this.createDropdown(isSystemMessage);
+
             if (dropdown) {
                 options = (
                     <li className='col col__reply'>
@@ -461,7 +460,7 @@ export default class PostInfo extends React.Component {
         }
 
         let flagTrigger;
-        if (!Utils.isPostEphemeral(post)) {
+        if (isEphemeral) {
             flagTrigger = (
                 <OverlayTrigger
                     key={'flagtooltipkey' + flagVisible}
@@ -516,14 +515,12 @@ PostInfo.defaultProps = {
     post: null,
     commentCount: 0,
     isLastComment: false,
-    allowReply: false,
     sameUser: false
 };
 PostInfo.propTypes = {
     post: React.PropTypes.object.isRequired,
     commentCount: React.PropTypes.number.isRequired,
     isLastComment: React.PropTypes.bool.isRequired,
-    allowReply: React.PropTypes.bool.isRequired,
     handleCommentClick: React.PropTypes.func.isRequired,
     handleDropdownOpened: React.PropTypes.func.isRequired,
     sameUser: React.PropTypes.bool.isRequired,
-- 
cgit v1.2.3-1-g7c22