Merge pull request #2014 from asaadmahmoodspin/ui-improvements

Adding reply icon

1 files changed, 22 insertions, 17 deletions

diff --git a/web/react/components/post_info.jsx b/web/react/components/post_info.jsx
index 26bd6adde..73b47024c 100644
--- a/web/react/components/post_info.jsx
+++ b/web/react/components/post_info.jsx
@@ -22,6 +22,26 @@ export default class PostInfo extends React.Component {
 
         this.handlePermalinkCopy = this.handlePermalinkCopy.bind(this);
     }
+    createReplyLink() {
+        if (this.props.allowReply === 'true') {
+            var hideReply = '';
+
+            if (this.props.commentCount >= 1) {
+                hideReply = ' post__reply--hide';
+            }
+
+            return (
+                <div className={'post__reply' + hideReply}>
+                    <a
+                        onClick={this.props.handleCommentClick}
+                        href='#'
+                    >
+                        <span dangerouslySetInnerHTML={{__html: Constants.REPLY_ICON}}/>
+                    </a>
+                </div>
+            );
+        }
+    }
     createDropdown() {
         var post = this.props.post;
         var isOwner = UserStore.getCurrentId() === post.user_id;
@@ -42,23 +62,6 @@ export default class PostInfo extends React.Component {
             dataComments = this.props.commentCount;
         }
 
-        if (this.props.allowReply === 'true') {
-            dropdownContents.push(
-                <li
-                    key='replyLink'
-                    role='presentation'
-                >
-                    <a
-                        className='link__reply theme'
-                        href='#'
-                        onClick={this.props.handleCommentClick}
-                    >
-                        {'Reply'}
-                    </a>
-                </li>
-            );
-        }
-
         dropdownContents.push(
             <li
                 key='copyLink'
@@ -181,6 +184,7 @@ export default class PostInfo extends React.Component {
         }
 
         var dropdown = this.createDropdown();
+        var replyLink = this.createReplyLink();
 
         const permalink = TeamStore.getCurrentTeamUrl() + '/pl/' + post.id;
         const copyButtonText = this.state.copiedLink ? (<div>{'Copy '}<i className='fa fa-check'/></div>) : 'Copy';
@@ -223,6 +227,7 @@ export default class PostInfo extends React.Component {
                     />
                 </li>
                 <li className='col col__reply'>
+                    {replyLink}
                     <div
                         className='dropdown'
                         ref='dotMenu'