Disable award emoji button but display tooltip26168-emoji-reactions-missing-tooltip-when-not-logged-in

5 files changed, 23 insertions, 10 deletions

diff --git a/app/assets/stylesheets/framework/awards.scss b/app/assets/stylesheets/framework/awards.scss
index 9fc9bcebc44..49907417e26 100644
--- a/app/assets/stylesheets/framework/awards.scss
+++ b/app/assets/stylesheets/framework/awards.scss
@@ -97,8 +97,20 @@
   padding: 5px 6px;
   outline: 0;
 
-  &:hover,
+  &.disabled {
+    cursor: default;
+
+    &:hover,
+    &:focus,
+    &:active {
+      background-color: $white-light;
+      border-color: $border-color;
+      box-shadow: none;
+    }
+  }
+
   &.active,
+  &:hover,
   &:active {
     background-color: $row-hover;
     border-color: $row-hover-border;
diff --git a/app/helpers/issues_helper.rb b/app/helpers/issues_helper.rb
index a8a49e43b05..74a9df963f8 100644
--- a/app/helpers/issues_helper.rb
+++ b/app/helpers/issues_helper.rb
@@ -128,8 +128,10 @@ module IssuesHelper
     names.to_sentence
   end
 
-  def award_active_class(awards, current_user)
-    if current_user && awards.find { |a| a.user_id == current_user.id }
+  def award_state_class(awards, current_user)
+    if !current_user
+      "disabled"
+    elsif current_user && awards.find { |a| a.user_id == current_user.id }
       "active"
     else
       ""
diff --git a/app/views/award_emoji/_awards_block.html.haml b/app/views/award_emoji/_awards_block.html.haml
index d8912eda314..e3305e21e96 100644
--- a/app/views/award_emoji/_awards_block.html.haml
+++ b/app/views/award_emoji/_awards_block.html.haml
@@ -2,8 +2,7 @@
 .awards.js-awards-block{ class: ("hidden" if !inline && grouped_emojis.empty?), data: { award_url: toggle_award_url(awardable) } }
   - awards_sort(grouped_emojis).each do |emoji, awards|
     %button.btn.award-control.js-emoji-btn.has-tooltip{ type: "button",
-      disabled: !current_user,
-      class: (award_active_class(awards, current_user)),
+      class: (award_state_class(awards, current_user)),
       data: { placement: "bottom", title: award_user_list(awards, current_user) } }
       = emoji_icon(emoji, sprite: false)
       %span.award-control-text.js-counter
diff --git a/spec/features/issues/award_emoji_spec.rb b/spec/features/issues/award_emoji_spec.rb
index efb53026449..73e43316dc7 100644
--- a/spec/features/issues/award_emoji_spec.rb
+++ b/spec/features/issues/award_emoji_spec.rb
@@ -76,7 +76,7 @@ describe 'Awards Emoji', feature: true do
     end
 
     it 'has disabled emoji button' do
-      expect(first('.award-control')[:disabled]).to be(true)
+      expect(first('.award-control')[:class]).to have_text('disabled')
     end
   end
 
diff --git a/spec/helpers/issues_helper_spec.rb b/spec/helpers/issues_helper_spec.rb
index abe08d95ece..9c7e0ee2fe0 100644
--- a/spec/helpers/issues_helper_spec.rb
+++ b/spec/helpers/issues_helper_spec.rb
@@ -98,15 +98,15 @@ describe IssuesHelper do
     end
   end
 
-  describe '#award_active_class' do
+  describe '#award_state_class' do
     let!(:upvote) { create(:award_emoji) }
 
-    it "returns empty string for unauthenticated user" do
-      expect(award_active_class(AwardEmoji.all, nil)).to eq("")
+    it "returns disabled string for unauthenticated user" do
+      expect(award_state_class(AwardEmoji.all, nil)).to eq("disabled")
     end
 
     it "returns active string for author" do
-      expect(award_active_class(AwardEmoji.all, upvote.user)).to eq("active")
+      expect(award_state_class(AwardEmoji.all, upvote.user)).to eq("active")
     end
   end