Pre-emptively fetch answer reaction state

app/controllers/answer_controller.rb

@@ -10,10 +10,12 @@ class AnswerController < ApplicationController
   def show
     @answer = Answer.includes(question: [:user], smiles: [:user]).find(params[:id])
     @display_all = true
+    @reacted_answer_ids = []
     @subscribed_answer_ids = []
 
     return unless user_signed_in?
 
+    @reacted_answer_ids = Reaction.where(user: current_user, parent: @answer).pluck(:parent_id)
     @subscribed_answer_ids = Subscription.where(user: current_user, answer: @answer).pluck(:answer_id)
     mark_notifications_as_read
   end

app/controllers/concerns/paginates_answers.rb

@@ -7,6 +7,10 @@ module PaginatesAnswers
     @answers_last_id = answer_ids.min
     answer_ids += @pinned_answers.pluck(:id) if @pinned_answers.present?
     @more_data_available = !yield(last_id: @answers_last_id, size: 1).count.zero?
-    @subscribed_answer_ids = Subscription.where(user: current_user, answer_id: answer_ids).pluck(:answer_id) if user_signed_in?
+
+    return unless user_signed_in?
+
+    @reacted_answer_ids = Reaction.where(user: current_user, parent_type: "Answer", parent_id: answer_ids).pluck(:parent_id)
+    @subscribed_answer_ids = Subscription.where(user: current_user, answer_id: answer_ids).pluck(:answer_id)
   end
 end

app/controllers/discover_controller.rb

@@ -14,6 +14,7 @@ class DiscoverController < ApplicationController
     @new_users = User.where("asked_count > 0").order(:id).reverse_order.limit(top_x).includes(:profile)
 
     answer_ids = @popular_answers.map(&:id) + @most_discussed.map(&:id)
+    @reacted_answer_ids = Reaction.where(user: current_user, parent_type: "Answer", parent_id: answer_ids).pluck(:parent_id)
     @subscribed_answer_ids = Subscription.where(user: current_user, answer_id: answer_ids).pluck(:answer_id)
 
     # .user = the user

app/controllers/timeline_controller.rb

@@ -35,6 +35,7 @@ class TimelineController < ApplicationController
     timeline_ids = @timeline.map(&:id)
     @timeline_last_id = timeline_ids.min
     @more_data_available = !yield(last_id: @timeline_last_id, size: 1).count.zero?
+    @reacted_answer_ids = Reaction.where(user: current_user, parent_type: "Answer", parent_id: timeline_ids).pluck(:parent_id)
     @subscribed_answer_ids = Subscription.where(user: current_user, answer_id: timeline_ids).pluck(:answer_id)
 
     respond_to do |format|

app/views/answer/show.html.haml

@@ -1,4 +1,4 @@
 - provide(:title, answer_title(@answer))
 - provide(:og, answer_opengraph(@answer))
 .container-lg.container--main
-  = render "answerbox", a: @answer, display_all: @display_all, subscribed_answer_ids: @subscribed_answer_ids
+  = render "answerbox", a: @answer, display_all: @display_all, subscribed_answer_ids: @subscribed_answer_ids, reacted_answer_ids: @reacted_answer_ids

app/views/answerbox/_actions.html.haml

@@ -1,4 +1,4 @@
-%button.btn.btn-link.answerbox__action{ type: :button, name: "ab-smile", data: { a_id: a.id, action: current_user&.smiled?(a) ? :unsmile : :smile, selection_hotkey: "s" }, disabled: !user_signed_in? }
+%button.btn.btn-link.answerbox__action{ type: :button, name: "ab-smile", data: { a_id: a.id, action: reacted_answer_ids&.include?(a.id) ? :unsmile : :smile, selection_hotkey: "s" }, disabled: !user_signed_in? }
   %i.fa.fa-fw.fa-smile-o
   %span{ id: "ab-smile-count-#{a.id}" }= a.smile_count
 - unless display_all

app/views/application/_answerbox.html.haml

@@ -22,7 +22,7 @@
               .answerbox__answer-date
                 = link_to(raw(t("time.distance_ago", time: time_tooltip(a))), answer_path(a.user.screen_name, a.id), data: { selection_hotkey: "l" })
         .col-md-6.d-flex.d-md-block.answerbox__actions
-          = render "answerbox/actions", a:, display_all:, subscribed_answer_ids:
+          = render "answerbox/actions", a:, display_all:, subscribed_answer_ids:, reacted_answer_ids:
     - else
       .row
         .col-md-6.text-start.text-muted
@@ -34,7 +34,7 @@
               %i.fa.fa-thumbtack
               = t(".pinned")
         .col-md-6.d-md-flex.answerbox__actions
