diff --git a/public/assets/fire.svg b/app/assets/images/fire.svg similarity index 100% rename from public/assets/fire.svg rename to app/assets/images/fire.svg diff --git a/public/assets/lightbulb.svg b/app/assets/images/lightbulb.svg similarity index 100% rename from public/assets/lightbulb.svg rename to app/assets/images/lightbulb.svg diff --git a/public/assets/multi-unicorn.svg b/app/assets/images/multi-unicorn.svg similarity index 100% rename from public/assets/multi-unicorn.svg rename to app/assets/images/multi-unicorn.svg diff --git a/public/assets/raised-hands.svg b/app/assets/images/raised-hands.svg similarity index 100% rename from public/assets/raised-hands.svg rename to app/assets/images/raised-hands.svg diff --git a/public/assets/sparkle-heart.svg b/app/assets/images/sparkle-heart.svg similarity index 100% rename from public/assets/sparkle-heart.svg rename to app/assets/images/sparkle-heart.svg diff --git a/app/assets/javascripts/utilities/buildArticleHTML.js b/app/assets/javascripts/utilities/buildArticleHTML.js index 7c272945c..380196090 100644 --- a/app/assets/javascripts/utilities/buildArticleHTML.js +++ b/app/assets/javascripts/utilities/buildArticleHTML.js @@ -112,30 +112,14 @@ function buildArticleHTML(article, currentUserId = null) { var reactionsText = reactionsCount === 1 ? 'reaction' : 'reactions'; if (article.class_name !== 'User' && reactionsCount > 0) { - var icons = []; - for (var category of article.public_reaction_categories) { - var icon = ``; - icons = icons.concat( - `${icon}`, - ); - } - icons.reverse(); - - reactionsDisplay = ` -
- - ${icons.join()} - - - - - -
-
`; + reactionsDisplay = + '' + + reactionsCount + + ``; } var picUrl; diff --git a/app/javascript/articles/__tests__/utilities/articleUtilities.js b/app/javascript/articles/__tests__/utilities/articleUtilities.js index ed603186b..b0993a18a 100644 --- a/app/javascript/articles/__tests__/utilities/articleUtilities.js +++ b/app/javascript/articles/__tests__/utilities/articleUtilities.js @@ -128,32 +128,6 @@ export const articleWithReactions = { readable_publish_date: 'February 18', top_comments: [], public_reactions_count: 232, - public_reaction_categories: [ - { - slug: 'like', - name: 'Like', - icon: 'sparkle-heart', - position: 1, - }, - { - slug: 'unicorn', - name: 'Unicorn', - icon: 'multi-unicorn', - position: 2, - }, - { - slug: 'raised_hands', - name: 'Raised Hands', - icon: 'raised-hands', - position: 4, - }, - { - slug: 'fire', - name: 'Fire', - icon: 'fire', - position: 5, - }, - ], }; export const articleWithoutReactions = { diff --git a/app/javascript/articles/components/ReactionsCount.jsx b/app/javascript/articles/components/ReactionsCount.jsx index b7fbbb231..6da4c139e 100644 --- a/app/javascript/articles/components/ReactionsCount.jsx +++ b/app/javascript/articles/components/ReactionsCount.jsx @@ -1,65 +1,42 @@ import { h } from 'preact'; import { articlePropTypes } from '../../common-prop-types'; +import { Button } from '../../crayons/Button'; import { locale } from '../../utilities/locale'; export const ReactionsCount = ({ article }) => { const totalReactions = article.public_reactions_count || 0; + const reactionsSVG = () => ( + + + + ); if (totalReactions === 0) { return; } - function buildIcons() { - const reversable = article.public_reaction_categories; - if (reversable === undefined) { - return; - } - reversable.reverse(); - - const icons = reversable.map((category) => { - const path = `/assets/${category.icon}.svg`; - const alt = category.name; - return ( - - {alt} - - ); - }); - - return ( - - {icons} - - ); - } - - function buildCounter() { - const reactionText = `${ - totalReactions == 1 - ? locale('core.reaction') - : `${locale('core.reaction')}s` - }`; - return ( - - - {totalReactions} {reactionText} - - - ); - } - return ( - -
- {buildIcons()} - {buildCounter()} -
-
+ + {totalReactions} + +   + {`${totalReactions == 1 ? locale('core.reaction') : `${locale('core.reaction')}s`}`} + + + ); }; diff --git a/app/javascript/articles/components/__tests__/ReactionsCount.test.jsx b/app/javascript/articles/components/__tests__/ReactionsCount.test.jsx index b872329fa..156fa36e5 100644 --- a/app/javascript/articles/components/__tests__/ReactionsCount.test.jsx +++ b/app/javascript/articles/components/__tests__/ReactionsCount.test.jsx @@ -23,16 +23,4 @@ describe(' component', () => { expect(findByText('232 reactions')).toBeDefined(); }); - - it('should display multiple reactions when there are reactions', async () => { - const { findByText } = render( - , - ); - - expect( - findByText( - 'Like', - ), - ).toBeDefined(); - }); }); diff --git a/app/models/concerns/reactable.rb b/app/models/concerns/reactable.rb index 2758aba28..6611d6857 100644 --- a/app/models/concerns/reactable.rb +++ b/app/models/concerns/reactable.rb @@ -3,24 +3,13 @@ module Reactable included do has_many :reactions, as: :reactable, inverse_of: :reactable, dependent: :destroy - has_many :distinct_reaction_categories, -> { order(:category).merge(Reaction.distinct_categories) }, - as: :reactable, - inverse_of: :reactable, - dependent: nil, - class_name: "Reaction" end def sync_reactions_count update_column(:public_reactions_count, reactions.public_category.size) end - def public_reaction_categories - @public_reaction_categories ||= begin - # .map is intentional below - .pluck would break eager-loaded association! - reacted = distinct_reaction_categories.map(&:category) - ReactionCategory.for_view.select do |reaction_type| - reacted.include?(reaction_type.slug.to_s) - end - end + def reaction_categories + reactions.distinct(:category).pluck(:category) end end diff --git a/app/models/reaction.rb b/app/models/reaction.rb index 533e9bd3d..a5c72e966 100644 --- a/app/models/reaction.rb +++ b/app/models/reaction.rb @@ -39,7 +39,6 @@ class Reaction < ApplicationRecord scope :unarchived, -> { where.not(status: "archived") } scope :from_user, ->(user) { where(user: user) } scope :readinglist_for_user, ->(user) { readinglist.unarchived.only_articles.from_user(user) } - scope :distinct_categories, -> { select("distinct(reactions.category) as category, reactable_id, reactable_type") } validates :category, inclusion: { in: ReactionCategory.all_slugs.map(&:to_s) } validates :reactable_type, inclusion: { in: REACTABLE_TYPES } diff --git a/app/models/reaction_category.rb b/app/models/reaction_category.rb index c54916e49..608d40f03 100644 --- a/app/models/reaction_category.rb +++ b/app/models/reaction_category.rb @@ -68,13 +68,4 @@ class ReactionCategory def visible_to_public? !privileged? && published? end - - def as_json(_options = nil) - { - slug: slug, - name: name, - icon: icon, - position: position - } - end end diff --git a/app/queries/homepage/articles_query.rb b/app/queries/homepage/articles_query.rb index 0e7ce6525..ae2fc2537 100644 --- a/app/queries/homepage/articles_query.rb +++ b/app/queries/homepage/articles_query.rb @@ -67,7 +67,6 @@ module Homepage @relation = @relation.where(user_id: user_id) if user_id.present? @relation = @relation.where(organization_id: organization_id) if organization_id.present? @relation = @relation.cached_tagged_with_any(tags) if tags.any? - @relation = @relation.includes(:distinct_reaction_categories) relation end diff --git a/app/serializers/homepage/article_serializer.rb b/app/serializers/homepage/article_serializer.rb index 072d8565a..5c9d27777 100644 --- a/app/serializers/homepage/article_serializer.rb +++ b/app/serializers/homepage/article_serializer.rb @@ -28,7 +28,6 @@ module Homepage :reading_time, :title, :user_id, - :public_reaction_categories, ) attribute :video_duration_string, &:video_duration_in_minutes diff --git a/app/services/articles/feeds/basic.rb b/app/services/articles/feeds/basic.rb index 8bf8ab153..8b457b37c 100644 --- a/app/services/articles/feeds/basic.rb +++ b/app/services/articles/feeds/basic.rb @@ -15,7 +15,6 @@ module Articles .with_at_least_home_feed_minimum_score .limit(@number_of_articles) .limited_column_select.includes(top_comments: :user) - .includes(:distinct_reaction_categories) return articles unless @user articles = articles.where.not(user_id: UserBlock.cached_blocked_ids_for_blocker(@user.id)) diff --git a/app/services/articles/feeds/large_forem_experimental.rb b/app/services/articles/feeds/large_forem_experimental.rb index e0fb97de3..566a038b5 100644 --- a/app/services/articles/feeds/large_forem_experimental.rb +++ b/app/services/articles/feeds/large_forem_experimental.rb @@ -103,7 +103,6 @@ module Articles def experimental_hot_story_grab start_time = Articles::Feeds.oldest_published_at_to_consider_for(user: @user) Article.published.limited_column_select.includes(top_comments: :user) - .includes(:distinct_reaction_categories) .where("published_at > ?", start_time) .page(@page).per(@number_of_articles) .order(score: :desc) diff --git a/app/services/articles/feeds/tag.rb b/app/services/articles/feeds/tag.rb index 49eb7abd0..8bdd6015b 100644 --- a/app/services/articles/feeds/tag.rb +++ b/app/services/articles/feeds/tag.rb @@ -17,7 +17,6 @@ module Articles .published .limited_column_select .includes(top_comments: :user) - .includes(:distinct_reaction_categories) .page(page) .per(number_of_articles) end diff --git a/app/services/articles/feeds/variant_query.rb b/app/services/articles/feeds/variant_query.rb index 6e2372e8a..47c172fd6 100644 --- a/app/services/articles/feeds/variant_query.rb +++ b/app/services/articles/feeds/variant_query.rb @@ -134,7 +134,6 @@ module Articles Article.joins(join_fragment) .limited_column_select .includes(top_comments: :user) - .includes(:distinct_reaction_categories) .order(config.order_by.to_sql) end diff --git a/app/views/articles/_single_story.html.erb b/app/views/articles/_single_story.html.erb index 743b89cbb..8c66f2a7d 100644 --- a/app/views/articles/_single_story.html.erb +++ b/app/views/articles/_single_story.html.erb @@ -120,21 +120,13 @@
<% if story.public_reactions_count > 0 %> - "> -
- - <% story.public_reaction_categories.reverse_each do |reaction_type| %> - - <%= image_tag "#{reaction_type.icon}.svg", size: "18x18" %> - - <% end %> - - <%= t("views.reactions.summary.count_html", - count: story.public_reactions_count, - start: tag("span", { class: %w[hidden s:inline] }, true), - end: "".html_safe) %> -
-
+ "> + <%= crayons_icon_tag("small-heart", title: t("views.reactions.summary.title")) %> + <%= t("views.reactions.summary.count_html", + count: story.public_reactions_count, + start: tag("span", { class: %w[hidden s:inline] }, true), + end: "".html_safe) %> + <% end %> <% if story.comments_count > 0 %> "> diff --git a/app/views/stories/feeds/show.json.jbuilder b/app/views/stories/feeds/show.json.jbuilder index f7ade201c..9ba1b6570 100644 --- a/app/views/stories/feeds/show.json.jbuilder +++ b/app/views/stories/feeds/show.json.jbuilder @@ -7,7 +7,6 @@ article_methods_to_include = %i[ readable_publish_date flare_tag class_name cloudinary_video_url video_duration_in_minutes published_at_int published_timestamp main_image_background_hex_color - public_reaction_categories ] json.array!(@stories) do |article| diff --git a/spec/models/article_spec.rb b/spec/models/article_spec.rb index ed732bd1b..46a694455 100644 --- a/spec/models/article_spec.rb +++ b/spec/models/article_spec.rb @@ -1342,7 +1342,7 @@ RSpec.describe Article do end end - describe "#public_reaction_categories reports unique associated reaction categories" do + describe "#reaction_categories reports unique associated reaction categories" do before do user2 = create(:user) user2.add_role(:trusted) @@ -1354,8 +1354,7 @@ RSpec.describe Article do end it "reports accurately" do - categories = article.public_reaction_categories - expect(categories.map(&:slug)).to contain_exactly(*%i[like]) + expect(article.reaction_categories).to contain_exactly("like", "readinglist", "vomit") end end end diff --git a/spec/services/homepage/fetch_articles_spec.rb b/spec/services/homepage/fetch_articles_spec.rb index 437d54b2a..aadff3e68 100644 --- a/spec/services/homepage/fetch_articles_spec.rb +++ b/spec/services/homepage/fetch_articles_spec.rb @@ -12,12 +12,11 @@ RSpec.describe Homepage::FetchArticles, type: :service do result = described_class.call.first keys = %i[ - class_name cloudinary_video_url comments_count flare_tag id path - public_reactions_count public_reaction_categories + class_name cloudinary_video_url comments_count flare_tag id path public_reactions_count published_at_int readable_publish_date reading_time tag_list title user user_id video_duration_string ] - expect(result.keys.sort).to contain_exactly(*keys) + expect(result.keys.sort).to eq(keys) expect(result[:class_name]).to eq("Article") expect(result[:cloudinary_video_url]).to eq(article.cloudinary_video_url)