Merge pull request #651 from Retrospring/feature/turn-that-frown-upside-down

Remove "frown" state when an answer/comment is smiled

app/javascript/retrospring/features/answerbox/comment/smile.ts

@@ -47,11 +47,9 @@ export function commentSmileHandler(event: Event): void {
         switch(action) {
           case 'smile':
             button.dataset.action = 'unsmile';
-            button.innerHTML = `<i class="fa fa-fw fa-frown-o"></i> <span id="ab-comment-smile-count-${id}">${count}</span>`;
             break;
           case 'unsmile':
             button.dataset.action = 'smile';
-            button.innerHTML = `<i class="fa fa-fw fa-smile-o"></i> <span id="ab-comment-smile-count-${id}">${count}</span>`;
             break;
         }
       }

app/javascript/retrospring/features/answerbox/smile.ts

@@ -47,11 +47,9 @@ export function answerboxSmileHandler(event: Event): void {
         switch(action) {
           case 'smile':
             button.dataset.action = 'unsmile';
-            button.innerHTML = `<i class="fa fa-fw fa-frown-o"></i> <span id="ab-smile-count-${id}">${count}</span>`;
             break;
           case 'unsmile':
             button.dataset.action = 'smile';
-            button.innerHTML = `<i class="fa fa-fw fa-smile-o"></i> <span id="ab-smile-count-${id}">${count}</span>`;
             break;
         }
       }

app/views/answerbox/_actions.haml

@@ -1,17 +1,7 @@
 %span.d-none.d-sm-inline.text-muted
-  - if !user_signed_in? && a.smiles.count.positive?
+  %button.btn.btn-link.answerbox__action{ type: :button, name: "ab-smile", data: { a_id: a.id, action: current_user&.smiled?(a) ? :unsmile : :smile }, disabled: !user_signed_in? }
-    %button.btn.btn-info.btn-sm{ name: "ab-smile", disabled: true }
+    %i.fa.fa-fw.fa-smile-o
-      %i.fa.fa-smile-o
+    %span{ id: "ab-smile-count-#{a.id}" }= a.smiles.count
-      %span{ id: "ab-smile-count-#{a.id}" }= a.smiles.count
-- if user_signed_in?
-  - if current_user.smiled? a
-    %button.btn.btn-link.answerbox__action{ type: :button, name: "ab-smile", data: { a_id: a.id, action: :unsmile } }
-      %i.fa.fa-fw.fa-frown-o
-      %span{ id: "ab-smile-count-#{a.id}" }= a.smiles.count
-  - else
-    %button.btn.btn-link.answerbox__action{ type: :button, name: "ab-smile", data: { a_id: a.id, action: :smile } }
-      %i.fa.fa-fw.fa-smile-o
-      %span{ id: "ab-smile-count-#{a.id}" }= a.smiles.count
 - unless display_all
   %button.btn.btn-link.answerbox__action{ type: :button, name: "ab-comments", data: { a_id: a.id, state: :hidden } }
     %i.fa.fa-fw.fa-comments

app/views/answerbox/_comments.haml

@@ -18,19 +18,9 @@
               = markdown comment.content
           .pull-right
             %span.d-none.d-sm-inline.text-muted
-              - if !user_signed_in? && comment.smile_count.positive?
+              %button.btn.btn-link.answerbox__action{ type: :button, name: "ab-smile-comment", data: { c_id: comment.id, action: current_user&.smiled?(comment) ? :unsmile : :smile }, disabled: !user_signed_in? }
-                %button.btn.btn-link.answerbox__action{ name: "ab-smile-comment", disabled: true }
+                %i.fa.fa-fw.fa-smile-o
-                  %i.fa.fa-fw.fa-smile-o
+                %span{ id: "ab-comment-smile-count-#{comment.id}" }= comment.smile_count
-                  %span{ id: "ab-comment-smile-count-#{comment.id}" }= comment.smile_count
-            - if user_signed_in?
-              - if current_user.smiled? comment
-                %button.btn.btn-link.answerbox__action{ type: :button, name: "ab-smile-comment", data: { c_id: comment.id, action: :unsmile } }
-                  %i.fa.fa-fw.fa-frown-o
-                  %span{ id: "ab-comment-smile-count-#{comment.id}" }= comment.smile_count
-              - else
-                %button.btn.btn-link.answerbox__action{ type: :button, name: "ab-smile-comment", data: { c_id: comment.id, action: :smile } }
-                  %i.fa.fa-fw.fa-smile-o
-                  %span{ id: "ab-comment-smile-count-#{comment.id}" }= comment.smile_count
               .btn-group
                 %button.btn.btn-link.btn-sm.dropdown-toggle{ data: { toggle: :dropdown }, aria: { expanded: false } }
                   %span.caret