Merge pull request #107 from AnshumanDhiman/issue_work

Modified and Added feature to the Button in Comment Section

Author: kaybhutani

src/assets/scss/components/comments.scss

@@ -29,6 +29,10 @@
   }
 }
 
+.btn-comment-edit {
+  margin:2% 0;
+}
+
 .comment-form {
   margin: 16px 0px;
 }

src/components/Comments.js

@@ -168,9 +168,11 @@ const Comments = (props) => {
                       Reply
                     </Button>
                   )}
-                  {data.user_story_comment_replies.length > 0 ? (
+                  <br/> 
+                  {data.user_story_comment_replies.length == 1 ? (
+                  
                     <Button
-                      className='btn btn-default'
+                      className='btn btn-default btn-comment-edit'
                       onClick={() => {
                         toggleViewReplies(
                           viewRepliesToggled,
@@ -179,11 +181,23 @@ const Comments = (props) => {
                         )
                       }}
                     >
-                      View Replies ({data.user_story_comment_replies.length})
+                      {data.user_story_comment_replies.length} Reply
                     </Button>
-                  ) : (
+                  ) : data.user_story_comment_replies.length == 0 ? (
                     ''
-                  )}
+                  ) :  ( <Button
+                      className='btn btn-default btn-comment-edit'
+                      onClick={() => {
+                        toggleViewReplies(
+                          viewRepliesToggled,
+                          setViewRepliesToggled,
+                          key
+                        )
+                      }}
+                    >
+                      {data.user_story_comment_replies.length} Replies
+                    </Button>)   }
+                  
                 </div>
                 {viewRepliesToggled.find((item) => item === key + 1) &&
                   data.user_story_comment_replies.map((reply, key) => (