-          = render "answerbox/actions", a:, display_all:, subscribed_answer_ids:
+          = render "answerbox/actions", a:, display_all:, subscribed_answer_ids:, reacted_answer_ids:
   .card-footer{ id: "ab-comments-section-#{a.id}", class: display_all.nil? ? "d-none" : nil }
     = turbo_frame_tag("ab-reactions-list-#{a.id}", src: reactions_path(a.question, a), loading: :lazy) do
       .d-flex.smiles

app/views/discover/tab/_answers.html.haml

@@ -1,3 +1,3 @@
 .tab-pane.active.fade.show{ role: :tabpanel, id: "answers" }
   - answers.each do |a|
-    = render "answerbox", a:, subscribed_answer_ids:
+    = render "answerbox", a:, subscribed_answer_ids:, reacted_answer_ids:

app/views/discover/tab/_discussed.html.haml

@@ -1,3 +1,3 @@
 .tab-pane.fade{ role: :tabpanel, id: "comments" }
   - comments.each do |a|
-    = render "answerbox", a:, subscribed_answer_ids:
+    = render "answerbox", a:, subscribed_answer_ids:, reacted_answer_ids:

app/views/question/show.html.haml

@@ -8,7 +8,7 @@
     %button.d-none{ data: { hotkey: "j", action: "navigation#down" } }
     %button.d-none{ data: { hotkey: "k", action: "navigation#up" } }
     - @answers.each do |a|
-      = render "answerbox", a:, show_question: false, subscribed_answer_ids: @subscribed_answer_ids
+      = render "answerbox", a:, show_question: false, subscribed_answer_ids: @subscribed_answer_ids, reacted_answer_ids: @reacted_answer_ids
 
   - if @more_data_available
     .d-flex.justify-content-center.justify-content-sm-start#paginator

app/views/question/show.turbo_stream.haml

@@ -1,6 +1,6 @@
 = turbo_stream.append "answers" do
   - @answers.each do |a|
-    = render "answerbox", a:, show_question: false, subscribed_answer_ids: @subscribed_answer_ids
+    = render "answerbox", a:, show_question: false, subscribed_answer_ids: @subscribed_answer_ids, reacted_answer_ids: @reacted_answer_ids
 
 = turbo_stream.update "paginator" do
   - if @more_data_available

app/views/timeline/timeline.html.haml

@@ -2,7 +2,7 @@
   %button.d-none{ data: { hotkey: "j", action: "navigation#down" } }
   %button.d-none{ data: { hotkey: "k", action: "navigation#up" } }
   - @timeline.each do |answer|
-    = render "answerbox", a: answer, subscribed_answer_ids: @subscribed_answer_ids
+    = render "answerbox", a: answer, subscribed_answer_ids: @subscribed_answer_ids, reacted_answer_ids: @reacted_answer_ids
 
 - if @more_data_available
   .d-flex.justify-content-center#paginator

app/views/timeline/timeline.turbo_stream.haml

@@ -1,6 +1,6 @@
 = turbo_stream.append "timeline" do
   - @timeline.each do |answer|
-    = render "answerbox", a: answer, subscribed_answer_ids: @subscribed_answer_ids
+    = render "answerbox", a: answer, subscribed_answer_ids: @subscribed_answer_ids, reacted_answer_ids: @reacted_answer_ids
 
 = turbo_stream.update "paginator" do
   - if @more_data_available

app/views/user/show.html.haml

@@ -4,11 +4,11 @@
     %button.d-none{ data: { hotkey: "k", action: "navigation#up" } }
     #pinned-answers
       - @pinned_answers.each do |a|
-        = render "answerbox", a:, subscribed_answer_ids: @subscribed_answer_ids
+        = render "answerbox", a:, subscribed_answer_ids: @subscribed_answer_ids, reacted_answer_ids: @reacted_answer_ids
 
     #answers
       - @answers.each do |a|
-        = render "answerbox", a:, subscribed_answer_ids: @subscribed_answer_ids
+        = render "answerbox", a:, subscribed_answer_ids: @subscribed_answer_ids, reacted_answer_ids: @reacted_answer_ids
 
 - if @more_data_available
   .d-flex.justify-content-center.justify-content-sm-start#paginator

app/views/user/show.turbo_stream.haml

@@ -1,6 +1,6 @@
 = turbo_stream.append "answers" do
   - @answers.each do |a|
-    = render "answerbox", a:, subscribed_answer_ids: @subscribed_answer_ids
+    = render "answerbox", a:, subscribed_answer_ids: @subscribed_answer_ids, reacted_answer_ids: @reacted_answer_ids
 
 = turbo_stream.update "paginator" do
   - if @more_data_available