From c3d4a644cfc92fd251566b50889f58078dee1e54 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Thu, 24 Nov 2022 11:50:32 +0000
Subject: [PATCH 01/47] add backend support for status emoji reactions

turns out we can just reuse the code for
announcement reactions.
---
 .../api/v1/statuses/reactions_controller.rb   | 29 +++++++++++++++++++
 app/models/status.rb                          | 16 ++++++++++
 app/models/status_reaction.rb                 | 29 +++++++++++++++++++
 app/serializers/rest/status_serializer.rb     |  5 ++++
 app/validators/status_reaction_validator.rb   | 28 ++++++++++++++++++
 config/routes.rb                              |  1 +
 .../20221124114030_create_status_reactions.rb | 14 +++++++++
 .../fabricators/status_reaction_fabricator.rb |  6 ++++
 spec/models/status_reaction_spec.rb           |  5 ++++
 9 files changed, 133 insertions(+)
 create mode 100644 app/controllers/api/v1/statuses/reactions_controller.rb
 create mode 100644 app/models/status_reaction.rb
 create mode 100644 app/validators/status_reaction_validator.rb
 create mode 100644 db/migrate/20221124114030_create_status_reactions.rb
 create mode 100644 spec/fabricators/status_reaction_fabricator.rb
 create mode 100644 spec/models/status_reaction_spec.rb

diff --git a/app/controllers/api/v1/statuses/reactions_controller.rb b/app/controllers/api/v1/statuses/reactions_controller.rb
new file mode 100644
index 000000000..9a1bf5707
--- /dev/null
+++ b/app/controllers/api/v1/statuses/reactions_controller.rb
@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+class Api::V1::Statuses::ReactionsController < Api::BaseController
+  before_action -> { doorkeeper_authorize! :write, :'write:favourites' }
+  before_action :require_user!
+
+  before_action :set_status
+  before_action :set_reaction, except: :update
+
+  def update
+    @status.status_reactions.create!(account: current_account, name: params[:id])
+    render_empty
+  end
+
+  def destroy
+    @reaction.destroy!
+    render_empty
+  end
+
+  private
+
+  def set_reaction
+    @reaction = @status.status_reactions.where(account: current_account).find_by!(name: params[:id])
+  end
+
+  def set_status
+    @status = Status.find(params[:status_id])
+  end
+end
diff --git a/app/models/status.rb b/app/models/status.rb
index 6cfe19d23..64f95f3d0 100644
--- a/app/models/status.rb
+++ b/app/models/status.rb
@@ -71,6 +71,7 @@ class Status < ApplicationRecord
   has_many :mentioned_accounts, through: :mentions, source: :account, class_name: 'Account'
   has_many :active_mentions, -> { active }, class_name: 'Mention', inverse_of: :status
   has_many :media_attachments, dependent: :nullify
+  has_many :status_reactions, dependent: :destroy
 
   has_and_belongs_to_many :tags
   has_and_belongs_to_many :preview_cards
@@ -263,6 +264,21 @@ class Status < ApplicationRecord
     @emojis = CustomEmoji.from_text(fields.join(' '), account.domain)
   end
 
+  def reactions(account = nil)
+    records = begin
+      scope = status_reactions.group(:status_id, :name, :custom_emoji_id).order(Arel.sql('MIN(created_at) ASC'))
+
+      if account.nil?
+        scope.select('name, custom_emoji_id, count(*) as count, false as me')
+      else
+        scope.select("name, custom_emoji_id, count(*) as count, exists(select 1 from status_reactions r where r.account_id = #{account.id} and r.status_id = status_reactions.status_id and r.name = status_reactions.name) as me")
+      end
+    end
+
+    ActiveRecord::Associations::Preloader.new.preload(records, :custom_emoji)
+    records
+  end
+
   def ordered_media_attachments
     if ordered_media_attachment_ids.nil?
       media_attachments
diff --git a/app/models/status_reaction.rb b/app/models/status_reaction.rb
new file mode 100644
index 000000000..32cb9edd4
--- /dev/null
+++ b/app/models/status_reaction.rb
@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+# == Schema Information
+#
+# Table name: status_reactions
+#
+#  id              :bigint(8)        not null, primary key
+#  account_id      :bigint(8)        not null
+#  status_id       :bigint(8)        not null
+#  name            :string           default(""), not null
+#  custom_emoji_id :bigint(8)
+#  created_at      :datetime         not null
+#  updated_at      :datetime         not null
+#
+class StatusReaction < ApplicationRecord
+  belongs_to :account
+  belongs_to :status, inverse_of: :status_reactions
+  belongs_to :custom_emoji, optional: true
+
+  validates :name, presence: true
+  validates_with StatusReactionValidator
+
+  before_validation :set_custom_emoji
+
+  private
+
+  def set_custom_emoji
+    self.custom_emoji = CustomEmoji.local.find_by(disabled: false, shortcode: name) if name.present?
+  end
+end
diff --git a/app/serializers/rest/status_serializer.rb b/app/serializers/rest/status_serializer.rb
index 659c45b83..43c1e86af 100644
--- a/app/serializers/rest/status_serializer.rb
+++ b/app/serializers/rest/status_serializer.rb
@@ -28,6 +28,7 @@ class REST::StatusSerializer < ActiveModel::Serializer
   has_many :ordered_mentions, key: :mentions
   has_many :tags
   has_many :emojis, serializer: REST::CustomEmojiSerializer
+  has_many :reactions, serializer: REST::ReactionSerializer
 
   has_one :preview_card, key: :card, serializer: REST::PreviewCardSerializer
   has_one :preloadable_poll, key: :poll, serializer: REST::PollSerializer
@@ -146,6 +147,10 @@ class REST::StatusSerializer < ActiveModel::Serializer
     object.active_mentions.to_a.sort_by(&:id)
   end
 
+  def reactions
+    object.reactions(current_user&.account)
+  end
+
   class ApplicationSerializer < ActiveModel::Serializer
     attributes :name, :website
 
diff --git a/app/validators/status_reaction_validator.rb b/app/validators/status_reaction_validator.rb
new file mode 100644
index 000000000..7c1c6983b
--- /dev/null
+++ b/app/validators/status_reaction_validator.rb
@@ -0,0 +1,28 @@
+# frozen_string_literal: true
+
+class StatusReactionValidator < ActiveModel::Validator
+  SUPPORTED_EMOJIS = Oj.load_file(Rails.root.join('app', 'javascript', 'mastodon', 'features', 'emoji', 'emoji_map.json').to_s).keys.freeze
+
+  LIMIT = 8
+
+  def validate(reaction)
+    return if reaction.name.blank?
+
+    reaction.errors.add(:name, I18n.t('reactions.errors.unrecognized_emoji')) if reaction.custom_emoji_id.blank? && !unicode_emoji?(reaction.name)
+    reaction.errors.add(:base, I18n.t('reactions.errors.limit_reached')) if new_reaction?(reaction) && limit_reached?(reaction)
+  end
+
+  private
+
+  def unicode_emoji?(name)
+    SUPPORTED_EMOJIS.include?(name)
+  end
+
+  def new_reaction?(reaction)
+    !reaction.status.status_reactions.where(name: reaction.name).exists?
+  end
+
+  def limit_reached?(reaction)
+    reaction.status.status_reactions.where.not(name: reaction.name).count('distinct name') >= LIMIT
+  end
+end
diff --git a/config/routes.rb b/config/routes.rb
index 8639f0ef5..da4ddfa20 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -453,6 +453,7 @@ Rails.application.routes.draw do
 
           resource :history, only: :show
           resource :source, only: :show
+          resources :reactions, only: [:update, :destroy]
 
           post :translate, to: 'translations#create'
         end
diff --git a/db/migrate/20221124114030_create_status_reactions.rb b/db/migrate/20221124114030_create_status_reactions.rb
new file mode 100644
index 000000000..bbf1f3376
--- /dev/null
+++ b/db/migrate/20221124114030_create_status_reactions.rb
@@ -0,0 +1,14 @@
+class CreateStatusReactions < ActiveRecord::Migration[6.1]
+  def change
+    create_table :status_reactions do |t|
+      t.references :account, null: false, foreign_key: true
+      t.references :status, null: false, foreign_key: true
+      t.string :name, null: false, default: ''
+      t.references :custom_emoji, null: true, foreign_key: true
+
+      t.timestamps
+    end
+
+    add_index :status_reactions, [:account_id, :status_id, :name], unique: true, name: :index_status_reactions_on_account_id_and_status_id
+  end
+end
diff --git a/spec/fabricators/status_reaction_fabricator.rb b/spec/fabricators/status_reaction_fabricator.rb
new file mode 100644
index 000000000..3d4b93efe
--- /dev/null
+++ b/spec/fabricators/status_reaction_fabricator.rb
@@ -0,0 +1,6 @@
+Fabricator(:status_reaction) do
+  account      nil
+  status       nil
+  name         "MyString"
+  custom_emoji nil
+end
\ No newline at end of file
diff --git a/spec/models/status_reaction_spec.rb b/spec/models/status_reaction_spec.rb
new file mode 100644
index 000000000..18860318c
--- /dev/null
+++ b/spec/models/status_reaction_spec.rb
@@ -0,0 +1,5 @@
+require 'rails_helper'
+
+RSpec.describe StatusReaction, type: :model do
+  pending "add some examples to (or delete) #{__FILE__}"
+end

From a5c6f4f4b08c70940fe7fc5a6a6d9b32189730c2 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Thu, 24 Nov 2022 17:30:52 +0000
Subject: [PATCH 02/47] add frontend for emoji reactions

this is still pretty bare bones but hey, it works.
---
 .../flavours/glitch/actions/interactions.js   |  85 +++++++++
 .../flavours/glitch/components/status.js      |  12 ++
 .../glitch/components/status_reactions_bar.js | 177 ++++++++++++++++++
 .../glitch/containers/status_container.js     |  16 +-
 .../flavours/glitch/reducers/statuses.js      |  44 +++++
 5 files changed, 333 insertions(+), 1 deletion(-)
 create mode 100644 app/javascript/flavours/glitch/components/status_reactions_bar.js

diff --git a/app/javascript/flavours/glitch/actions/interactions.js b/app/javascript/flavours/glitch/actions/interactions.js
index 225ee7eb2..ab275621c 100644
--- a/app/javascript/flavours/glitch/actions/interactions.js
+++ b/app/javascript/flavours/glitch/actions/interactions.js
@@ -41,6 +41,16 @@ export const UNBOOKMARK_REQUEST = 'UNBOOKMARKED_REQUEST';
 export const UNBOOKMARK_SUCCESS = 'UNBOOKMARKED_SUCCESS';
 export const UNBOOKMARK_FAIL    = 'UNBOOKMARKED_FAIL';
 
+export const STATUS_REACTION_UPDATE = 'STATUS_REACTION_UPDATE';
+
+export const STATUS_REACTION_ADD_REQUEST = 'STATUS_REACTION_ADD_REQUEST';
+export const STATUS_REACTION_ADD_SUCCESS = 'STATUS_REACTION_ADD_SUCCESS';
+export const STATUS_REACTION_ADD_FAIL    = 'STATUS_REACTION_ADD_FAIL';
+
+export const STATUS_REACTION_REMOVE_REQUEST = 'STATUS_REACTION_REMOVE_REQUEST';
+export const STATUS_REACTION_REMOVE_SUCCESS = 'STATUS_REACTION_REMOVE_SUCCESS';
+export const STATUS_REACTION_REMOVE_FAIL    = 'STATUS_REACTION_REMOVE_FAIL';
+
 export function reblog(status, visibility) {
   return function (dispatch, getState) {
     dispatch(reblogRequest(status));
@@ -392,3 +402,78 @@ export function unpinFail(status, error) {
     error,
   };
 };
+
+export const statusAddReaction = (statusId, name) => (dispatch, getState) => {
+  const status = getState().get('statuses').get(statusId);
+  let alreadyAdded = false;
+  if (status) {
+    const reaction = status.get('reactions').find(x => x.get('name') === name);
+    if (reaction && reaction.get('me')) {
+      alreadyAdded = true;
+    }
+  }
+  if (!alreadyAdded) {
+    dispatch(statusAddReactionRequest(statusId, name, alreadyAdded));
+  }
+
+  api(getState).put(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
+    dispatch(statusAddReactionSuccess(statusId, name, alreadyAdded));
+  }).catch(err => {
+    if (!alreadyAdded) {
+      dispatch(statusAddReactionFail(statusId, name, err));
+    }
+  });
+};
+
+export const statusAddReactionRequest = (statusId, name) => ({
+  type: STATUS_REACTION_ADD_REQUEST,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
+
+export const statusAddReactionSuccess = (statusId, name) => ({
+  type: STATUS_REACTION_ADD_SUCCESS,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
+
+export const statusAddReactionFail = (statusId, name, error) => ({
+  type: STATUS_REACTION_ADD_FAIL,
+  id: statusId,
+  name,
+  error,
+  skipLoading: true,
+});
+
+export const statusRemoveReaction = (statusId, name) => (dispatch, getState) => {
+  dispatch(statusRemoveReactionRequest(statusId, name));
+
+  api(getState).delete(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
+    dispatch(statusRemoveReactionSuccess(statusId, name));
+  }).catch(err => {
+    dispatch(statusRemoveReactionFail(statusId, name, err));
+  });
+};
+
+export const statusRemoveReactionRequest = (statusId, name) => ({
+  type: STATUS_REACTION_REMOVE_REQUEST,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
+
+export const statusRemoveReactionSuccess = (statusId, name) => ({
+  type: STATUS_REACTION_REMOVE_SUCCESS,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
+
+export const statusRemoveReactionFail = (statusId, name) => ({
+  type: STATUS_REACTION_REMOVE_FAIL,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js
index 4041b4819..31b234ef3 100644
--- a/app/javascript/flavours/glitch/components/status.js
+++ b/app/javascript/flavours/glitch/components/status.js
@@ -6,6 +6,7 @@ import StatusHeader from './status_header';
 import StatusIcons from './status_icons';
 import StatusContent from './status_content';
 import StatusActionBar from './status_action_bar';
+import StatusReactionsBar from './status_reactions_bar';
 import AttachmentList from './attachment_list';
 import Card from '../features/status/components/card';
 import { injectIntl, FormattedMessage } from 'react-intl';
@@ -75,6 +76,8 @@ class Status extends ImmutablePureComponent {
     onDelete: PropTypes.func,
     onDirect: PropTypes.func,
     onMention: PropTypes.func,
+    onReactionAdd: PropTypes.func,
+    onReactionRemove: PropTypes.func,
     onPin: PropTypes.func,
     onOpenMedia: PropTypes.func,
     onOpenVideo: PropTypes.func,
@@ -102,6 +105,7 @@ class Status extends ImmutablePureComponent {
     scrollKey: PropTypes.string,
     deployPictureInPicture: PropTypes.func,
     settings: ImmutablePropTypes.map.isRequired,
+    emojiMap: ImmutablePropTypes.map.isRequired,
     pictureInPicture: PropTypes.shape({
       inUse: PropTypes.bool,
       available: PropTypes.bool,
@@ -800,6 +804,14 @@ class Status extends ImmutablePureComponent {
             rewriteMentions={settings.get('rewrite_mentions')}
           />
 
+          <StatusReactionsBar
+            statusId={status.get('id')}
+            reactions={status.get('reactions')}
+            addReaction={this.props.onReactionAdd}
+            removeReaction={this.props.onReactionRemove}
+            emojiMap={this.props.emojiMap}
+          />
+
           {!isCollapsed || !(muted || !settings.getIn(['collapsed', 'show_action_bar'])) ? (
             <StatusActionBar
               status={status}
diff --git a/app/javascript/flavours/glitch/components/status_reactions_bar.js b/app/javascript/flavours/glitch/components/status_reactions_bar.js
new file mode 100644
index 000000000..db1905be4
--- /dev/null
+++ b/app/javascript/flavours/glitch/components/status_reactions_bar.js
@@ -0,0 +1,177 @@
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import PropTypes from 'prop-types';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import { reduceMotion } from '../initial_state';
+import spring from 'react-motion/lib/spring';
+import TransitionMotion from 'react-motion/lib/TransitionMotion';
+import classNames from 'classnames';
+import EmojiPickerDropdown from '../features/compose/containers/emoji_picker_dropdown_container';
+import Icon from './icon';
+import React from 'react';
+import unicodeMapping from '../features/emoji/emoji_unicode_mapping_light';
+import AnimatedNumber from './animated_number';
+import { assetHost } from '../utils/config';
+import { autoPlayGif } from '../initial_state';
+
+export default class StatusReactionsBar extends ImmutablePureComponent {
+
+  static propTypes = {
+    statusId: PropTypes.string.isRequired,
+    reactions: ImmutablePropTypes.list.isRequired,
+    addReaction: PropTypes.func.isRequired,
+    removeReaction: PropTypes.func.isRequired,
+    emojiMap: ImmutablePropTypes.map.isRequired,
+  };
+
+  handleEmojiPick = data => {
+    const { addReaction, statusId } = this.props;
+    addReaction(statusId, data.native.replace(/:/g, ''));
+  }
+
+  willEnter() {
+    return { scale: reduceMotion ? 1 : 0 };
+  }
+
+  willLeave() {
+    return { scale: reduceMotion ? 0 : spring(0, { stiffness: 170, damping: 26 }) };
+  }
+
+  render() {
+    const { reactions } = this.props;
+    const visibleReactions = reactions.filter(x => x.get('count') > 0);
+
+    const styles = visibleReactions.map(reaction => ({
+      key: reaction.get('name'),
+      data: reaction,
+      style: { scale: reduceMotion ? 1 : spring(1, { stiffness: 150, damping: 13 }) },
+    })).toArray();
+
+    return (
+      <TransitionMotion styles={styles} willEnter={this.willEnter} willLeave={this.willLeave}>
+        {items => (
+          <div className={classNames('reactions-bar', { 'reactions-bar--empty': visibleReactions.isEmpty() })}>
+            {items.map(({ key, data, style }) => (
+              <Reaction
+                key={key}
+                statusId={this.props.statusId}
+                reaction={data}
+                style={{ transform: `scale(${style.scale})`, position: style.scale < 0.5 ? 'absolute' : 'static' }}
+                addReaction={this.props.addReaction}
+                removeReaction={this.props.removeReaction}
+                emojiMap={this.props.emojiMap}
+              />
+            ))}
+
+            {visibleReactions.size < 8 && <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={<Icon id='plus' />} />}
+          </div>
+        )}
+      </TransitionMotion>
+    );
+  }
+
+}
+
+class Reaction extends ImmutablePureComponent {
+
+  static propTypes = {
+    statusId: PropTypes.string,
+    reaction: ImmutablePropTypes.map.isRequired,
+    addReaction: PropTypes.func.isRequired,
+    removeReaction: PropTypes.func.isRequired,
+    emojiMap: ImmutablePropTypes.map.isRequired,
+    style: PropTypes.object,
+  };
+
+  state = {
+    hovered: false,
+  };
+
+  handleClick = () => {
+    const { reaction, statusId, addReaction, removeReaction } = this.props;
+
+    if (reaction.get('me')) {
+      removeReaction(statusId, reaction.get('name'));
+    } else {
+      addReaction(statusId, reaction.get('name'));
+    }
+  }
+
+  handleMouseEnter = () => this.setState({ hovered: true })
+
+  handleMouseLeave = () => this.setState({ hovered: false })
+
+  render() {
+    const { reaction } = this.props;
+
+    let shortCode = reaction.get('name');
+
+    if (unicodeMapping[shortCode]) {
+      shortCode = unicodeMapping[shortCode].shortCode;
+    }
+
+    return (
+      <button
+        className={classNames('reactions-bar__item', { active: reaction.get('me') })}
+        onClick={this.handleClick}
+        onMouseEnter={this.handleMouseEnter}
+        onMouseLeave={this.handleMouseLeave}
+        title={`:${shortCode}:`}
+        style={this.props.style}
+      >
+        <span className='reactions-bar__item__emoji'>
+          <Emoji hovered={this.state.hovered} emoji={reaction.get('name')} emojiMap={this.props.emojiMap} />
+        </span>
+        <span className='reactions-bar__item__count'>
+          <AnimatedNumber value={reaction.get('count')} />
+        </span>
+      </button>
+    );
+  }
+
+}
+
+class Emoji extends React.PureComponent {
+
+  static propTypes = {
+    emoji: PropTypes.string.isRequired,
+    emojiMap: ImmutablePropTypes.map.isRequired,
+    hovered: PropTypes.bool.isRequired,
+  };
+
+  render() {
+    const { emoji, emojiMap, hovered } = this.props;
+
+    if (unicodeMapping[emoji]) {
+      const { filename, shortCode } = unicodeMapping[this.props.emoji];
+      const title = shortCode ? `:${shortCode}:` : '';
+
+      return (
+        <img
+          draggable='false'
+          className='emojione'
+          alt={emoji}
+          title={title}
+          src={`${assetHost}/emoji/${filename}.svg`}
+        />
+      );
+    } else if (emojiMap.get(emoji)) {
+      const filename = (autoPlayGif || hovered)
+        ? emojiMap.getIn([emoji, 'url'])
+        : emojiMap.getIn([emoji, 'static_url']);
+      const shortCode = `:${emoji}:`;
+
+      return (
+        <img
+          draggable='false'
+          className='emojione custom-emoji'
+          alt={shortCode}
+          title={shortCode}
+          src={filename}
+        />
+      );
+    } else {
+      return null;
+    }
+  }
+
+}
diff --git a/app/javascript/flavours/glitch/containers/status_container.js b/app/javascript/flavours/glitch/containers/status_container.js
index 947573fc7..40a574437 100644
--- a/app/javascript/flavours/glitch/containers/status_container.js
+++ b/app/javascript/flavours/glitch/containers/status_container.js
@@ -1,6 +1,5 @@
 import { connect } from 'react-redux';
 import Status from 'flavours/glitch/components/status';
-import { List as ImmutableList } from 'immutable';
 import { makeGetStatus } from 'flavours/glitch/selectors';
 import {
   replyCompose,
@@ -16,6 +15,8 @@ import {
   unbookmark,
   pin,
   unpin,
+  statusAddReaction,
+  statusRemoveReaction,
 } from 'flavours/glitch/actions/interactions';
 import {
   muteStatus,
@@ -44,6 +45,10 @@ import { showAlertForError } from '../actions/alerts';
 import AccountContainer from 'flavours/glitch/containers/account_container';
 import Spoilers from '../components/spoilers';
 import Icon from 'flavours/glitch/components/icon';
+import { createSelector } from 'reselect';
+import { Map as ImmutableMap } from 'immutable';
+
+const customEmojiMap = createSelector([state => state.get('custom_emojis')], items => items.reduce((map, emoji) => map.set(emoji.get('shortcode'), emoji), ImmutableMap()));
 
 const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@@ -83,6 +88,7 @@ const makeMapStateToProps = () => {
       account: account || props.account,
       settings: state.get('local_settings'),
       prepend: prepend || props.prepend,
+      emojiMap: customEmojiMap(state),
 
       pictureInPicture: {
         inUse: state.getIn(['meta', 'layout']) !== 'mobile' && state.get('picture_in_picture').statusId === props.id,
@@ -166,6 +172,14 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
     }
   },
 
+  onReactionAdd (statusId, name) {
+    dispatch(statusAddReaction(statusId, name));
+  },
+
+  onReactionRemove (statusId, name) {
+    dispatch(statusRemoveReaction(statusId, name));
+  },
+
   onEmbed (status) {
     dispatch(openModal('EMBED', {
       url: status.get('url'),
diff --git a/app/javascript/flavours/glitch/reducers/statuses.js b/app/javascript/flavours/glitch/reducers/statuses.js
index f0c4c804b..605238bc2 100644
--- a/app/javascript/flavours/glitch/reducers/statuses.js
+++ b/app/javascript/flavours/glitch/reducers/statuses.js
@@ -6,6 +6,11 @@ import {
   UNFAVOURITE_SUCCESS,
   BOOKMARK_REQUEST,
   BOOKMARK_FAIL,
+  STATUS_REACTION_UPDATE,
+  STATUS_REACTION_ADD_FAIL,
+  STATUS_REACTION_REMOVE_FAIL,
+  STATUS_REACTION_ADD_REQUEST,
+  STATUS_REACTION_REMOVE_REQUEST,
 } from 'flavours/glitch/actions/interactions';
 import {
   STATUS_MUTE_SUCCESS,
@@ -37,6 +42,37 @@ const deleteStatus = (state, id, references) => {
   return state.delete(id);
 };
 
+const updateReaction = (state, id, name, updater) => state.update(
+  id,
+  status => status.update(
+    'reactions',
+    reactions => {
+      const index = reactions.findIndex(reaction => reaction.get('name') === name);
+      if (index > -1) {
+        return reactions.update(index, reaction => updater(reaction));
+      } else {
+        return reactions.push(updater(fromJS({ name, count: 0 })));
+      }
+    },
+  ),
+);
+
+const updateReactionCount = (state, reaction) => updateReaction(state, reaction.status_id, reaction.name, x => x.set('count', reaction.count));
+
+const addReaction = (state, id, name) => updateReaction(
+  state,
+  id,
+  name,
+  x => x.set('me', true).update('count', n => n + 1),
+);
+
+const removeReaction = (state, id, name) => updateReaction(
+  state,
+  id,
+  name,
+  x => x.set('me', false).update('count', n => n - 1),
+);
+
 const initialState = ImmutableMap();
 
 export default function statuses(state = initialState, action) {
@@ -63,6 +99,14 @@ export default function statuses(state = initialState, action) {
     return state.setIn([action.status.get('id'), 'reblogged'], true);
   case REBLOG_FAIL:
     return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'reblogged'], false);
+  case STATUS_REACTION_UPDATE:
+    return updateReactionCount(state, action.reaction);
+  case STATUS_REACTION_ADD_REQUEST:
+  case STATUS_REACTION_REMOVE_FAIL:
+    return addReaction(state, action.id, action.name);
+  case STATUS_REACTION_REMOVE_REQUEST:
+  case STATUS_REACTION_ADD_FAIL:
+    return removeReaction(state, action.id, action.name);
   case STATUS_MUTE_SUCCESS:
     return state.setIn([action.id, 'muted'], true);
   case STATUS_UNMUTE_SUCCESS:

From 91fcd87069d644090d521bf12ffd3174c2f71ff0 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Fri, 25 Nov 2022 23:02:40 +0000
Subject: [PATCH 03/47] show reactions in detailed status view

---
 .../glitch/containers/status_container.js     |  7 ++---
 .../status/components/detailed_status.js      | 12 +++++++
 .../flavours/glitch/features/status/index.js  | 31 +++++++++++++++++++
 .../flavours/glitch/utils/emoji_map.js        | 11 +++++++
 4 files changed, 56 insertions(+), 5 deletions(-)
 create mode 100644 app/javascript/flavours/glitch/utils/emoji_map.js

diff --git a/app/javascript/flavours/glitch/containers/status_container.js b/app/javascript/flavours/glitch/containers/status_container.js
index 40a574437..381276d9d 100644
--- a/app/javascript/flavours/glitch/containers/status_container.js
+++ b/app/javascript/flavours/glitch/containers/status_container.js
@@ -45,10 +45,7 @@ import { showAlertForError } from '../actions/alerts';
 import AccountContainer from 'flavours/glitch/containers/account_container';
 import Spoilers from '../components/spoilers';
 import Icon from 'flavours/glitch/components/icon';
-import { createSelector } from 'reselect';
-import { Map as ImmutableMap } from 'immutable';
-
-const customEmojiMap = createSelector([state => state.get('custom_emojis')], items => items.reduce((map, emoji) => map.set(emoji.get('shortcode'), emoji), ImmutableMap()));
+import buildCustomEmojiMap from '../utils/emoji_map';
 
 const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@@ -88,7 +85,7 @@ const makeMapStateToProps = () => {
       account: account || props.account,
       settings: state.get('local_settings'),
       prepend: prepend || props.prepend,
-      emojiMap: customEmojiMap(state),
+      emojiMap: buildCustomEmojiMap(state),
 
       pictureInPicture: {
         inUse: state.getIn(['meta', 'layout']) !== 'mobile' && state.get('picture_in_picture').statusId === props.id,
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.js b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
index 7d2c2aace..b2f38ff1f 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.js
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
@@ -20,6 +20,7 @@ import Icon from 'flavours/glitch/components/icon';
 import AnimatedNumber from 'flavours/glitch/components/animated_number';
 import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder';
 import EditedTimestamp from 'flavours/glitch/components/edited_timestamp';
+import StatusReactionsBar from '../../../components/status_reactions_bar';
 
 export default @injectIntl
 class DetailedStatus extends ImmutablePureComponent {
@@ -43,6 +44,9 @@ class DetailedStatus extends ImmutablePureComponent {
     showMedia: PropTypes.bool,
     usingPiP: PropTypes.bool,
     onToggleMediaVisibility: PropTypes.func,
+    onReactionAdd: PropTypes.func.isRequired,
+    onReactionRemove: PropTypes.func.isRequired,
+    emojiMap: ImmutablePropTypes.map.isRequired,
     intl: PropTypes.object.isRequired,
   };
 
@@ -319,6 +323,14 @@ class DetailedStatus extends ImmutablePureComponent {
             disabled
           />
 
+          <StatusReactionsBar
+            statusId={status.get('id')}
+            reactions={status.get('reactions')}
+            addReaction={this.props.onReactionAdd}
+            removeReaction={this.props.onReactionRemove}
+            emojiMap={this.props.emojiMap}
+          />
+
           <div className='detailed-status__meta'>
             <a className='detailed-status__datetime' href={status.get('url')} target='_blank' rel='noopener noreferrer'>
               <FormattedDate value={new Date(status.get('created_at'))} hour12={false} year='numeric' month='short' day='2-digit' hour='2-digit' minute='2-digit' />
diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js
index e190652b0..730af52f0 100644
--- a/app/javascript/flavours/glitch/features/status/index.js
+++ b/app/javascript/flavours/glitch/features/status/index.js
@@ -20,6 +20,8 @@ import {
   unreblog,
   pin,
   unpin,
+  statusAddReaction,
+  statusRemoveReaction,
 } from 'flavours/glitch/actions/interactions';
 import {
   replyCompose,
@@ -56,6 +58,7 @@ import { autoUnfoldCW } from 'flavours/glitch/utils/content_warning';
 import { textForScreenReader, defaultMediaVisibility } from 'flavours/glitch/components/status';
 import Icon from 'flavours/glitch/components/icon';
 import { Helmet } from 'react-helmet';
+import buildCustomEmojiMap from '../../utils/emoji_map';
 
 const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@@ -146,6 +149,7 @@ const makeMapStateToProps = () => {
       askReplyConfirmation: state.getIn(['local_settings', 'confirm_before_clearing_draft']) && state.getIn(['compose', 'text']).trim().length !== 0,
       domain: state.getIn(['meta', 'domain']),
       usingPiP: state.get('picture_in_picture').statusId === props.params.statusId,
+      emojiMap: buildCustomEmojiMap(state),
     };
   };
 
@@ -291,6 +295,30 @@ class Status extends ImmutablePureComponent {
     }
   }
 
+  handleReactionAdd = (statusId, name) => {
+    const { dispatch } = this.props;
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      dispatch(statusAddReaction(statusId, name));
+    } else {
+      dispatch(openModal('INTERACTION', {
+        type: 'reaction_add',
+        accountId: status.getIn(['account', 'id']),
+        url: status.get('url'),
+      }));
+    }
+  }
+
+  handleReactionRemove = (statusId, name) => {
+    const { dispatch } = this.props;
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      dispatch(statusRemoveReaction(statusId, name));
+    }
+  }
+
   handlePin = (status) => {
     if (status.get('pinned')) {
       this.props.dispatch(unpin(status));
@@ -676,6 +704,8 @@ class Status extends ImmutablePureComponent {
                   settings={settings}
                   onOpenVideo={this.handleOpenVideo}
                   onOpenMedia={this.handleOpenMedia}
+                  onReactionAdd={this.handleReactionAdd}
+                  onReactionRemove={this.handleReactionRemove}
                   expanded={isExpanded}
                   onToggleHidden={this.handleToggleHidden}
                   onTranslate={this.handleTranslate}
@@ -683,6 +713,7 @@ class Status extends ImmutablePureComponent {
                   showMedia={this.state.showMedia}
                   onToggleMediaVisibility={this.handleToggleMediaVisibility}
                   usingPiP={usingPiP}
+                  emojiMap={this.props.emojiMap}
                 />
 
                 <ActionBar
diff --git a/app/javascript/flavours/glitch/utils/emoji_map.js b/app/javascript/flavours/glitch/utils/emoji_map.js
new file mode 100644
index 000000000..1bf36d0fd
--- /dev/null
+++ b/app/javascript/flavours/glitch/utils/emoji_map.js
@@ -0,0 +1,11 @@
+import { createSelector } from 'reselect';
+import { Map as ImmutableMap } from 'immutable';
+
+const buildCustomEmojiMap = createSelector(
+  [state => state.get('custom_emojis')],
+  items => items.reduce(
+    (map, emoji) => map.set(emoji.get('shortcode'), emoji),
+    ImmutableMap(),
+  ),
+);
+export default buildCustomEmojiMap;

From 5b30421f3b6171041e432d854c34a6ab7ae012ad Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Mon, 28 Nov 2022 22:23:13 +0000
Subject: [PATCH 04/47] federate emoji reactions

this is kind of experimental, but it should work
in theory.  at least i tested it with a remove
akkoma instance and it didn't crash.
---
 .../api/v1/statuses/reactions_controller.rb   |  4 +--
 app/lib/activitypub/activity.rb               |  2 ++
 app/lib/activitypub/activity/emoji_react.rb   | 14 ++++++++
 app/models/concerns/account_interactions.rb   |  4 +++
 app/models/status.rb                          |  2 +-
 .../activitypub/emoji_reaction_serializer.rb  | 36 +++++++++++++++++++
 .../undo_emoji_reaction_serializer.rb         | 19 ++++++++++
 .../undo_emoji_reaction_serializer.rb         |  0
 app/services/status_reaction_service.rb       | 27 ++++++++++++++
 app/services/status_unreaction_service.rb     | 21 +++++++++++
 10 files changed, 126 insertions(+), 3 deletions(-)
 create mode 100644 app/lib/activitypub/activity/emoji_react.rb
 create mode 100644 app/serializers/activitypub/emoji_reaction_serializer.rb
 create mode 100644 app/serializers/activitypub/undo_emoji_reaction_serializer.rb
 create mode 100644 app/serializers/undo_emoji_reaction_serializer.rb
 create mode 100644 app/services/status_reaction_service.rb
 create mode 100644 app/services/status_unreaction_service.rb

diff --git a/app/controllers/api/v1/statuses/reactions_controller.rb b/app/controllers/api/v1/statuses/reactions_controller.rb
index 9a1bf5707..f7dc2f99c 100644
--- a/app/controllers/api/v1/statuses/reactions_controller.rb
+++ b/app/controllers/api/v1/statuses/reactions_controller.rb
@@ -8,12 +8,12 @@ class Api::V1::Statuses::ReactionsController < Api::BaseController
   before_action :set_reaction, except: :update
 
   def update
-    @status.status_reactions.create!(account: current_account, name: params[:id])
+    StatusReactionService.new.call(current_account, @status, params[:id])
     render_empty
   end
 
   def destroy
-    @reaction.destroy!
+    StatusUnreactionService.new.call(current_account, @status)
     render_empty
   end
 
diff --git a/app/lib/activitypub/activity.rb b/app/lib/activitypub/activity.rb
index f4c67cccd..a6b91f62d 100644
--- a/app/lib/activitypub/activity.rb
+++ b/app/lib/activitypub/activity.rb
@@ -39,6 +39,8 @@ class ActivityPub::Activity
         ActivityPub::Activity::Follow
       when 'Like'
         ActivityPub::Activity::Like
+      when 'EmojiReact'
+        ActivityPub::Activity::EmojiReact
       when 'Block'
         ActivityPub::Activity::Block
       when 'Update'
diff --git a/app/lib/activitypub/activity/emoji_react.rb b/app/lib/activitypub/activity/emoji_react.rb
new file mode 100644
index 000000000..82c098f56
--- /dev/null
+++ b/app/lib/activitypub/activity/emoji_react.rb
@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+class ActivityPub::Activity::EmojiReact < ActivityPub::Activity
+  def perform
+    original_status = status_from_uri(object_uri)
+    name = @json['content']
+    return if original_status.nil? ||
+      !original_status.account.local? ||
+      delete_arrived_first?(@json['id']) ||
+      @account.reacted?(original_status, name)
+
+    original_status.status_reactions.create!(account: @account, name: name)
+  end
+end
diff --git a/app/models/concerns/account_interactions.rb b/app/models/concerns/account_interactions.rb
index 15c49f2fe..b8dd7e4d0 100644
--- a/app/models/concerns/account_interactions.rb
+++ b/app/models/concerns/account_interactions.rb
@@ -235,6 +235,10 @@ module AccountInteractions
     status.proper.favourites.where(account: self).exists?
   end
 
+  def reacted?(status, name, custom_emoji = nil)
+    status.proper.status_reactions.where(account: self, name: name, custom_emoji: custom_emoji).exists?
+  end
+
   def bookmarked?(status)
     status.proper.bookmarks.where(account: self).exists?
   end
diff --git a/app/models/status.rb b/app/models/status.rb
index 64f95f3d0..5a48db293 100644
--- a/app/models/status.rb
+++ b/app/models/status.rb
@@ -71,7 +71,7 @@ class Status < ApplicationRecord
   has_many :mentioned_accounts, through: :mentions, source: :account, class_name: 'Account'
   has_many :active_mentions, -> { active }, class_name: 'Mention', inverse_of: :status
   has_many :media_attachments, dependent: :nullify
-  has_many :status_reactions, dependent: :destroy
+  has_many :status_reactions, inverse_of: :status, dependent: :destroy
 
   has_and_belongs_to_many :tags
   has_and_belongs_to_many :preview_cards
diff --git a/app/serializers/activitypub/emoji_reaction_serializer.rb b/app/serializers/activitypub/emoji_reaction_serializer.rb
new file mode 100644
index 000000000..b4111150a
--- /dev/null
+++ b/app/serializers/activitypub/emoji_reaction_serializer.rb
@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+class ActivityPub::EmojiReactionSerializer < ActivityPub::Serializer
+  attributes :id, :type, :actor, :content
+  attribute :virtual_object, key: :object
+
+  has_one :custom_emoji, key: :tag, serializer: ActivityPub::EmojiSerializer, unless: -> { object.custom_emoji.nil? }
+
+  def id
+    [ActivityPub::TagManager.instance.uri_for(object.account), '#emoji_reactions/', object.id].join
+  end
+
+  def type
+    'EmojiReact'
+  end
+
+  def actor
+    ActivityPub::TagManager.instance.uri_for(object.account)
+  end
+
+  def virtual_object
+    ActivityPub::TagManager.instance.uri_for(object.status)
+  end
+
+  def content
+    if object.custom_emoji.nil?
+      object.name
+    else
+      ":#{object.name}:"
+    end
+  end
+
+  def reaction
+    content
+  end
+end
diff --git a/app/serializers/activitypub/undo_emoji_reaction_serializer.rb b/app/serializers/activitypub/undo_emoji_reaction_serializer.rb
new file mode 100644
index 000000000..49f0c1c8f
--- /dev/null
+++ b/app/serializers/activitypub/undo_emoji_reaction_serializer.rb
@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+class ActivityPub::UndoEmojiReactionSerializer < ActivityPub::Serializer
+  attributes :id, :type, :actor
+
+  has_one :object, serializer: ActivityPub::EmojiReactionSerializer
+
+  def id
+    [ActivityPub::TagManager.instance.uri_for(object.account), '#emoji_reactions/', object.id, '/undo'].join
+  end
+
+  def type
+    'Undo'
+  end
+
+  def actor
+    ActivityPub::TagManager.instance.uri_for(object.account)
+  end
+end
diff --git a/app/serializers/undo_emoji_reaction_serializer.rb b/app/serializers/undo_emoji_reaction_serializer.rb
new file mode 100644
index 000000000..e69de29bb
diff --git a/app/services/status_reaction_service.rb b/app/services/status_reaction_service.rb
new file mode 100644
index 000000000..17acfe748
--- /dev/null
+++ b/app/services/status_reaction_service.rb
@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+
+class StatusReactionService < BaseService
+  include Authorization
+  include Payloadable
+
+  def call(account, status, emoji)
+    reaction = StatusReaction.find_by(account: account, status: status)
+    return reaction unless reaction.nil?
+
+    name, domain = emoji.split("@")
+
+    custom_emoji = CustomEmoji.find_by(shortcode: name, domain: domain)
+    reaction = StatusReaction.create!(account: account, status: status, name: name, custom_emoji: custom_emoji)
+
+    json = Oj.dump(serialize_payload(reaction, ActivityPub::EmojiReactionSerializer))
+    if status.account.local?
+      ActivityPub::RawDistributionWorker.perform_async(json, status.account.id)
+    else
+      ActivityPub::DeliveryWorker.perform_async(json, reaction.account_id, status.account.inbox_url)
+    end
+
+    ActivityTracker.increment('activity:interactions')
+
+    reaction
+  end
+end
diff --git a/app/services/status_unreaction_service.rb b/app/services/status_unreaction_service.rb
new file mode 100644
index 000000000..13c3c428d
--- /dev/null
+++ b/app/services/status_unreaction_service.rb
@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+class StatusUnreactionService < BaseService
+  include Payloadable
+
+  def call(account, status)
+    reaction = StatusReaction.find_by(account: account, status: status)
+    return if reaction.nil?
+
+    reaction.destroy!
+
+    json = Oj.dump(serialize_payload(reaction, ActivityPub::UndoEmojiReactionSerializer))
+    if status.account.local?
+      ActivityPub::RawDistributionWorker.perform_async(json, status.account.id)
+    else
+      ActivityPub::DeliveryWorker.perform_async(json, reaction.account_id, status.account.inbox_url)
+    end
+
+    reaction
+  end
+end

From cacabea9380e6ac551a94641a2a8ad0c9912ec96 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Mon, 28 Nov 2022 22:25:12 +0000
Subject: [PATCH 05/47] remove accidentally created file

---
 app/serializers/undo_emoji_reaction_serializer.rb | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 app/serializers/undo_emoji_reaction_serializer.rb

diff --git a/app/serializers/undo_emoji_reaction_serializer.rb b/app/serializers/undo_emoji_reaction_serializer.rb
deleted file mode 100644
index e69de29bb..000000000

From 092e42a567e26557836f8739bc6e60cb94071ff5 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Mon, 28 Nov 2022 23:16:56 +0000
Subject: [PATCH 06/47] make status reaction count limit configurable

---
 .env.production.sample                      | 3 +++
 app/validators/status_reaction_validator.rb | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/.env.production.sample b/.env.production.sample
index da4c7fe4c..eb0df86d3 100644
--- a/.env.production.sample
+++ b/.env.production.sample
@@ -269,6 +269,9 @@ MAX_POLL_OPTIONS=5
 # Maximum allowed poll option characters
 MAX_POLL_OPTION_CHARS=100
 
+# Maximum number of emoji reactions per toot and user (minimum 1)
+MAX_STATUS_REACTIONS=8
+
 # Maximum image and video/audio upload sizes
 # Units are in bytes
 # 1048576 bytes equals 1 megabyte
diff --git a/app/validators/status_reaction_validator.rb b/app/validators/status_reaction_validator.rb
index 7c1c6983b..113e9342b 100644
--- a/app/validators/status_reaction_validator.rb
+++ b/app/validators/status_reaction_validator.rb
@@ -3,7 +3,7 @@
 class StatusReactionValidator < ActiveModel::Validator
   SUPPORTED_EMOJIS = Oj.load_file(Rails.root.join('app', 'javascript', 'mastodon', 'features', 'emoji', 'emoji_map.json').to_s).keys.freeze
 
-  LIMIT = 8
+  LIMIT = [1, (ENV['MAX_STATUS_REACTIONS'] || 1).to_i].max
 
   def validate(reaction)
     return if reaction.name.blank?

From 4577711201e28bb6c5a92f07b09a874ced3bbb4c Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Tue, 29 Nov 2022 00:39:40 +0000
Subject: [PATCH 07/47] make frontend fetch reaction limit

the maximum number of reactions was previously
hardcoded to 8.  this commit also fixes an
incorrect query in StatusReactionValidator where
it didn't count per-user reactions but the total
amount of different ones.
---
 .env.production.sample                                     | 2 +-
 .../flavours/glitch/components/status_reactions_bar.js     | 5 +++--
 app/javascript/flavours/glitch/initial_state.js            | 3 +++
 app/serializers/initial_state_serializer.rb                | 6 +++++-
 app/services/status_reaction_service.rb                    | 7 +++----
 app/validators/status_reaction_validator.rb                | 6 +++---
 6 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/.env.production.sample b/.env.production.sample
index eb0df86d3..9eb02287e 100644
--- a/.env.production.sample
+++ b/.env.production.sample
@@ -270,7 +270,7 @@ MAX_POLL_OPTIONS=5
 MAX_POLL_OPTION_CHARS=100
 
 # Maximum number of emoji reactions per toot and user (minimum 1)
-MAX_STATUS_REACTIONS=8
+MAX_REACTIONS=8
 
 # Maximum image and video/audio upload sizes
 # Units are in bytes
diff --git a/app/javascript/flavours/glitch/components/status_reactions_bar.js b/app/javascript/flavours/glitch/components/status_reactions_bar.js
index db1905be4..ac57341bc 100644
--- a/app/javascript/flavours/glitch/components/status_reactions_bar.js
+++ b/app/javascript/flavours/glitch/components/status_reactions_bar.js
@@ -11,13 +11,14 @@ import React from 'react';
 import unicodeMapping from '../features/emoji/emoji_unicode_mapping_light';
 import AnimatedNumber from './animated_number';
 import { assetHost } from '../utils/config';
-import { autoPlayGif } from '../initial_state';
+import { autoPlayGif, maxReactions } from '../initial_state';
 
 export default class StatusReactionsBar extends ImmutablePureComponent {
 
   static propTypes = {
     statusId: PropTypes.string.isRequired,
     reactions: ImmutablePropTypes.list.isRequired,
+    reactionLimit: PropTypes.number.isRequired,
     addReaction: PropTypes.func.isRequired,
     removeReaction: PropTypes.func.isRequired,
     emojiMap: ImmutablePropTypes.map.isRequired,
@@ -62,7 +63,7 @@ export default class StatusReactionsBar extends ImmutablePureComponent {
               />
             ))}
 
-            {visibleReactions.size < 8 && <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={<Icon id='plus' />} />}
+            {visibleReactions.size < maxReactions && <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={<Icon id='plus' />} />}
           </div>
         )}
       </TransitionMotion>
diff --git a/app/javascript/flavours/glitch/initial_state.js b/app/javascript/flavours/glitch/initial_state.js
index bbf25c8a8..4391b0c75 100644
--- a/app/javascript/flavours/glitch/initial_state.js
+++ b/app/javascript/flavours/glitch/initial_state.js
@@ -148,4 +148,7 @@ export const pollLimits = (initialState && initialState.poll_limits);
 export const defaultContentType = getMeta('default_content_type');
 export const useSystemEmojiFont = getMeta('system_emoji_font');
 
+// nyastodon-specific settings
+export const maxReactions = (initialState && initialState.max_reactions) || 8;
+
 export default initialState;
diff --git a/app/serializers/initial_state_serializer.rb b/app/serializers/initial_state_serializer.rb
index d23daaf85..0ac196b7a 100644
--- a/app/serializers/initial_state_serializer.rb
+++ b/app/serializers/initial_state_serializer.rb
@@ -6,7 +6,7 @@ class InitialStateSerializer < ActiveModel::Serializer
   attributes :meta, :compose, :accounts,
              :media_attachments, :settings,
              :max_toot_chars, :poll_limits,
-             :languages
+             :languages, :max_reactions
 
   has_one :push_subscription, serializer: REST::WebPushSubscriptionSerializer
   has_one :role, serializer: REST::RoleSerializer
@@ -15,6 +15,10 @@ class InitialStateSerializer < ActiveModel::Serializer
     StatusLengthValidator::MAX_CHARS
   end
 
+  def max_reactions
+    StatusReactionValidator::LIMIT
+  end
+
   def poll_limits
     {
       max_options: PollValidator::MAX_OPTIONS,
diff --git a/app/services/status_reaction_service.rb b/app/services/status_reaction_service.rb
index 17acfe748..e823f6bd8 100644
--- a/app/services/status_reaction_service.rb
+++ b/app/services/status_reaction_service.rb
@@ -5,12 +5,11 @@ class StatusReactionService < BaseService
   include Payloadable
 
   def call(account, status, emoji)
-    reaction = StatusReaction.find_by(account: account, status: status)
+    name, domain = emoji.split('@')
+    custom_emoji = CustomEmoji.find_by(shortcode: name, domain: domain)
+    reaction = StatusReaction.find_by(account: account, status: status, name: name, custom_emoji: custom_emoji)
     return reaction unless reaction.nil?
 
-    name, domain = emoji.split("@")
-
-    custom_emoji = CustomEmoji.find_by(shortcode: name, domain: domain)
     reaction = StatusReaction.create!(account: account, status: status, name: name, custom_emoji: custom_emoji)
 
     json = Oj.dump(serialize_payload(reaction, ActivityPub::EmojiReactionSerializer))
diff --git a/app/validators/status_reaction_validator.rb b/app/validators/status_reaction_validator.rb
index 113e9342b..fa6fb2e76 100644
--- a/app/validators/status_reaction_validator.rb
+++ b/app/validators/status_reaction_validator.rb
@@ -3,13 +3,13 @@
 class StatusReactionValidator < ActiveModel::Validator
   SUPPORTED_EMOJIS = Oj.load_file(Rails.root.join('app', 'javascript', 'mastodon', 'features', 'emoji', 'emoji_map.json').to_s).keys.freeze
 
-  LIMIT = [1, (ENV['MAX_STATUS_REACTIONS'] || 1).to_i].max
+  LIMIT = [1, (ENV['MAX_REACTIONS'] || 8).to_i].max
 
   def validate(reaction)
     return if reaction.name.blank?
 
     reaction.errors.add(:name, I18n.t('reactions.errors.unrecognized_emoji')) if reaction.custom_emoji_id.blank? && !unicode_emoji?(reaction.name)
-    reaction.errors.add(:base, I18n.t('reactions.errors.limit_reached')) if new_reaction?(reaction) && limit_reached?(reaction)
+    reaction.errors.add(:base, I18n.t('reactions.errors.limit_reached')) if limit_reached?(reaction)
   end
 
   private
@@ -23,6 +23,6 @@ class StatusReactionValidator < ActiveModel::Validator
   end
 
   def limit_reached?(reaction)
-    reaction.status.status_reactions.where.not(name: reaction.name).count('distinct name') >= LIMIT
+    reaction.status.status_reactions.where(status: reaction.status, account: reaction.account).count >= LIMIT
   end
 end

From 079b0d15c546ca959f45b2a0885f5b622a6f634b Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Tue, 29 Nov 2022 04:31:22 +0100
Subject: [PATCH 08/47] cherry-pick emoji reaction changes

---
 .../flavours/glitch/actions/notifications.js  |  1 +
 .../flavours/glitch/components/status.js      |  1 +
 .../glitch/components/status_prepend.js       | 11 ++++++
 .../glitch/components/status_reactions_bar.js |  1 -
 .../components/column_settings.js             | 11 ++++++
 .../notifications/components/filter_bar.js    |  8 ++++
 .../notifications/components/notification.js  | 22 +++++++++++
 app/javascript/flavours/glitch/locales/de.js  |  5 ++-
 app/javascript/flavours/glitch/locales/en.js  |  4 ++
 app/javascript/flavours/glitch/locales/fr.js  |  5 ++-
 .../flavours/glitch/reducers/settings.js      |  3 ++
 app/models/notification.rb                    | 38 ++++++++++++-------
 .../rest/notification_serializer.rb           |  2 +-
 app/services/status_reaction_service.rb       |  1 +
 config/locales/de.yml                         |  4 ++
 config/locales/en.yml                         |  4 ++
 config/locales/en_GB.yml                      |  4 ++
 config/locales/fr.yml                         |  4 ++
 18 files changed, 111 insertions(+), 18 deletions(-)

diff --git a/app/javascript/flavours/glitch/actions/notifications.js b/app/javascript/flavours/glitch/actions/notifications.js
index 158a5b7e4..fa556269c 100644
--- a/app/javascript/flavours/glitch/actions/notifications.js
+++ b/app/javascript/flavours/glitch/actions/notifications.js
@@ -139,6 +139,7 @@ const excludeTypesFromFilter = filter => {
     'follow',
     'follow_request',
     'favourite',
+    'reaction',
     'reblog',
     'mention',
     'poll',
diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js
index 31b234ef3..05fecdb96 100644
--- a/app/javascript/flavours/glitch/components/status.js
+++ b/app/javascript/flavours/glitch/components/status.js
@@ -726,6 +726,7 @@ class Status extends ImmutablePureComponent {
     if (this.props.prepend && account) {
       const notifKind = {
         favourite: 'favourited',
+        reaction: 'reacted',
         reblog: 'boosted',
         reblogged_by: 'boosted',
         status: 'posted',
diff --git a/app/javascript/flavours/glitch/components/status_prepend.js b/app/javascript/flavours/glitch/components/status_prepend.js
index f82533062..6c96f2ee2 100644
--- a/app/javascript/flavours/glitch/components/status_prepend.js
+++ b/app/javascript/flavours/glitch/components/status_prepend.js
@@ -56,6 +56,14 @@ export default class StatusPrepend extends React.PureComponent {
           values={{ name : link }}
         />
       );
+    case 'reaction':
+      return (
+        <FormattedMessage
+          id='notification.reaction'
+          defaultMessage='{name} reacted to your post'
+          values={{ name: link }}
+        />
+      );
     case 'reblog':
       return (
         <FormattedMessage
@@ -110,6 +118,9 @@ export default class StatusPrepend extends React.PureComponent {
     case 'favourite':
       iconId = 'star';
       break;
+    case 'reaction':
+      iconId = 'plus';
+      break;
     case 'featured':
       iconId = 'thumb-tack';
       break;
diff --git a/app/javascript/flavours/glitch/components/status_reactions_bar.js b/app/javascript/flavours/glitch/components/status_reactions_bar.js
index ac57341bc..54f075d40 100644
--- a/app/javascript/flavours/glitch/components/status_reactions_bar.js
+++ b/app/javascript/flavours/glitch/components/status_reactions_bar.js
@@ -18,7 +18,6 @@ export default class StatusReactionsBar extends ImmutablePureComponent {
   static propTypes = {
     statusId: PropTypes.string.isRequired,
     reactions: ImmutablePropTypes.list.isRequired,
-    reactionLimit: PropTypes.number.isRequired,
     addReaction: PropTypes.func.isRequired,
     removeReaction: PropTypes.func.isRequired,
     emojiMap: ImmutablePropTypes.map.isRequired,
diff --git a/app/javascript/flavours/glitch/features/notifications/components/column_settings.js b/app/javascript/flavours/glitch/features/notifications/components/column_settings.js
index 64fd98bd9..5c3d59597 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/column_settings.js
+++ b/app/javascript/flavours/glitch/features/notifications/components/column_settings.js
@@ -116,6 +116,17 @@ export default class ColumnSettings extends React.PureComponent {
           </div>
         </div>
 
+        <div role='group' aria-labelledby='notifications-reaction'>
+          <span id='notifications-reaction' className='column-settings__section'><FormattedMessage id='notifications.column_settings.reaction' defaultMessage='Reactions:' /></span>
+
+          <div className='column-settings__pillbar'>
+            <PillBarButton disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'reaction']} onChange={onChange} label={alertStr} />
+            {showPushSettings && <PillBarButton prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'reaction']} onChange={this.onPushChange} label={pushStr} />}
+            <PillBarButton prefix='notifications' settings={settings} settingPath={['shows', 'reaction']} onChange={onChange} label={showStr} />
+            <PillBarButton prefix='notifications' settings={settings} settingPath={['sounds', 'reaction']} onChange={onChange} label={soundStr} />
+          </div>
+        </div>
+
         <div role='group' aria-labelledby='notifications-mention'>
           <span id='notifications-mention' className='column-settings__section'><FormattedMessage id='notifications.column_settings.mention' defaultMessage='Mentions:' /></span>
 
diff --git a/app/javascript/flavours/glitch/features/notifications/components/filter_bar.js b/app/javascript/flavours/glitch/features/notifications/components/filter_bar.js
index c1de0f90e..6027a55d8 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/filter_bar.js
+++ b/app/javascript/flavours/glitch/features/notifications/components/filter_bar.js
@@ -6,6 +6,7 @@ import Icon from 'flavours/glitch/components/icon';
 const tooltips = defineMessages({
   mentions: { id: 'notifications.filter.mentions', defaultMessage: 'Mentions' },
   favourites: { id: 'notifications.filter.favourites', defaultMessage: 'Favourites' },
+  reactions: { id: 'notifications.filter.reactions', defaultMessage: 'Reactions' },
   boosts: { id: 'notifications.filter.boosts', defaultMessage: 'Boosts' },
   polls: { id: 'notifications.filter.polls', defaultMessage: 'Poll results' },
   follows: { id: 'notifications.filter.follows', defaultMessage: 'Follows' },
@@ -74,6 +75,13 @@ class FilterBar extends React.PureComponent {
         >
           <Icon id='star' fixedWidth />
         </button>
+        <button
+          className={selectedFilter === 'reaction' ? 'active' : ''}
+          onClick={this.onClick('reaction')}
+          title={intl.formatMessage(tooltips.reactions)}
+        >
+          <Icon id='plus' fixedWidth />
+        </button>
         <button
           className={selectedFilter === 'reblog' ? 'active' : ''}
           onClick={this.onClick('reblog')}
diff --git a/app/javascript/flavours/glitch/features/notifications/components/notification.js b/app/javascript/flavours/glitch/features/notifications/components/notification.js
index d676a4207..f938da7c7 100644
--- a/app/javascript/flavours/glitch/features/notifications/components/notification.js
+++ b/app/javascript/flavours/glitch/features/notifications/components/notification.js
@@ -155,6 +155,28 @@ export default class Notification extends ImmutablePureComponent {
           unread={this.props.unread}
         />
       );
+    case 'reaction':
+      return (
+        <StatusContainer
+          containerId={notification.get('id')}
+          hidden={hidden}
+          id={notification.get('status')}
+          account={notification.get('account')}
+          prepend='reaction'
+          muted
+          notification={notification}
+          onMoveDown={onMoveDown}
+          onMoveUp={onMoveUp}
+          onMention={onMention}
+          getScrollPosition={getScrollPosition}
+          updateScrollBottom={updateScrollBottom}
+          cachedMediaWidth={this.props.cachedMediaWidth}
+          cacheMediaWidth={this.props.cacheMediaWidth}
+          onUnmount={this.props.onUnmount}
+          withDismiss
+          unread={this.props.unread}
+        />
+      );
     case 'reblog':
       return (
         <StatusContainer
diff --git a/app/javascript/flavours/glitch/locales/de.js b/app/javascript/flavours/glitch/locales/de.js
index ce6453623..9b2ff91d9 100644
--- a/app/javascript/flavours/glitch/locales/de.js
+++ b/app/javascript/flavours/glitch/locales/de.js
@@ -1,7 +1,10 @@
 import inherited from 'mastodon/locales/de.json';
 
 const messages = {
-  //  No translations available.
+  'notification.reaction': '{name} hat auf deinen Beitrag reagiert',
+  'notifications.column_settings.reaction': 'Reaktionen:',
+
+  'tooltips.reactions': 'Reaktionen',
 };
 
 export default Object.assign({}, inherited, messages);
diff --git a/app/javascript/flavours/glitch/locales/en.js b/app/javascript/flavours/glitch/locales/en.js
index 90e924d4a..290da2f9f 100644
--- a/app/javascript/flavours/glitch/locales/en.js
+++ b/app/javascript/flavours/glitch/locales/en.js
@@ -42,7 +42,9 @@ const messages = {
   'home.column_settings.show_direct': 'Show DMs',
 
   'notification.markForDeletion': 'Mark for deletion',
+  'notification.reaction': '{name} reacted to your post',
   'notifications.clear': 'Clear all my notifications',
+  'notifications.column_settings.reaction': 'Reactions:',
   'notifications.marked_clear_confirmation': 'Are you sure you want to permanently clear all selected notifications?',
   'notifications.marked_clear': 'Clear selected notifications',
 
@@ -62,6 +64,8 @@ const messages = {
   'advanced_options.threaded_mode.short': 'Threaded mode',
   'advanced_options.threaded_mode.long': 'Automatically opens a reply on posting',
   'advanced_options.threaded_mode.tooltip': 'Threaded mode enabled',
+
+  'tooltips.reactions': 'Reactions',
 };
 
 export default Object.assign({}, inherited, messages);
diff --git a/app/javascript/flavours/glitch/locales/fr.js b/app/javascript/flavours/glitch/locales/fr.js
index 8562f5594..82439c4bf 100644
--- a/app/javascript/flavours/glitch/locales/fr.js
+++ b/app/javascript/flavours/glitch/locales/fr.js
@@ -1,7 +1,10 @@
 import inherited from 'mastodon/locales/fr.json';
 
 const messages = {
-  //  No translations available.
+  'notification.reaction': '{name} a réagi·e à votre message',
+  'notifications.column_settings.reaction': 'Réactions:',
+
+  'tooltips.reactions': 'Réactions',
 };
 
 export default Object.assign({}, inherited, messages);
diff --git a/app/javascript/flavours/glitch/reducers/settings.js b/app/javascript/flavours/glitch/reducers/settings.js
index 82927f7cd..40ea14ac4 100644
--- a/app/javascript/flavours/glitch/reducers/settings.js
+++ b/app/javascript/flavours/glitch/reducers/settings.js
@@ -37,6 +37,7 @@ const initialState = ImmutableMap({
       follow: false,
       follow_request: false,
       favourite: false,
+      reaction: false,
       reblog: false,
       mention: false,
       poll: false,
@@ -60,6 +61,7 @@ const initialState = ImmutableMap({
       follow_request: false,
       favourite: true,
       reblog: true,
+      reaction: true,
       mention: true,
       poll: true,
       status: true,
@@ -73,6 +75,7 @@ const initialState = ImmutableMap({
       follow_request: false,
       favourite: true,
       reblog: true,
+      reaction: true,
       mention: true,
       poll: true,
       status: true,
diff --git a/app/models/notification.rb b/app/models/notification.rb
index bbc63c1c0..9e3c31a6b 100644
--- a/app/models/notification.rb
+++ b/app/models/notification.rb
@@ -19,12 +19,13 @@ class Notification < ApplicationRecord
   include Paginable
 
   LEGACY_TYPE_CLASS_MAP = {
-    'Mention'       => :mention,
-    'Status'        => :reblog,
-    'Follow'        => :follow,
-    'FollowRequest' => :follow_request,
-    'Favourite'     => :favourite,
-    'Poll'          => :poll,
+    'Mention'        => :mention,
+    'Status'         => :reblog,
+    'Follow'         => :follow,
+    'FollowRequest'  => :follow_request,
+    'Favourite'      => :favourite,
+    'StatusReaction' => :reaction,
+    'Poll'           => :poll,
   }.freeze
 
   TYPES = %i(
@@ -34,6 +35,7 @@ class Notification < ApplicationRecord
     follow
     follow_request
     favourite
+    reaction
     poll
     update
     admin.sign_up
@@ -45,6 +47,7 @@ class Notification < ApplicationRecord
     reblog: [status: :reblog],
     mention: [mention: :status],
     favourite: [favourite: :status],
+    reaction: [status_reaction: :status],
     poll: [poll: :status],
     update: :status,
     'admin.report': [report: :target_account],
@@ -54,13 +57,14 @@ class Notification < ApplicationRecord
   belongs_to :from_account, class_name: 'Account', optional: true
   belongs_to :activity, polymorphic: true, optional: true
 
-  belongs_to :mention,        foreign_key: 'activity_id', optional: true
-  belongs_to :status,         foreign_key: 'activity_id', optional: true
-  belongs_to :follow,         foreign_key: 'activity_id', optional: true
-  belongs_to :follow_request, foreign_key: 'activity_id', optional: true
-  belongs_to :favourite,      foreign_key: 'activity_id', optional: true
-  belongs_to :poll,           foreign_key: 'activity_id', optional: true
-  belongs_to :report,         foreign_key: 'activity_id', optional: true
+  belongs_to :mention,         foreign_key: 'activity_id', optional: true
+  belongs_to :status,          foreign_key: 'activity_id', optional: true
+  belongs_to :follow,          foreign_key: 'activity_id', optional: true
+  belongs_to :follow_request,  foreign_key: 'activity_id', optional: true
+  belongs_to :favourite,       foreign_key: 'activity_id', optional: true
+  belongs_to :poll,            foreign_key: 'activity_id', optional: true
+  belongs_to :report,          foreign_key: 'activity_id', optional: true
+  belongs_to :status_reaction, foreign_key: 'activity_id', optional: true
 
   validates :type, inclusion: { in: TYPES }
 
@@ -78,6 +82,8 @@ class Notification < ApplicationRecord
       status&.reblog
     when :favourite
       favourite&.status
+    when :reaction
+      status_reaction&.status
     when :mention
       mention&.status
     when :poll
@@ -129,6 +135,8 @@ class Notification < ApplicationRecord
           notification.status.reblog = cached_status
         when :favourite
           notification.favourite.status = cached_status
+        when :reaction
+          notification.reaction.status = cached_status
         when :mention
           notification.mention.status = cached_status
         when :poll
@@ -140,6 +148,8 @@ class Notification < ApplicationRecord
     end
   end
 
+  alias reaction status_reaction
+
   after_initialize :set_from_account
   before_validation :set_from_account
 
@@ -149,7 +159,7 @@ class Notification < ApplicationRecord
     return unless new_record?
 
     case activity_type
-    when 'Status', 'Follow', 'Favourite', 'FollowRequest', 'Poll', 'Report'
+    when 'Status', 'Follow', 'Favourite', 'StatusReaction', 'FollowRequest', 'Poll', 'Report'
       self.from_account_id = activity&.account_id
     when 'Mention'
       self.from_account_id = activity&.status&.account_id
diff --git a/app/serializers/rest/notification_serializer.rb b/app/serializers/rest/notification_serializer.rb
index 137fc53dd..93690e444 100644
--- a/app/serializers/rest/notification_serializer.rb
+++ b/app/serializers/rest/notification_serializer.rb
@@ -12,7 +12,7 @@ class REST::NotificationSerializer < ActiveModel::Serializer
   end
 
   def status_type?
-    [:favourite, :reblog, :status, :mention, :poll, :update].include?(object.type)
+    [:favourite, :reaction, :reblog, :status, :mention, :poll, :update].include?(object.type)
   end
 
   def report_type?
diff --git a/app/services/status_reaction_service.rb b/app/services/status_reaction_service.rb
index e823f6bd8..9451690dd 100644
--- a/app/services/status_reaction_service.rb
+++ b/app/services/status_reaction_service.rb
@@ -14,6 +14,7 @@ class StatusReactionService < BaseService
 
     json = Oj.dump(serialize_payload(reaction, ActivityPub::EmojiReactionSerializer))
     if status.account.local?
+      NotifyService.new.call(status.account, :reaction, reaction)
       ActivityPub::RawDistributionWorker.perform_async(json, status.account.id)
     else
       ActivityPub::DeliveryWorker.perform_async(json, reaction.account_id, status.account.inbox_url)
diff --git a/config/locales/de.yml b/config/locales/de.yml
index 8a12a3047..1899b131d 100644
--- a/config/locales/de.yml
+++ b/config/locales/de.yml
@@ -1285,6 +1285,10 @@ de:
       body: 'Dein Beitrag wurde von %{name} favorisiert:'
       subject: "%{name} hat deinen Beitrag favorisiert"
       title: Neue Favorisierung
+    reaction:
+      body: '%{name} hat auf deinen Beitrag reagiert:'
+      subject: '%{name} hat auf deinen Beitrag reagiert'
+      title: Neue Reaktion
     follow:
       body: "%{name} folgt dir jetzt!"
       subject: "%{name} folgt dir jetzt"
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 1cc53dca4..5792f5de9 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -1285,6 +1285,10 @@ en:
       body: 'Your post was favourited by %{name}:'
       subject: "%{name} favourited your post"
       title: New favourite
+    reaction:
+      body: '%{name} reacted to your post:'
+      subject: '%{name} reacted to your post'
+      title: New reaction
     follow:
       body: "%{name} is now following you!"
       subject: "%{name} is now following you"
diff --git a/config/locales/en_GB.yml b/config/locales/en_GB.yml
index 2cba40da0..80084d9a6 100644
--- a/config/locales/en_GB.yml
+++ b/config/locales/en_GB.yml
@@ -707,6 +707,10 @@ en_GB:
       body: 'Your status was favourited by %{name}:'
       subject: "%{name} favourited your status"
       title: New favourite
+    reaction:
+      body: '%{name} reacted on your post with %{reaction}:'
+      subject: '%{name} reacted on your post'
+      title: New reaction
     follow:
       body: "%{name} is now following you!"
       subject: "%{name} is now following you"
diff --git a/config/locales/fr.yml b/config/locales/fr.yml
index b24603db9..9f3cf843a 100644
--- a/config/locales/fr.yml
+++ b/config/locales/fr.yml
@@ -1285,6 +1285,10 @@ fr:
       body: "%{name} a ajouté votre message à ses favoris :"
       subject: "%{name} a ajouté votre message à ses favoris"
       title: Nouveau favori
+    reaction:
+      body: '%{name} a réagi·e à votre message:'
+      subject: '%{name} a réagi·e à votre message'
+      title: Nouvelle réaction
     follow:
       body: "%{name} vous suit !"
       subject: "%{name} vous suit"

From 8398f7ad4ed398314d91dfd05e34fc6941e1dc55 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Tue, 29 Nov 2022 04:37:44 +0000
Subject: [PATCH 09/47] move react button to action bar

---
 .../glitch/components/status_action_bar.js    | 28 ++++++++++++++++++-
 .../glitch/components/status_reactions_bar.js |  6 +---
 .../components/emoji_picker_dropdown.js       |  3 +-
 .../features/status/components/action_bar.js  | 23 ++++++++++++++-
 .../flavours/glitch/features/status/index.js  |  1 +
 app/javascript/flavours/glitch/locales/de.js  |  2 ++
 app/javascript/flavours/glitch/locales/en.js  |  1 +
 app/javascript/flavours/glitch/locales/fr.js  |  2 ++
 8 files changed, 58 insertions(+), 8 deletions(-)

diff --git a/app/javascript/flavours/glitch/components/status_action_bar.js b/app/javascript/flavours/glitch/components/status_action_bar.js
index 977c98ccb..6ac2acc22 100644
--- a/app/javascript/flavours/glitch/components/status_action_bar.js
+++ b/app/javascript/flavours/glitch/components/status_action_bar.js
@@ -5,11 +5,12 @@ import IconButton from './icon_button';
 import DropdownMenuContainer from 'flavours/glitch/containers/dropdown_menu_container';
 import { defineMessages, injectIntl } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { me } from 'flavours/glitch/initial_state';
+import { me, maxReactions } from 'flavours/glitch/initial_state';
 import RelativeTimestamp from './relative_timestamp';
 import { accountAdminLink, statusAdminLink } from 'flavours/glitch/utils/backend_links';
 import classNames from 'classnames';
 import { PERMISSION_MANAGE_USERS } from 'flavours/glitch/permissions';
+import EmojiPickerDropdown from '../features/compose/containers/emoji_picker_dropdown_container';
 
 const messages = defineMessages({
   delete: { id: 'status.delete', defaultMessage: 'Delete' },
@@ -28,6 +29,7 @@ const messages = defineMessages({
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
   favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  react: { id: 'status.react', defaultMessage: 'React' },
   bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
   open: { id: 'status.open', defaultMessage: 'Expand this status' },
   report: { id: 'status.report', defaultMessage: 'Report @{name}' },
@@ -114,6 +116,16 @@ class StatusActionBar extends ImmutablePureComponent {
     }
   }
 
+  handleEmojiPick = data => {
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''));
+    } else {
+      this.props.onInteractionModal('favourite', this.props.status);
+    }
+  }
+
   handleReblogClick = e => {
     const { signedIn } = this.context.identity;
 
@@ -195,6 +207,8 @@ class StatusActionBar extends ImmutablePureComponent {
     this.props.onAddFilter(this.props.status);
   }
 
+  nop = () => {}
+
   render () {
     const { status, intl, withDismiss, withCounters, showReplyCount, scrollKey } = this.props;
 
@@ -296,6 +310,17 @@ class StatusActionBar extends ImmutablePureComponent {
       <IconButton className='status__action-bar-button' title={intl.formatMessage(messages.hide)} icon='eye' onClick={this.handleHideClick} />
     );
 
+    const canReact = status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
+    const reactButton = (
+      <IconButton
+        className='status__action-bar-button'
+        onClick={this.nop} // EmojiPickerDropdown handles that
+        title={intl.formatMessage(messages.react)}
+        disabled={!canReact}
+        icon='plus'
+      />
+    );
+
     return (
       <div className='status__action-bar'>
         <IconButton
@@ -308,6 +333,7 @@ class StatusActionBar extends ImmutablePureComponent {
         />
         <IconButton className={classNames('status__action-bar-button', { reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon={reblogIcon} onClick={this.handleReblogClick} counter={withCounters ? status.get('reblogs_count') : undefined} />
         <IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} counter={withCounters ? status.get('favourites_count') : undefined} />
+        <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
         {shareButton}
         <IconButton className='status__action-bar-button bookmark-icon' disabled={anonymousAccess} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} />
 
diff --git a/app/javascript/flavours/glitch/components/status_reactions_bar.js b/app/javascript/flavours/glitch/components/status_reactions_bar.js
index 54f075d40..912e1b1ba 100644
--- a/app/javascript/flavours/glitch/components/status_reactions_bar.js
+++ b/app/javascript/flavours/glitch/components/status_reactions_bar.js
@@ -5,13 +5,11 @@ import { reduceMotion } from '../initial_state';
 import spring from 'react-motion/lib/spring';
 import TransitionMotion from 'react-motion/lib/TransitionMotion';
 import classNames from 'classnames';
-import EmojiPickerDropdown from '../features/compose/containers/emoji_picker_dropdown_container';
-import Icon from './icon';
 import React from 'react';
 import unicodeMapping from '../features/emoji/emoji_unicode_mapping_light';
 import AnimatedNumber from './animated_number';
 import { assetHost } from '../utils/config';
-import { autoPlayGif, maxReactions } from '../initial_state';
+import { autoPlayGif } from '../initial_state';
 
 export default class StatusReactionsBar extends ImmutablePureComponent {
 
@@ -61,8 +59,6 @@ export default class StatusReactionsBar extends ImmutablePureComponent {
                 emojiMap={this.props.emojiMap}
               />
             ))}
-
-            {visibleReactions.size < maxReactions && <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={<Icon id='plus' />} />}
           </div>
         )}
       </TransitionMotion>
diff --git a/app/javascript/flavours/glitch/features/compose/components/emoji_picker_dropdown.js b/app/javascript/flavours/glitch/features/compose/components/emoji_picker_dropdown.js
index 546d398a0..61d38648a 100644
--- a/app/javascript/flavours/glitch/features/compose/components/emoji_picker_dropdown.js
+++ b/app/javascript/flavours/glitch/features/compose/components/emoji_picker_dropdown.js
@@ -321,6 +321,7 @@ class EmojiPickerDropdown extends React.PureComponent {
     onSkinTone: PropTypes.func.isRequired,
     skinTone: PropTypes.number.isRequired,
     button: PropTypes.node,
+    disabled: PropTypes.bool,
   };
 
   state = {
@@ -358,7 +359,7 @@ class EmojiPickerDropdown extends React.PureComponent {
   }
 
   onToggle = (e) => {
-    if (!this.state.loading && (!e.key || e.key === 'Enter')) {
+    if (!this.state.disabled && !this.state.loading && (!e.key || e.key === 'Enter')) {
       if (this.state.active) {
         this.onHideDropdown();
       } else {
diff --git a/app/javascript/flavours/glitch/features/status/components/action_bar.js b/app/javascript/flavours/glitch/features/status/components/action_bar.js
index b6f8a9877..bd8c0d0cf 100644
--- a/app/javascript/flavours/glitch/features/status/components/action_bar.js
+++ b/app/javascript/flavours/glitch/features/status/components/action_bar.js
@@ -4,10 +4,11 @@ import IconButton from 'flavours/glitch/components/icon_button';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import DropdownMenuContainer from 'flavours/glitch/containers/dropdown_menu_container';
 import { defineMessages, injectIntl } from 'react-intl';
-import { me } from 'flavours/glitch/initial_state';
+import { me, maxReactions } from 'flavours/glitch/initial_state';
 import { accountAdminLink, statusAdminLink } from 'flavours/glitch/utils/backend_links';
 import classNames from 'classnames';
 import { PERMISSION_MANAGE_USERS } from 'flavours/glitch/permissions';
+import EmojiPickerDropdown from '../../compose/containers/emoji_picker_dropdown_container';
 
 const messages = defineMessages({
   delete: { id: 'status.delete', defaultMessage: 'Delete' },
@@ -21,6 +22,7 @@ const messages = defineMessages({
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
   favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  react: { id: 'status.react', defaultMessage: 'React' },
   bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
   more: { id: 'status.more', defaultMessage: 'More' },
   mute: { id: 'status.mute', defaultMessage: 'Mute @{name}' },
@@ -51,6 +53,7 @@ class ActionBar extends React.PureComponent {
     onReply: PropTypes.func.isRequired,
     onReblog: PropTypes.func.isRequired,
     onFavourite: PropTypes.func.isRequired,
+    onReactionAdd: PropTypes.func.isRequired,
     onBookmark: PropTypes.func.isRequired,
     onMute: PropTypes.func,
     onMuteConversation: PropTypes.func,
@@ -77,6 +80,10 @@ class ActionBar extends React.PureComponent {
     this.props.onFavourite(this.props.status, e);
   }
 
+  handleEmojiPick = data => {
+    this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''));
+  }
+
   handleBookmarkClick = (e) => {
     this.props.onBookmark(this.props.status, e);
   }
@@ -137,6 +144,8 @@ class ActionBar extends React.PureComponent {
     navigator.clipboard.writeText(url);
   }
 
+  nop = () => {}
+
   render () {
     const { status, intl } = this.props;
     const { signedIn, permissions } = this.context.identity;
@@ -194,6 +203,17 @@ class ActionBar extends React.PureComponent {
       }
     }
 
+    const canReact = status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
+    const reactButton = (
+      <IconButton
+        className='plus-icon'
+        onClick={this.nop} // EmojiPickerDropdown handles that
+        title={intl.formatMessage(messages.react)}
+        disabled={!canReact}
+        icon='plus'
+      />
+    );
+
     const shareButton = ('share' in navigator) && publicStatus && (
       <div className='detailed-status__button'><IconButton title={intl.formatMessage(messages.share)} icon='share-alt' onClick={this.handleShare} /></div>
     );
@@ -216,6 +236,7 @@ class ActionBar extends React.PureComponent {
         <div className='detailed-status__button'><IconButton title={intl.formatMessage(messages.reply)} icon={status.get('in_reply_to_id', null) === null ? 'reply' : 'reply-all'} onClick={this.handleReplyClick} /></div>
         <div className='detailed-status__button'><IconButton className={classNames({ reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} /></div>
         <div className='detailed-status__button'><IconButton className='star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} /></div>
+        <div className='detailed-status__button'><EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} /></div>
         {shareButton}
         <div className='detailed-status__button'><IconButton className='bookmark-icon' disabled={!signedIn} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /></div>
 
diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js
index 730af52f0..73f6c1956 100644
--- a/app/javascript/flavours/glitch/features/status/index.js
+++ b/app/javascript/flavours/glitch/features/status/index.js
@@ -721,6 +721,7 @@ class Status extends ImmutablePureComponent {
                   status={status}
                   onReply={this.handleReplyClick}
                   onFavourite={this.handleFavouriteClick}
+                  onReactionAdd={this.handleReactionAdd}
                   onReblog={this.handleReblogClick}
                   onBookmark={this.handleBookmarkClick}
                   onDelete={this.handleDeleteClick}
diff --git a/app/javascript/flavours/glitch/locales/de.js b/app/javascript/flavours/glitch/locales/de.js
index 9b2ff91d9..a4daa5949 100644
--- a/app/javascript/flavours/glitch/locales/de.js
+++ b/app/javascript/flavours/glitch/locales/de.js
@@ -5,6 +5,8 @@ const messages = {
   'notifications.column_settings.reaction': 'Reaktionen:',
 
   'tooltips.reactions': 'Reaktionen',
+
+  'status.react': 'Reagieren',
 };
 
 export default Object.assign({}, inherited, messages);
diff --git a/app/javascript/flavours/glitch/locales/en.js b/app/javascript/flavours/glitch/locales/en.js
index 290da2f9f..7065cbe26 100644
--- a/app/javascript/flavours/glitch/locales/en.js
+++ b/app/javascript/flavours/glitch/locales/en.js
@@ -33,6 +33,7 @@ const messages = {
   'settings.wide_view': 'Wide view (Desktop mode only)',
   'settings.navbar_under': 'Navbar at the bottom (Mobile only)',
   'status.collapse': 'Collapse',
+  'status.react': 'React',
   'status.uncollapse': 'Uncollapse',
 
   'media_gallery.sensitive': 'Sensitive',
diff --git a/app/javascript/flavours/glitch/locales/fr.js b/app/javascript/flavours/glitch/locales/fr.js
index 82439c4bf..3ebe055e0 100644
--- a/app/javascript/flavours/glitch/locales/fr.js
+++ b/app/javascript/flavours/glitch/locales/fr.js
@@ -5,6 +5,8 @@ const messages = {
   'notifications.column_settings.reaction': 'Réactions:',
 
   'tooltips.reactions': 'Réactions',
+
+  'status.react': 'Réagir',
 };
 
 export default Object.assign({}, inherited, messages);

From 758f9f638400d8f2daf66dc526247d1a398b808d Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Tue, 29 Nov 2022 05:21:53 +0000
Subject: [PATCH 10/47] handle misskey reactions properly

misskey federates emoji reactions as likes.
---
 app/lib/activitypub/activity/emoji_react.rb |  4 +++-
 app/lib/activitypub/activity/like.rb        | 14 +++++++++++++-
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/app/lib/activitypub/activity/emoji_react.rb b/app/lib/activitypub/activity/emoji_react.rb
index 82c098f56..595751aaa 100644
--- a/app/lib/activitypub/activity/emoji_react.rb
+++ b/app/lib/activitypub/activity/emoji_react.rb
@@ -9,6 +9,8 @@ class ActivityPub::Activity::EmojiReact < ActivityPub::Activity
       delete_arrived_first?(@json['id']) ||
       @account.reacted?(original_status, name)
 
-    original_status.status_reactions.create!(account: @account, name: name)
+    reaction = original_status.status_reactions.create!(account: @account, name: name)
+
+    LocalNotificationWorker.perform_async(original_status.account_id, reaction.id, 'StatusReaction', 'reaction')
   end
 end
diff --git a/app/lib/activitypub/activity/like.rb b/app/lib/activitypub/activity/like.rb
index aa1dc3040..6af516d10 100644
--- a/app/lib/activitypub/activity/like.rb
+++ b/app/lib/activitypub/activity/like.rb
@@ -3,8 +3,20 @@
 class ActivityPub::Activity::Like < ActivityPub::Activity
   def perform
     original_status = status_from_uri(object_uri)
+    return if original_status.nil? || !original_status.account.local? || delete_arrived_first?(@json['id'])
 
-    return if original_status.nil? || !original_status.account.local? || delete_arrived_first?(@json['id']) || @account.favourited?(original_status)
+    # misskey delivers reactions as likes and attaches the emoji in _misskey_reaction
+    mk_reaction = @json['_misskey_reaction']
+    unless mk_reaction.nil?
+      custom_emoji = CustomEmoji.find_by(shortcode: mk_reaction, domain: @account.domain)
+      return if @account.reacted?(original_status, mk_reaction, custom_emoji)
+
+      reaction = original_status.status_reactions.create!(account: @account, name: mk_reaction, custom_emoji: custom_emoji)
+      LocalNotificationWorker.perform_async(original_status.account_id, reaction.id, 'StatusReaction', 'reaction')
+      return
+    end
+
+    return if @account.favourited?(original_status)
 
     favourite = original_status.favourites.create!(account: @account)
 

From 266bf2543db24edf9ad9f11b236ccbc40a5a5cf2 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Tue, 29 Nov 2022 06:25:43 +0000
Subject: [PATCH 11/47] fix padding for reaction button

---
 .../flavours/glitch/components/status_action_bar.js         | 2 +-
 .../flavours/glitch/styles/components/accounts.scss         | 4 ++++
 .../flavours/glitch/styles/components/status.scss           | 6 +++++-
 3 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/app/javascript/flavours/glitch/components/status_action_bar.js b/app/javascript/flavours/glitch/components/status_action_bar.js
index 6ac2acc22..04ca06ffe 100644
--- a/app/javascript/flavours/glitch/components/status_action_bar.js
+++ b/app/javascript/flavours/glitch/components/status_action_bar.js
@@ -333,7 +333,7 @@ class StatusActionBar extends ImmutablePureComponent {
         />
         <IconButton className={classNames('status__action-bar-button', { reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon={reblogIcon} onClick={this.handleReblogClick} counter={withCounters ? status.get('reblogs_count') : undefined} />
         <IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} counter={withCounters ? status.get('favourites_count') : undefined} />
-        <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
+        <EmojiPickerDropdown className='status__action-bar-button' onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
         {shareButton}
         <IconButton className='status__action-bar-button bookmark-icon' disabled={anonymousAccess} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} />
 
diff --git a/app/javascript/flavours/glitch/styles/components/accounts.scss b/app/javascript/flavours/glitch/styles/components/accounts.scss
index ac2d642a8..7554d4fe9 100644
--- a/app/javascript/flavours/glitch/styles/components/accounts.scss
+++ b/app/javascript/flavours/glitch/styles/components/accounts.scss
@@ -306,6 +306,10 @@
   text-align: center;
 }
 
+.detailed-status__button .emoji-button {
+  padding: 0;
+}
+
 .relationship-tag {
   color: $primary-text-color;
   margin-bottom: 4px;
diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss
index 7cc6f5386..7c783ae75 100644
--- a/app/javascript/flavours/glitch/styles/components/status.scss
+++ b/app/javascript/flavours/glitch/styles/components/status.scss
@@ -406,7 +406,7 @@
         background: linear-gradient(rgba($ui-base-color, 0), rgba($ui-base-color, 1));
         pointer-events: none;
       }
-      
+
       a:hover {
         text-decoration: none;
       }
@@ -575,6 +575,10 @@
   align-items: center;
   display: flex;
   margin-top: 8px;
+
+  & > .emoji-picker-dropdown > .emoji-button {
+    padding: 0;
+  }
 }
 
 .status__action-bar-button {

From 852e6ef1954256b07714ffcb9e099a1804a7ccf0 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Tue, 29 Nov 2022 08:15:52 +0000
Subject: [PATCH 12/47] cleanup backend emoji reaction code

---
 app/controllers/api/v1/statuses/reactions_controller.rb       | 4 ++--
 app/serializers/activitypub/emoji_reaction_serializer.rb      | 4 +---
 app/services/{status_reaction_service.rb => react_service.rb} | 2 +-
 .../{status_unreaction_service.rb => unreact_service.rb}      | 2 +-
 4 files changed, 5 insertions(+), 7 deletions(-)
 rename app/services/{status_reaction_service.rb => react_service.rb} (95%)
 rename app/services/{status_unreaction_service.rb => unreact_service.rb} (92%)

diff --git a/app/controllers/api/v1/statuses/reactions_controller.rb b/app/controllers/api/v1/statuses/reactions_controller.rb
index f7dc2f99c..db43346de 100644
--- a/app/controllers/api/v1/statuses/reactions_controller.rb
+++ b/app/controllers/api/v1/statuses/reactions_controller.rb
@@ -8,12 +8,12 @@ class Api::V1::Statuses::ReactionsController < Api::BaseController
   before_action :set_reaction, except: :update
 
   def update
-    StatusReactionService.new.call(current_account, @status, params[:id])
+    ReactService.new.call(current_account, @status, params[:id])
     render_empty
   end
 
   def destroy
-    StatusUnreactionService.new.call(current_account, @status)
+    UnreactService.new.call(current_account, @status)
     render_empty
   end
 
diff --git a/app/serializers/activitypub/emoji_reaction_serializer.rb b/app/serializers/activitypub/emoji_reaction_serializer.rb
index b4111150a..50f3efa3c 100644
--- a/app/serializers/activitypub/emoji_reaction_serializer.rb
+++ b/app/serializers/activitypub/emoji_reaction_serializer.rb
@@ -30,7 +30,5 @@ class ActivityPub::EmojiReactionSerializer < ActivityPub::Serializer
     end
   end
 
-  def reaction
-    content
-  end
+  alias reaction content
 end
diff --git a/app/services/status_reaction_service.rb b/app/services/react_service.rb
similarity index 95%
rename from app/services/status_reaction_service.rb
rename to app/services/react_service.rb
index 9451690dd..773dd3fd6 100644
--- a/app/services/status_reaction_service.rb
+++ b/app/services/react_service.rb
@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
-class StatusReactionService < BaseService
+class ReactService < BaseService
   include Authorization
   include Payloadable
 
diff --git a/app/services/status_unreaction_service.rb b/app/services/unreact_service.rb
similarity index 92%
rename from app/services/status_unreaction_service.rb
rename to app/services/unreact_service.rb
index 13c3c428d..ebc270383 100644
--- a/app/services/status_unreaction_service.rb
+++ b/app/services/unreact_service.rb
@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
-class StatusUnreactionService < BaseService
+class UnreactService < BaseService
   include Payloadable
 
   def call(account, status)

From b82984f0b536eda8999dcf56ea280c1851a86f2e Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Tue, 29 Nov 2022 08:54:35 +0000
Subject: [PATCH 13/47] cleanup frontend emoji reaction code

---
 .../flavours/glitch/actions/interactions.js   | 54 +++++++++----------
 .../flavours/glitch/components/status.js      |  4 +-
 .../glitch/components/status_action_bar.js    |  1 +
 ...s_reactions_bar.js => status_reactions.js} |  2 +-
 .../glitch/containers/status_container.js     | 12 ++---
 .../features/status/components/action_bar.js  |  2 +-
 .../status/components/detailed_status.js      |  4 +-
 .../flavours/glitch/features/status/index.js  | 17 +++---
 .../flavours/glitch/reducers/statuses.js      | 20 +++----
 .../flavours/glitch/selectors/index.js        | 10 +++-
 .../flavours/glitch/utils/emoji_map.js        | 11 ----
 11 files changed, 65 insertions(+), 72 deletions(-)
 rename app/javascript/flavours/glitch/components/{status_reactions_bar.js => status_reactions.js} (98%)
 delete mode 100644 app/javascript/flavours/glitch/utils/emoji_map.js

diff --git a/app/javascript/flavours/glitch/actions/interactions.js b/app/javascript/flavours/glitch/actions/interactions.js
index ab275621c..f65d7ec49 100644
--- a/app/javascript/flavours/glitch/actions/interactions.js
+++ b/app/javascript/flavours/glitch/actions/interactions.js
@@ -41,15 +41,15 @@ export const UNBOOKMARK_REQUEST = 'UNBOOKMARKED_REQUEST';
 export const UNBOOKMARK_SUCCESS = 'UNBOOKMARKED_SUCCESS';
 export const UNBOOKMARK_FAIL    = 'UNBOOKMARKED_FAIL';
 
-export const STATUS_REACTION_UPDATE = 'STATUS_REACTION_UPDATE';
+export const REACTION_UPDATE = 'REACTION_UPDATE';
 
-export const STATUS_REACTION_ADD_REQUEST = 'STATUS_REACTION_ADD_REQUEST';
-export const STATUS_REACTION_ADD_SUCCESS = 'STATUS_REACTION_ADD_SUCCESS';
-export const STATUS_REACTION_ADD_FAIL    = 'STATUS_REACTION_ADD_FAIL';
+export const REACTION_ADD_REQUEST = 'REACTION_ADD_REQUEST';
+export const REACTION_ADD_SUCCESS = 'REACTION_ADD_SUCCESS';
+export const REACTION_ADD_FAIL    = 'REACTION_ADD_FAIL';
 
-export const STATUS_REACTION_REMOVE_REQUEST = 'STATUS_REACTION_REMOVE_REQUEST';
-export const STATUS_REACTION_REMOVE_SUCCESS = 'STATUS_REACTION_REMOVE_SUCCESS';
-export const STATUS_REACTION_REMOVE_FAIL    = 'STATUS_REACTION_REMOVE_FAIL';
+export const REACTION_REMOVE_REQUEST = 'REACTION_REMOVE_REQUEST';
+export const REACTION_REMOVE_SUCCESS = 'REACTION_REMOVE_SUCCESS';
+export const REACTION_REMOVE_FAIL    = 'REACTION_REMOVE_FAIL';
 
 export function reblog(status, visibility) {
   return function (dispatch, getState) {
@@ -403,7 +403,7 @@ export function unpinFail(status, error) {
   };
 };
 
-export const statusAddReaction = (statusId, name) => (dispatch, getState) => {
+export const addReaction = (statusId, name) => (dispatch, getState) => {
   const status = getState().get('statuses').get(statusId);
   let alreadyAdded = false;
   if (status) {
@@ -413,66 +413,66 @@ export const statusAddReaction = (statusId, name) => (dispatch, getState) => {
     }
   }
   if (!alreadyAdded) {
-    dispatch(statusAddReactionRequest(statusId, name, alreadyAdded));
+    dispatch(addReactionRequest(statusId, name, alreadyAdded));
   }
 
   api(getState).put(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
-    dispatch(statusAddReactionSuccess(statusId, name, alreadyAdded));
+    dispatch(addReactionSuccess(statusId, name, alreadyAdded));
   }).catch(err => {
     if (!alreadyAdded) {
-      dispatch(statusAddReactionFail(statusId, name, err));
+      dispatch(addReactionFail(statusId, name, err));
     }
   });
 };
 
-export const statusAddReactionRequest = (statusId, name) => ({
-  type: STATUS_REACTION_ADD_REQUEST,
+export const addReactionRequest = (statusId, name) => ({
+  type: REACTION_ADD_REQUEST,
   id: statusId,
   name,
   skipLoading: true,
 });
 
-export const statusAddReactionSuccess = (statusId, name) => ({
-  type: STATUS_REACTION_ADD_SUCCESS,
+export const addReactionSuccess = (statusId, name) => ({
+  type: REACTION_ADD_SUCCESS,
   id: statusId,
   name,
   skipLoading: true,
 });
 
-export const statusAddReactionFail = (statusId, name, error) => ({
-  type: STATUS_REACTION_ADD_FAIL,
+export const addReactionFail = (statusId, name, error) => ({
+  type: REACTION_ADD_FAIL,
   id: statusId,
   name,
   error,
   skipLoading: true,
 });
 
-export const statusRemoveReaction = (statusId, name) => (dispatch, getState) => {
-  dispatch(statusRemoveReactionRequest(statusId, name));
+export const removeReaction = (statusId, name) => (dispatch, getState) => {
+  dispatch(removeReactionRequest(statusId, name));
 
   api(getState).delete(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
-    dispatch(statusRemoveReactionSuccess(statusId, name));
+    dispatch(removeReactionSuccess(statusId, name));
   }).catch(err => {
-    dispatch(statusRemoveReactionFail(statusId, name, err));
+    dispatch(removeReactionFail(statusId, name, err));
   });
 };
 
-export const statusRemoveReactionRequest = (statusId, name) => ({
-  type: STATUS_REACTION_REMOVE_REQUEST,
+export const removeReactionRequest = (statusId, name) => ({
+  type: REACTION_REMOVE_REQUEST,
   id: statusId,
   name,
   skipLoading: true,
 });
 
-export const statusRemoveReactionSuccess = (statusId, name) => ({
-  type: STATUS_REACTION_REMOVE_SUCCESS,
+export const removeReactionSuccess = (statusId, name) => ({
+  type: REACTION_REMOVE_SUCCESS,
   id: statusId,
   name,
   skipLoading: true,
 });
 
-export const statusRemoveReactionFail = (statusId, name) => ({
-  type: STATUS_REACTION_REMOVE_FAIL,
+export const removeReactionFail = (statusId, name) => ({
+  type: REACTION_REMOVE_FAIL,
   id: statusId,
   name,
   skipLoading: true,
diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js
index 05fecdb96..70c1a9991 100644
--- a/app/javascript/flavours/glitch/components/status.js
+++ b/app/javascript/flavours/glitch/components/status.js
@@ -6,7 +6,7 @@ import StatusHeader from './status_header';
 import StatusIcons from './status_icons';
 import StatusContent from './status_content';
 import StatusActionBar from './status_action_bar';
-import StatusReactionsBar from './status_reactions_bar';
+import StatusReactions from './status_reactions';
 import AttachmentList from './attachment_list';
 import Card from '../features/status/components/card';
 import { injectIntl, FormattedMessage } from 'react-intl';
@@ -805,7 +805,7 @@ class Status extends ImmutablePureComponent {
             rewriteMentions={settings.get('rewrite_mentions')}
           />
 
-          <StatusReactionsBar
+          <StatusReactions
             statusId={status.get('id')}
             reactions={status.get('reactions')}
             addReaction={this.props.onReactionAdd}
diff --git a/app/javascript/flavours/glitch/components/status_action_bar.js b/app/javascript/flavours/glitch/components/status_action_bar.js
index 04ca06ffe..44e5c770d 100644
--- a/app/javascript/flavours/glitch/components/status_action_bar.js
+++ b/app/javascript/flavours/glitch/components/status_action_bar.js
@@ -59,6 +59,7 @@ class StatusActionBar extends ImmutablePureComponent {
     status: ImmutablePropTypes.map.isRequired,
     onReply: PropTypes.func,
     onFavourite: PropTypes.func,
+    onReactionAdd: PropTypes.func,
     onReblog: PropTypes.func,
     onDelete: PropTypes.func,
     onDirect: PropTypes.func,
diff --git a/app/javascript/flavours/glitch/components/status_reactions_bar.js b/app/javascript/flavours/glitch/components/status_reactions.js
similarity index 98%
rename from app/javascript/flavours/glitch/components/status_reactions_bar.js
rename to app/javascript/flavours/glitch/components/status_reactions.js
index 912e1b1ba..c0ad827fc 100644
--- a/app/javascript/flavours/glitch/components/status_reactions_bar.js
+++ b/app/javascript/flavours/glitch/components/status_reactions.js
@@ -11,7 +11,7 @@ import AnimatedNumber from './animated_number';
 import { assetHost } from '../utils/config';
 import { autoPlayGif } from '../initial_state';
 
-export default class StatusReactionsBar extends ImmutablePureComponent {
+export default class StatusReactions extends ImmutablePureComponent {
 
   static propTypes = {
     statusId: PropTypes.string.isRequired,
diff --git a/app/javascript/flavours/glitch/containers/status_container.js b/app/javascript/flavours/glitch/containers/status_container.js
index 381276d9d..c2fd15b17 100644
--- a/app/javascript/flavours/glitch/containers/status_container.js
+++ b/app/javascript/flavours/glitch/containers/status_container.js
@@ -15,8 +15,8 @@ import {
   unbookmark,
   pin,
   unpin,
-  statusAddReaction,
-  statusRemoveReaction,
+  addReaction,
+  removeReaction,
 } from 'flavours/glitch/actions/interactions';
 import {
   muteStatus,
@@ -45,7 +45,7 @@ import { showAlertForError } from '../actions/alerts';
 import AccountContainer from 'flavours/glitch/containers/account_container';
 import Spoilers from '../components/spoilers';
 import Icon from 'flavours/glitch/components/icon';
-import buildCustomEmojiMap from '../utils/emoji_map';
+import { makeCustomEmojiMap } from '../selectors';
 
 const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@@ -85,7 +85,7 @@ const makeMapStateToProps = () => {
       account: account || props.account,
       settings: state.get('local_settings'),
       prepend: prepend || props.prepend,
-      emojiMap: buildCustomEmojiMap(state),
+      emojiMap: makeCustomEmojiMap(state),
 
       pictureInPicture: {
         inUse: state.getIn(['meta', 'layout']) !== 'mobile' && state.get('picture_in_picture').statusId === props.id,
@@ -170,11 +170,11 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
   },
 
   onReactionAdd (statusId, name) {
-    dispatch(statusAddReaction(statusId, name));
+    dispatch(addReaction(statusId, name));
   },
 
   onReactionRemove (statusId, name) {
-    dispatch(statusRemoveReaction(statusId, name));
+    dispatch(removeReaction(statusId, name));
   },
 
   onEmbed (status) {
diff --git a/app/javascript/flavours/glitch/features/status/components/action_bar.js b/app/javascript/flavours/glitch/features/status/components/action_bar.js
index bd8c0d0cf..f93e3d0a3 100644
--- a/app/javascript/flavours/glitch/features/status/components/action_bar.js
+++ b/app/javascript/flavours/glitch/features/status/components/action_bar.js
@@ -144,7 +144,7 @@ class ActionBar extends React.PureComponent {
     navigator.clipboard.writeText(url);
   }
 
-  nop = () => {}
+  nop = () => {} // hack for reaction add button
 
   render () {
     const { status, intl } = this.props;
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.js b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
index b2f38ff1f..68e199e9c 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.js
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
@@ -20,7 +20,7 @@ import Icon from 'flavours/glitch/components/icon';
 import AnimatedNumber from 'flavours/glitch/components/animated_number';
 import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder';
 import EditedTimestamp from 'flavours/glitch/components/edited_timestamp';
-import StatusReactionsBar from '../../../components/status_reactions_bar';
+import StatusReactions from '../../../components/status_reactions';
 
 export default @injectIntl
 class DetailedStatus extends ImmutablePureComponent {
@@ -323,7 +323,7 @@ class DetailedStatus extends ImmutablePureComponent {
             disabled
           />
 
-          <StatusReactionsBar
+          <StatusReactions
             statusId={status.get('id')}
             reactions={status.get('reactions')}
             addReaction={this.props.onReactionAdd}
diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js
index 73f6c1956..3d0c503e7 100644
--- a/app/javascript/flavours/glitch/features/status/index.js
+++ b/app/javascript/flavours/glitch/features/status/index.js
@@ -20,8 +20,8 @@ import {
   unreblog,
   pin,
   unpin,
-  statusAddReaction,
-  statusRemoveReaction,
+  addReaction,
+  removeReaction,
 } from 'flavours/glitch/actions/interactions';
 import {
   replyCompose,
@@ -58,7 +58,7 @@ import { autoUnfoldCW } from 'flavours/glitch/utils/content_warning';
 import { textForScreenReader, defaultMediaVisibility } from 'flavours/glitch/components/status';
 import Icon from 'flavours/glitch/components/icon';
 import { Helmet } from 'react-helmet';
-import buildCustomEmojiMap from '../../utils/emoji_map';
+import { makeCustomEmojiMap } from '../../selectors';
 
 const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@@ -149,7 +149,7 @@ const makeMapStateToProps = () => {
       askReplyConfirmation: state.getIn(['local_settings', 'confirm_before_clearing_draft']) && state.getIn(['compose', 'text']).trim().length !== 0,
       domain: state.getIn(['meta', 'domain']),
       usingPiP: state.get('picture_in_picture').statusId === props.params.statusId,
-      emojiMap: buildCustomEmojiMap(state),
+      emojiMap: makeCustomEmojiMap(state),
     };
   };
 
@@ -300,7 +300,7 @@ class Status extends ImmutablePureComponent {
     const { signedIn } = this.context.identity;
 
     if (signedIn) {
-      dispatch(statusAddReaction(statusId, name));
+      dispatch(addReaction(statusId, name));
     } else {
       dispatch(openModal('INTERACTION', {
         type: 'reaction_add',
@@ -311,12 +311,7 @@ class Status extends ImmutablePureComponent {
   }
 
   handleReactionRemove = (statusId, name) => {
-    const { dispatch } = this.props;
-    const { signedIn } = this.context.identity;
-
-    if (signedIn) {
-      dispatch(statusRemoveReaction(statusId, name));
-    }
+    this.props.dispatch(removeReaction(statusId, name));
   }
 
   handlePin = (status) => {
diff --git a/app/javascript/flavours/glitch/reducers/statuses.js b/app/javascript/flavours/glitch/reducers/statuses.js
index 605238bc2..22fdeb284 100644
--- a/app/javascript/flavours/glitch/reducers/statuses.js
+++ b/app/javascript/flavours/glitch/reducers/statuses.js
@@ -6,11 +6,11 @@ import {
   UNFAVOURITE_SUCCESS,
   BOOKMARK_REQUEST,
   BOOKMARK_FAIL,
-  STATUS_REACTION_UPDATE,
-  STATUS_REACTION_ADD_FAIL,
-  STATUS_REACTION_REMOVE_FAIL,
-  STATUS_REACTION_ADD_REQUEST,
-  STATUS_REACTION_REMOVE_REQUEST,
+  REACTION_UPDATE,
+  REACTION_ADD_FAIL,
+  REACTION_REMOVE_FAIL,
+  REACTION_ADD_REQUEST,
+  REACTION_REMOVE_REQUEST,
 } from 'flavours/glitch/actions/interactions';
 import {
   STATUS_MUTE_SUCCESS,
@@ -99,13 +99,13 @@ export default function statuses(state = initialState, action) {
     return state.setIn([action.status.get('id'), 'reblogged'], true);
   case REBLOG_FAIL:
     return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'reblogged'], false);
-  case STATUS_REACTION_UPDATE:
+  case REACTION_UPDATE:
     return updateReactionCount(state, action.reaction);
-  case STATUS_REACTION_ADD_REQUEST:
-  case STATUS_REACTION_REMOVE_FAIL:
+  case REACTION_ADD_REQUEST:
+  case REACTION_REMOVE_FAIL:
     return addReaction(state, action.id, action.name);
-  case STATUS_REACTION_REMOVE_REQUEST:
-  case STATUS_REACTION_ADD_FAIL:
+  case REACTION_REMOVE_REQUEST:
+  case REACTION_ADD_FAIL:
     return removeReaction(state, action.id, action.name);
   case STATUS_MUTE_SUCCESS:
     return state.setIn([action.id, 'muted'], true);
diff --git a/app/javascript/flavours/glitch/selectors/index.js b/app/javascript/flavours/glitch/selectors/index.js
index df46b58a8..ab7ac248b 100644
--- a/app/javascript/flavours/glitch/selectors/index.js
+++ b/app/javascript/flavours/glitch/selectors/index.js
@@ -1,6 +1,6 @@
 import escapeTextContentForBrowser from 'escape-html';
 import { createSelector } from 'reselect';
-import { List as ImmutableList } from 'immutable';
+import { List as ImmutableList, Map as ImmutableMap } from 'immutable';
 import { toServerSideType } from 'flavours/glitch/utils/filters';
 import { me } from 'flavours/glitch/initial_state';
 
@@ -127,3 +127,11 @@ export const getAccountHidden = createSelector([
 ], (hidden, followingOrRequested, isSelf) => {
   return hidden && !(isSelf || followingOrRequested);
 });
+
+export const makeCustomEmojiMap = createSelector(
+  [state => state.get('custom_emojis')],
+  items => items.reduce(
+    (map, emoji) => map.set(emoji.get('shortcode'), emoji),
+    ImmutableMap(),
+  ),
+);
diff --git a/app/javascript/flavours/glitch/utils/emoji_map.js b/app/javascript/flavours/glitch/utils/emoji_map.js
deleted file mode 100644
index 1bf36d0fd..000000000
--- a/app/javascript/flavours/glitch/utils/emoji_map.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { createSelector } from 'reselect';
-import { Map as ImmutableMap } from 'immutable';
-
-const buildCustomEmojiMap = createSelector(
-  [state => state.get('custom_emojis')],
-  items => items.reduce(
-    (map, emoji) => map.set(emoji.get('shortcode'), emoji),
-    ImmutableMap(),
-  ),
-);
-export default buildCustomEmojiMap;

From fd885bec485825532f983d688142ada3bf20a4bd Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Tue, 29 Nov 2022 09:07:10 +0000
Subject: [PATCH 14/47] fix reaction margins and paddings

---
 .../flavours/glitch/styles/components/status.scss    | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss
index 7c783ae75..c746a0bb1 100644
--- a/app/javascript/flavours/glitch/styles/components/status.scss
+++ b/app/javascript/flavours/glitch/styles/components/status.scss
@@ -430,6 +430,10 @@
   .notification__message {
     margin: -10px 0px 10px 0;
   }
+
+  .reactions-bar--empty {
+    margin-top: 0;
+  }
 }
 
 .notification-favourite {
@@ -587,6 +591,10 @@
   &.icon-button--with-counter {
     margin-right: 14px;
   }
+
+  .fa-plus {
+    padding-top: 1px;
+  }
 }
 
 .status__action-bar-dropdown {
@@ -649,6 +657,10 @@
   display: flex;
   flex-direction: row;
   padding: 10px 0;
+
+  .fa-plus {
+    padding-top: 2px;
+  }
 }
 
 .detailed-status__link {

From e247dd17edee430d2e5175f19398774d98de1a20 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 30 Nov 2022 09:06:14 +0000
Subject: [PATCH 15/47] limit number of reactions displayed

Too many reactions on a single post quickly get
spammy, so they are now sorted by count and only
the first MAX_REACTIONS number of different
emojis are actually displayed.
---
 .../flavours/glitch/components/status_reactions.js         | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/app/javascript/flavours/glitch/components/status_reactions.js b/app/javascript/flavours/glitch/components/status_reactions.js
index c0ad827fc..cc85a0189 100644
--- a/app/javascript/flavours/glitch/components/status_reactions.js
+++ b/app/javascript/flavours/glitch/components/status_reactions.js
@@ -1,7 +1,7 @@
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
-import { reduceMotion } from '../initial_state';
+import { maxReactions, reduceMotion } from '../initial_state';
 import spring from 'react-motion/lib/spring';
 import TransitionMotion from 'react-motion/lib/TransitionMotion';
 import classNames from 'classnames';
@@ -36,7 +36,10 @@ export default class StatusReactions extends ImmutablePureComponent {
 
   render() {
     const { reactions } = this.props;
-    const visibleReactions = reactions.filter(x => x.get('count') > 0);
+    const visibleReactions = reactions
+      .filter(x => x.get('count') > 0)
+      .sort((a, b) => b.get('count') - a.get('count'))
+      .filter((_, i) => i < maxReactions);
 
     const styles = visibleReactions.map(reaction => ({
       key: reaction.get('name'),

From f535ddc445af4aa329843d549d196e9b71451803 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 30 Nov 2022 12:01:34 +0000
Subject: [PATCH 16/47] change default reaction limit to 1

---
 app/validators/status_reaction_validator.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/validators/status_reaction_validator.rb b/app/validators/status_reaction_validator.rb
index fa6fb2e76..a60271dd8 100644
--- a/app/validators/status_reaction_validator.rb
+++ b/app/validators/status_reaction_validator.rb
@@ -3,7 +3,7 @@
 class StatusReactionValidator < ActiveModel::Validator
   SUPPORTED_EMOJIS = Oj.load_file(Rails.root.join('app', 'javascript', 'mastodon', 'features', 'emoji', 'emoji_map.json').to_s).keys.freeze
 
-  LIMIT = [1, (ENV['MAX_REACTIONS'] || 8).to_i].max
+  LIMIT = [1, (ENV['MAX_REACTIONS'] || 1).to_i].max
 
   def validate(reaction)
     return if reaction.name.blank?

From 6d2ad83c028feec2a4c220a96b8ee91ba9aa2f4f Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 30 Nov 2022 13:20:20 +0000
Subject: [PATCH 17/47] make number of displayed reactions a setting

This adds an extra item to the local settings for
specifying the number of reactions shown in toots.
The detailed status view always shows all
reactions.
---
 .env.production.sample                        |  2 +-
 .../flavours/glitch/components/status.js      |  1 +
 .../glitch/components/status_reactions.js     | 23 +++++++++++--------
 .../features/local_settings/page/index.js     | 12 ++++++++++
 .../local_settings/page/item/index.js         | 11 +++++----
 app/javascript/flavours/glitch/locales/de.js  |  3 +++
 app/javascript/flavours/glitch/locales/en.js  |  2 ++
 app/javascript/flavours/glitch/locales/fr.js  |  3 +++
 .../glitch/reducers/local_settings.js         |  1 +
 9 files changed, 42 insertions(+), 16 deletions(-)

diff --git a/.env.production.sample b/.env.production.sample
index 9eb02287e..ae5d6c368 100644
--- a/.env.production.sample
+++ b/.env.production.sample
@@ -270,7 +270,7 @@ MAX_POLL_OPTIONS=5
 MAX_POLL_OPTION_CHARS=100
 
 # Maximum number of emoji reactions per toot and user (minimum 1)
-MAX_REACTIONS=8
+MAX_REACTIONS=1
 
 # Maximum image and video/audio upload sizes
 # Units are in bytes
diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js
index 70c1a9991..04145a384 100644
--- a/app/javascript/flavours/glitch/components/status.js
+++ b/app/javascript/flavours/glitch/components/status.js
@@ -808,6 +808,7 @@ class Status extends ImmutablePureComponent {
           <StatusReactions
             statusId={status.get('id')}
             reactions={status.get('reactions')}
+            numVisible={settings.get('num_visible_reactions')}
             addReaction={this.props.onReactionAdd}
             removeReaction={this.props.onReactionRemove}
             emojiMap={this.props.emojiMap}
diff --git a/app/javascript/flavours/glitch/components/status_reactions.js b/app/javascript/flavours/glitch/components/status_reactions.js
index cc85a0189..39956270a 100644
--- a/app/javascript/flavours/glitch/components/status_reactions.js
+++ b/app/javascript/flavours/glitch/components/status_reactions.js
@@ -1,7 +1,7 @@
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
-import { maxReactions, reduceMotion } from '../initial_state';
+import { reduceMotion } from '../initial_state';
 import spring from 'react-motion/lib/spring';
 import TransitionMotion from 'react-motion/lib/TransitionMotion';
 import classNames from 'classnames';
@@ -16,16 +16,12 @@ export default class StatusReactions extends ImmutablePureComponent {
   static propTypes = {
     statusId: PropTypes.string.isRequired,
     reactions: ImmutablePropTypes.list.isRequired,
+    numVisible: PropTypes.number,
     addReaction: PropTypes.func.isRequired,
     removeReaction: PropTypes.func.isRequired,
     emojiMap: ImmutablePropTypes.map.isRequired,
   };
 
-  handleEmojiPick = data => {
-    const { addReaction, statusId } = this.props;
-    addReaction(statusId, data.native.replace(/:/g, ''));
-  }
-
   willEnter() {
     return { scale: reduceMotion ? 1 : 0 };
   }
@@ -35,11 +31,18 @@ export default class StatusReactions extends ImmutablePureComponent {
   }
 
   render() {
-    const { reactions } = this.props;
-    const visibleReactions = reactions
+    const { reactions, numVisible } = this.props;
+    let visibleReactions = reactions
       .filter(x => x.get('count') > 0)
-      .sort((a, b) => b.get('count') - a.get('count'))
-      .filter((_, i) => i < maxReactions);
+      .sort((a, b) => b.get('count') - a.get('count'));
+
+    // numVisible might be NaN because it's pulled from local settings
+    // which doesn't do a whole lot of input validation, but that's okay
+    // because  NaN >= 0  evaluates false.
+    // Still, this should be improved at some point.
+    if (numVisible >= 0) {
+      visibleReactions = visibleReactions.filter((_, i) => i < numVisible);
+    }
 
     const styles = visibleReactions.map(reaction => ({
       key: reaction.get('name'),
diff --git a/app/javascript/flavours/glitch/features/local_settings/page/index.js b/app/javascript/flavours/glitch/features/local_settings/page/index.js
index d01eec811..e88e50b67 100644
--- a/app/javascript/flavours/glitch/features/local_settings/page/index.js
+++ b/app/javascript/flavours/glitch/features/local_settings/page/index.js
@@ -29,6 +29,8 @@ const messages = defineMessages({
   rewrite_mentions_username: { id: 'settings.rewrite_mentions_username', defaultMessage:  'Rewrite with username' },
   pop_in_left: { id: 'settings.pop_in_left', defaultMessage: 'Left' },
   pop_in_right: { id: 'settings.pop_in_right', defaultMessage:  'Right' },
+  visible_reactions_count: { id: 'settings.visible_reactions_count', defaultMessage: 'Number of visible reactions' },
+  enter_amount_prompt: { id: 'settings.enter_amount_prompt', defaultMessage: 'Enter an amount' },
 });
 
 export default @injectIntl
@@ -92,6 +94,16 @@ class LocalSettingsPage extends React.PureComponent {
         >
           <FormattedMessage id='settings.rewrite_mentions' defaultMessage='Rewrite mentions in displayed statuses' />
         </LocalSettingsPageItem>
+        <LocalSettingsPageItem
+          settings={settings}
+          item={['num_visible_reactions']}
+          id='mastodon-settings--num_visible_reactions'
+          onChange={onChange}
+          placeholder={intl.formatMessage(messages.enter_amount_prompt)}
+          number
+        >
+          <FormattedMessage id='settings.num_visible_reactions' defaultMessage='Number of visible reaction badges:' />
+        </LocalSettingsPageItem>
         <section>
           <h2><FormattedMessage id='settings.notifications_opts' defaultMessage='Notifications options' /></h2>
           <LocalSettingsPageItem
diff --git a/app/javascript/flavours/glitch/features/local_settings/page/item/index.js b/app/javascript/flavours/glitch/features/local_settings/page/item/index.js
index 6b24e4143..966fc5c1e 100644
--- a/app/javascript/flavours/glitch/features/local_settings/page/item/index.js
+++ b/app/javascript/flavours/glitch/features/local_settings/page/item/index.js
@@ -21,20 +21,21 @@ export default class LocalSettingsPageItem extends React.PureComponent {
     })),
     settings: ImmutablePropTypes.map.isRequired,
     placeholder: PropTypes.string,
+    number: PropTypes.bool,
     disabled: PropTypes.bool,
   };
 
   handleChange = e => {
     const { target } = e;
-    const { item, onChange, options, placeholder } = this.props;
+    const { item, onChange, options, placeholder, number } = this.props;
     if (options && options.length > 0) onChange(item, target.value);
-    else if (placeholder) onChange(item, target.value);
+    else if (placeholder) onChange(item, number ? parseInt(target.value) : target.value);
     else onChange(item, target.checked);
   }
 
   render () {
     const { handleChange } = this;
-    const { settings, item, id, options, children, dependsOn, dependsOnNot, placeholder, disabled } = this.props;
+    const { settings, item, id, options, children, dependsOn, dependsOnNot, placeholder, number, disabled } = this.props;
     let enabled = !disabled;
 
     if (dependsOn) {
@@ -76,7 +77,7 @@ export default class LocalSettingsPageItem extends React.PureComponent {
           </fieldset>
         </div>
       );
-    } else if (placeholder) {
+    } else if (placeholder || number) {
       return (
         <div className='glitch local-settings__page__item string'>
           <label htmlFor={id}>
@@ -84,7 +85,7 @@ export default class LocalSettingsPageItem extends React.PureComponent {
             <p>
               <input
                 id={id}
-                type='text'
+                type={number ? 'number' : 'text'}
                 value={settings.getIn(item)}
                 placeholder={placeholder}
                 onChange={handleChange}
diff --git a/app/javascript/flavours/glitch/locales/de.js b/app/javascript/flavours/glitch/locales/de.js
index a4daa5949..18eb398d8 100644
--- a/app/javascript/flavours/glitch/locales/de.js
+++ b/app/javascript/flavours/glitch/locales/de.js
@@ -6,6 +6,9 @@ const messages = {
 
   'tooltips.reactions': 'Reaktionen',
 
+  'settings.enter_amount_prompt': 'Gib eine Zahl ein',
+  'settings.num_visible_reactions': 'Anzahl sichtbarer Reaktionen',
+
   'status.react': 'Reagieren',
 };
 
diff --git a/app/javascript/flavours/glitch/locales/en.js b/app/javascript/flavours/glitch/locales/en.js
index 7065cbe26..634b7e2a0 100644
--- a/app/javascript/flavours/glitch/locales/en.js
+++ b/app/javascript/flavours/glitch/locales/en.js
@@ -22,6 +22,7 @@ const messages = {
   'settings.close': 'Close',
   'settings.collapsed_statuses': 'Collapsed toots',
   'settings.enable_collapsed': 'Enable collapsed toots',
+  'settings.enter_amount_prompt': 'Enter an amount',
   'settings.general': 'General',
   'settings.image_backgrounds': 'Image backgrounds',
   'settings.image_backgrounds_media': 'Preview collapsed toot media',
@@ -29,6 +30,7 @@ const messages = {
   'settings.media': 'Media',
   'settings.media_letterbox': 'Letterbox media',
   'settings.media_fullwidth': 'Full-width media previews',
+  'settings.num_visible_reactions': 'Number of visible reactions',
   'settings.preferences': 'User preferences',
   'settings.wide_view': 'Wide view (Desktop mode only)',
   'settings.navbar_under': 'Navbar at the bottom (Mobile only)',
diff --git a/app/javascript/flavours/glitch/locales/fr.js b/app/javascript/flavours/glitch/locales/fr.js
index 3ebe055e0..802c71896 100644
--- a/app/javascript/flavours/glitch/locales/fr.js
+++ b/app/javascript/flavours/glitch/locales/fr.js
@@ -6,6 +6,9 @@ const messages = {
 
   'tooltips.reactions': 'Réactions',
 
+  'settings.enter_amount_prompt': 'Entrez un montant',
+  'settings.num_visible_reactions': 'Nombre de réactions visibles',
+
   'status.react': 'Réagir',
 };
 
diff --git a/app/javascript/flavours/glitch/reducers/local_settings.js b/app/javascript/flavours/glitch/reducers/local_settings.js
index 81ab1cb0d..9a5e02206 100644
--- a/app/javascript/flavours/glitch/reducers/local_settings.js
+++ b/app/javascript/flavours/glitch/reducers/local_settings.js
@@ -23,6 +23,7 @@ const initialState = ImmutableMap({
   show_content_type_choice: false,
   tag_misleading_links: true,
   rewrite_mentions: 'no',
+  num_visible_reactions: 6,
   content_warnings : ImmutableMap({
     filter       : null,
     media_outside: false,

From be0bf21f3b18fcbcfc0e3d7a1285d005b09e8428 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 30 Nov 2022 14:59:37 +0000
Subject: [PATCH 18/47] make number of visible reactions a vanilla setting

Reactions will be backported to the vanilla
flavour, which requires all related settings to
be accessible from the vanilla settings page
rather than the glitch specific settings modal.
---
 app/controllers/settings/preferences_controller.rb    |  1 +
 app/javascript/flavours/glitch/components/status.js   |  4 ++--
 .../glitch/features/local_settings/page/index.js      | 11 -----------
 app/javascript/flavours/glitch/initial_state.js       |  5 ++---
 app/javascript/flavours/glitch/locales/de.js          |  3 ---
 app/javascript/flavours/glitch/locales/en.js          |  2 --
 app/javascript/flavours/glitch/locales/fr.js          |  3 ---
 .../flavours/glitch/reducers/local_settings.js        |  1 -
 app/lib/user_settings_decorator.rb                    |  9 +++++++++
 app/models/user.rb                                    |  2 +-
 app/serializers/initial_state_serializer.rb           |  1 +
 .../settings/preferences/appearance/show.html.haml    |  3 +++
 config/locales/simple_form.de.yml                     |  1 +
 config/locales/simple_form.en.yml                     |  1 +
 config/locales/simple_form.fr.yml                     |  1 +
 config/settings.yml                                   |  1 +
 16 files changed, 23 insertions(+), 26 deletions(-)

diff --git a/app/controllers/settings/preferences_controller.rb b/app/controllers/settings/preferences_controller.rb
index 4c1336436..39715b724 100644
--- a/app/controllers/settings/preferences_controller.rb
+++ b/app/controllers/settings/preferences_controller.rb
@@ -57,6 +57,7 @@ class Settings::PreferencesController < Settings::BaseController
       :setting_use_pending_items,
       :setting_trends,
       :setting_crop_images,
+      :setting_visible_reactions,
       :setting_always_send_emails,
       notification_emails: %i(follow follow_request reblog favourite mention report pending_account trending_tag trending_link trending_status appeal),
       interactions: %i(must_be_follower must_be_following must_be_following_dm)
diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js
index 04145a384..3ef5f453f 100644
--- a/app/javascript/flavours/glitch/components/status.js
+++ b/app/javascript/flavours/glitch/components/status.js
@@ -17,7 +17,7 @@ import NotificationOverlayContainer from 'flavours/glitch/features/notifications
 import classNames from 'classnames';
 import { autoUnfoldCW } from 'flavours/glitch/utils/content_warning';
 import PollContainer from 'flavours/glitch/containers/poll_container';
-import { displayMedia } from 'flavours/glitch/initial_state';
+import { displayMedia, visibleReactions } from 'flavours/glitch/initial_state';
 import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder';
 
 // We use the component (and not the container) since we do not want
@@ -808,7 +808,7 @@ class Status extends ImmutablePureComponent {
           <StatusReactions
             statusId={status.get('id')}
             reactions={status.get('reactions')}
-            numVisible={settings.get('num_visible_reactions')}
+            numVisible={visibleReactions}
             addReaction={this.props.onReactionAdd}
             removeReaction={this.props.onReactionRemove}
             emojiMap={this.props.emojiMap}
diff --git a/app/javascript/flavours/glitch/features/local_settings/page/index.js b/app/javascript/flavours/glitch/features/local_settings/page/index.js
index e88e50b67..cc8e1f8f2 100644
--- a/app/javascript/flavours/glitch/features/local_settings/page/index.js
+++ b/app/javascript/flavours/glitch/features/local_settings/page/index.js
@@ -29,7 +29,6 @@ const messages = defineMessages({
   rewrite_mentions_username: { id: 'settings.rewrite_mentions_username', defaultMessage:  'Rewrite with username' },
   pop_in_left: { id: 'settings.pop_in_left', defaultMessage: 'Left' },
   pop_in_right: { id: 'settings.pop_in_right', defaultMessage:  'Right' },
-  visible_reactions_count: { id: 'settings.visible_reactions_count', defaultMessage: 'Number of visible reactions' },
   enter_amount_prompt: { id: 'settings.enter_amount_prompt', defaultMessage: 'Enter an amount' },
 });
 
@@ -94,16 +93,6 @@ class LocalSettingsPage extends React.PureComponent {
         >
           <FormattedMessage id='settings.rewrite_mentions' defaultMessage='Rewrite mentions in displayed statuses' />
         </LocalSettingsPageItem>
-        <LocalSettingsPageItem
-          settings={settings}
-          item={['num_visible_reactions']}
-          id='mastodon-settings--num_visible_reactions'
-          onChange={onChange}
-          placeholder={intl.formatMessage(messages.enter_amount_prompt)}
-          number
-        >
-          <FormattedMessage id='settings.num_visible_reactions' defaultMessage='Number of visible reaction badges:' />
-        </LocalSettingsPageItem>
         <section>
           <h2><FormattedMessage id='settings.notifications_opts' defaultMessage='Notifications options' /></h2>
           <LocalSettingsPageItem
diff --git a/app/javascript/flavours/glitch/initial_state.js b/app/javascript/flavours/glitch/initial_state.js
index 4391b0c75..cafa5b1bb 100644
--- a/app/javascript/flavours/glitch/initial_state.js
+++ b/app/javascript/flavours/glitch/initial_state.js
@@ -121,8 +121,10 @@ export const expandSpoilers = getMeta('expand_spoilers');
 export const forceSingleColumn = !getMeta('advanced_layout');
 export const limitedFederationMode = getMeta('limited_federation_mode');
 export const mascot = getMeta('mascot');
+export const maxReactions = (initialState && initialState.max_reactions) || 1;
 export const me = getMeta('me');
 export const movedToAccountId = getMeta('moved_to_account_id');
+export const visibleReactions = getMeta('visible_reactions');
 export const owner = getMeta('owner');
 export const profile_directory = getMeta('profile_directory');
 export const reduceMotion = getMeta('reduce_motion');
@@ -148,7 +150,4 @@ export const pollLimits = (initialState && initialState.poll_limits);
 export const defaultContentType = getMeta('default_content_type');
 export const useSystemEmojiFont = getMeta('system_emoji_font');
 
-// nyastodon-specific settings
-export const maxReactions = (initialState && initialState.max_reactions) || 8;
-
 export default initialState;
diff --git a/app/javascript/flavours/glitch/locales/de.js b/app/javascript/flavours/glitch/locales/de.js
index 18eb398d8..a4daa5949 100644
--- a/app/javascript/flavours/glitch/locales/de.js
+++ b/app/javascript/flavours/glitch/locales/de.js
@@ -6,9 +6,6 @@ const messages = {
 
   'tooltips.reactions': 'Reaktionen',
 
-  'settings.enter_amount_prompt': 'Gib eine Zahl ein',
-  'settings.num_visible_reactions': 'Anzahl sichtbarer Reaktionen',
-
   'status.react': 'Reagieren',
 };
 
diff --git a/app/javascript/flavours/glitch/locales/en.js b/app/javascript/flavours/glitch/locales/en.js
index 634b7e2a0..7065cbe26 100644
--- a/app/javascript/flavours/glitch/locales/en.js
+++ b/app/javascript/flavours/glitch/locales/en.js
@@ -22,7 +22,6 @@ const messages = {
   'settings.close': 'Close',
   'settings.collapsed_statuses': 'Collapsed toots',
   'settings.enable_collapsed': 'Enable collapsed toots',
-  'settings.enter_amount_prompt': 'Enter an amount',
   'settings.general': 'General',
   'settings.image_backgrounds': 'Image backgrounds',
   'settings.image_backgrounds_media': 'Preview collapsed toot media',
@@ -30,7 +29,6 @@ const messages = {
   'settings.media': 'Media',
   'settings.media_letterbox': 'Letterbox media',
   'settings.media_fullwidth': 'Full-width media previews',
-  'settings.num_visible_reactions': 'Number of visible reactions',
   'settings.preferences': 'User preferences',
   'settings.wide_view': 'Wide view (Desktop mode only)',
   'settings.navbar_under': 'Navbar at the bottom (Mobile only)',
diff --git a/app/javascript/flavours/glitch/locales/fr.js b/app/javascript/flavours/glitch/locales/fr.js
index 802c71896..3ebe055e0 100644
--- a/app/javascript/flavours/glitch/locales/fr.js
+++ b/app/javascript/flavours/glitch/locales/fr.js
@@ -6,9 +6,6 @@ const messages = {
 
   'tooltips.reactions': 'Réactions',
 
-  'settings.enter_amount_prompt': 'Entrez un montant',
-  'settings.num_visible_reactions': 'Nombre de réactions visibles',
-
   'status.react': 'Réagir',
 };
 
diff --git a/app/javascript/flavours/glitch/reducers/local_settings.js b/app/javascript/flavours/glitch/reducers/local_settings.js
index 9a5e02206..81ab1cb0d 100644
--- a/app/javascript/flavours/glitch/reducers/local_settings.js
+++ b/app/javascript/flavours/glitch/reducers/local_settings.js
@@ -23,7 +23,6 @@ const initialState = ImmutableMap({
   show_content_type_choice: false,
   tag_misleading_links: true,
   rewrite_mentions: 'no',
-  num_visible_reactions: 6,
   content_warnings : ImmutableMap({
     filter       : null,
     media_outside: false,
diff --git a/app/lib/user_settings_decorator.rb b/app/lib/user_settings_decorator.rb
index 260077a1c..17fbacf0d 100644
--- a/app/lib/user_settings_decorator.rb
+++ b/app/lib/user_settings_decorator.rb
@@ -43,6 +43,7 @@ class UserSettingsDecorator
     user.settings['use_pending_items']   = use_pending_items_preference if change?('setting_use_pending_items')
     user.settings['trends']              = trends_preference if change?('setting_trends')
     user.settings['crop_images']         = crop_images_preference if change?('setting_crop_images')
+    user.settings['visible_reactions']   = visible_reactions_preference if change?('setting_visible_reactions')
     user.settings['always_send_emails']  = always_send_emails_preference if change?('setting_always_send_emails')
   end
 
@@ -158,6 +159,10 @@ class UserSettingsDecorator
     boolean_cast_setting 'setting_crop_images'
   end
 
+  def visible_reactions_preference
+    integer_cast_setting 'setting_visible_reactions'
+  end
+
   def always_send_emails_preference
     boolean_cast_setting 'setting_always_send_emails'
   end
@@ -166,6 +171,10 @@ class UserSettingsDecorator
     ActiveModel::Type::Boolean.new.cast(settings[key])
   end
 
+  def integer_cast_setting(key)
+    ActiveModel::Type::Integer.new.cast(settings[key])
+  end
+
   def coerced_settings(key)
     coerce_values settings.fetch(key, {})
   end
diff --git a/app/models/user.rb b/app/models/user.rb
index 209bfa521..4d34526f3 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -134,7 +134,7 @@ class User < ApplicationRecord
   delegate :auto_play_gif, :default_sensitive, :unfollow_modal, :boost_modal, :favourite_modal, :delete_modal,
            :reduce_motion, :system_font_ui, :noindex, :flavour, :skin, :display_media, :hide_followers_count,
            :expand_spoilers, :default_language, :aggregate_reblogs, :show_application,
-           :advanced_layout, :use_blurhash, :use_pending_items, :trends, :crop_images,
+           :advanced_layout, :use_blurhash, :use_pending_items, :trends, :crop_images, :visible_reactions,
            :disable_swiping, :always_send_emails, :default_content_type, :system_emoji_font,
            to: :settings, prefix: :setting, allow_nil: false
 
diff --git a/app/serializers/initial_state_serializer.rb b/app/serializers/initial_state_serializer.rb
index 0ac196b7a..f337ed35b 100644
--- a/app/serializers/initial_state_serializer.rb
+++ b/app/serializers/initial_state_serializer.rb
@@ -70,6 +70,7 @@ class InitialStateSerializer < ActiveModel::Serializer
       store[:default_content_type] = object.current_account.user.setting_default_content_type
       store[:system_emoji_font] = object.current_account.user.setting_system_emoji_font
       store[:crop_images]       = object.current_account.user.setting_crop_images
+      store[:visible_reactions] = object.current_account.user.setting_visible_reactions
     else
       store[:auto_play_gif] = Setting.auto_play_gif
       store[:display_media] = Setting.display_media
diff --git a/app/views/settings/preferences/appearance/show.html.haml b/app/views/settings/preferences/appearance/show.html.haml
index a252289b0..6c5f7414e 100644
--- a/app/views/settings/preferences/appearance/show.html.haml
+++ b/app/views/settings/preferences/appearance/show.html.haml
@@ -36,6 +36,9 @@
   .fields-group
     = f.input :setting_crop_images, as: :boolean, wrapper: :with_label
 
+  .fields-group.fields-row__column.fields-row__column-6
+    = f.input :setting_visible_reactions, wrapper: :with_label, input_html: { type: 'number', data: { default: '6' } }, hint: false
+
   %h4= t 'appearance.discovery'
 
   .fields-group
diff --git a/config/locales/simple_form.de.yml b/config/locales/simple_form.de.yml
index f12211c94..e9356c6ea 100644
--- a/config/locales/simple_form.de.yml
+++ b/config/locales/simple_form.de.yml
@@ -213,6 +213,7 @@ de:
         setting_unfollow_modal: Bestätigungsdialog anzeigen, bevor jemandem entfolgt wird
         setting_use_blurhash: Farbverlauf für verborgene Medien anzeigen
         setting_use_pending_items: Langsamer Modus
+        setting_visible_reactions: Anzahl der sichtbaren Emoji-Reaktionen
         severity: Schweregrad
         sign_in_token_attempt: Sicherheitscode
         title: Titel
diff --git a/config/locales/simple_form.en.yml b/config/locales/simple_form.en.yml
index 6edf7b4e9..880d9190c 100644
--- a/config/locales/simple_form.en.yml
+++ b/config/locales/simple_form.en.yml
@@ -213,6 +213,7 @@ en:
         setting_unfollow_modal: Show confirmation dialog before unfollowing someone
         setting_use_blurhash: Show colorful gradients for hidden media
         setting_use_pending_items: Slow mode
+        setting_visible_reactions: Number of visible emoji reactions
         severity: Severity
         sign_in_token_attempt: Security code
         title: Title
diff --git a/config/locales/simple_form.fr.yml b/config/locales/simple_form.fr.yml
index 73fb4f334..b3f56d60b 100644
--- a/config/locales/simple_form.fr.yml
+++ b/config/locales/simple_form.fr.yml
@@ -213,6 +213,7 @@ fr:
         setting_unfollow_modal: Afficher une fenêtre de confirmation avant de vous désabonner d’un compte
         setting_use_blurhash: Afficher des dégradés colorés pour les médias cachés
         setting_use_pending_items: Mode lent
+        setting_visible_reactions: Nombre de réactions emoji visibles
         severity: Sévérité
         sign_in_token_attempt: Code de sécurité
         title: Nom
diff --git a/config/settings.yml b/config/settings.yml
index 1f44fd308..28951cea1 100644
--- a/config/settings.yml
+++ b/config/settings.yml
@@ -42,6 +42,7 @@ defaults: &defaults
   trendable_by_default: false
   trending_status_cw: true
   crop_images: true
+  visible_reactions: 6
   notification_emails:
     follow: true
     reblog: false

From f4dbfdb9c9ae0698364eed3a034956e62256403b Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 30 Nov 2022 17:25:36 +0100
Subject: [PATCH 19/47] rebase with upstream

---
 .../glitch/components/status_prepend.js       |   2 +-
 .../mastodon/actions/interactions.js          |  85 +++++++++
 .../mastodon/actions/notifications.js         |   1 +
 app/javascript/mastodon/components/status.js  |  14 ++
 .../mastodon/components/status_action_bar.js  |  28 +++
 .../mastodon/components/status_reactions.js   | 179 ++++++++++++++++++
 .../mastodon/containers/status_container.js   |  13 +-
 .../components/emoji_picker_dropdown.js       |   3 +-
 .../components/column_settings.js             |  12 ++
 .../notifications/components/filter_bar.js    |   8 +
 .../notifications/components/notification.js  |  35 ++++
 .../features/status/components/action_bar.js  |  23 ++-
 .../status/components/detailed_status.js      |  12 ++
 .../mastodon/features/status/index.js         |  27 +++
 app/javascript/mastodon/initial_state.js      |   2 +
 app/javascript/mastodon/locales/de.json       |   4 +
 app/javascript/mastodon/locales/en.json       |   4 +
 app/javascript/mastodon/locales/fr.json       |  10 +-
 app/javascript/mastodon/reducers/settings.js  |   3 +
 app/javascript/mastodon/reducers/statuses.js  |  44 +++++
 app/javascript/mastodon/selectors/index.js    |   8 +
 .../styles/mastodon/components.scss           |  18 ++
 22 files changed, 526 insertions(+), 9 deletions(-)
 create mode 100644 app/javascript/mastodon/components/status_reactions.js

diff --git a/app/javascript/flavours/glitch/components/status_prepend.js b/app/javascript/flavours/glitch/components/status_prepend.js
index 6c96f2ee2..946146b5e 100644
--- a/app/javascript/flavours/glitch/components/status_prepend.js
+++ b/app/javascript/flavours/glitch/components/status_prepend.js
@@ -60,7 +60,7 @@ export default class StatusPrepend extends React.PureComponent {
       return (
         <FormattedMessage
           id='notification.reaction'
-          defaultMessage='{name} reacted to your post'
+          defaultMessage='{name} reacted to your status'
           values={{ name: link }}
         />
       );
diff --git a/app/javascript/mastodon/actions/interactions.js b/app/javascript/mastodon/actions/interactions.js
index d60ccc1fb..afae6705f 100644
--- a/app/javascript/mastodon/actions/interactions.js
+++ b/app/javascript/mastodon/actions/interactions.js
@@ -41,6 +41,16 @@ export const UNBOOKMARK_REQUEST = 'UNBOOKMARKED_REQUEST';
 export const UNBOOKMARK_SUCCESS = 'UNBOOKMARKED_SUCCESS';
 export const UNBOOKMARK_FAIL    = 'UNBOOKMARKED_FAIL';
 
+export const REACTION_UPDATE = 'REACTION_UPDATE';
+
+export const REACTION_ADD_REQUEST = 'REACTION_ADD_REQUEST';
+export const REACTION_ADD_SUCCESS = 'REACTION_ADD_SUCCESS';
+export const REACTION_ADD_FAIL    = 'REACTION_ADD_FAIL';
+
+export const REACTION_REMOVE_REQUEST = 'REACTION_REMOVE_REQUEST';
+export const REACTION_REMOVE_SUCCESS = 'REACTION_REMOVE_SUCCESS';
+export const REACTION_REMOVE_FAIL    = 'REACTION_REMOVE_FAIL';
+
 export function reblog(status, visibility) {
   return function (dispatch, getState) {
     dispatch(reblogRequest(status));
@@ -412,3 +422,78 @@ export function unpinFail(status, error) {
     skipLoading: true,
   };
 };
+
+export const addReaction = (statusId, name) => (dispatch, getState) => {
+  const status = getState().get('statuses').get(statusId);
+  let alreadyAdded = false;
+  if (status) {
+    const reaction = status.get('reactions').find(x => x.get('name') === name);
+    if (reaction && reaction.get('me')) {
+      alreadyAdded = true;
+    }
+  }
+  if (!alreadyAdded) {
+    dispatch(addReactionRequest(statusId, name, alreadyAdded));
+  }
+
+  api(getState).put(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
+    dispatch(addReactionSuccess(statusId, name, alreadyAdded));
+  }).catch(err => {
+    if (!alreadyAdded) {
+      dispatch(addReactionFail(statusId, name, err));
+    }
+  });
+};
+
+export const addReactionRequest = (statusId, name) => ({
+  type: REACTION_ADD_REQUEST,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
+
+export const addReactionSuccess = (statusId, name) => ({
+  type: REACTION_ADD_SUCCESS,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
+
+export const addReactionFail = (statusId, name, error) => ({
+  type: REACTION_ADD_FAIL,
+  id: statusId,
+  name,
+  error,
+  skipLoading: true,
+});
+
+export const removeReaction = (statusId, name) => (dispatch, getState) => {
+  dispatch(removeReactionRequest(statusId, name));
+
+  api(getState).delete(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
+    dispatch(removeReactionSuccess(statusId, name));
+  }).catch(err => {
+    dispatch(removeReactionFail(statusId, name, err));
+  });
+};
+
+export const removeReactionRequest = (statusId, name) => ({
+  type: REACTION_REMOVE_REQUEST,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
+
+export const removeReactionSuccess = (statusId, name) => ({
+  type: REACTION_REMOVE_SUCCESS,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
+
+export const removeReactionFail = (statusId, name) => ({
+  type: REACTION_REMOVE_FAIL,
+  id: statusId,
+  name,
+  skipLoading: true,
+});
diff --git a/app/javascript/mastodon/actions/notifications.js b/app/javascript/mastodon/actions/notifications.js
index d4588db2c..1a801491b 100644
--- a/app/javascript/mastodon/actions/notifications.js
+++ b/app/javascript/mastodon/actions/notifications.js
@@ -127,6 +127,7 @@ const excludeTypesFromFilter = filter => {
     'follow',
     'follow_request',
     'favourite',
+    'reaction',
     'reblog',
     'mention',
     'poll',
diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index a1384ba58..ec9e583e2 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -7,6 +7,7 @@ import RelativeTimestamp from './relative_timestamp';
 import DisplayName from './display_name';
 import StatusContent from './status_content';
 import StatusActionBar from './status_action_bar';
+import StatusReactions from './status_reactions';
 import AttachmentList from './attachment_list';
 import Card from '../features/status/components/card';
 import { injectIntl, defineMessages, FormattedMessage } from 'react-intl';
@@ -21,6 +22,7 @@ import PictureInPicturePlaceholder from 'mastodon/components/picture_in_picture_
 // We use the component (and not the container) since we do not want
 // to use the progress bar to show download progress
 import Bundle from '../features/ui/components/bundle';
+import { visibleReactions } from '../../flavours/glitch/initial_state';
 
 export const textForScreenReader = (intl, status, rebloggedByText = false) => {
   const displayName = status.getIn(['account', 'display_name']);
@@ -76,6 +78,8 @@ class Status extends ImmutablePureComponent {
     onDelete: PropTypes.func,
     onDirect: PropTypes.func,
     onMention: PropTypes.func,
+    onReactionAdd: PropTypes.func,
+    onReactionRemove: PropTypes.func,
     onPin: PropTypes.func,
     onOpenMedia: PropTypes.func,
     onOpenVideo: PropTypes.func,
@@ -99,6 +103,7 @@ class Status extends ImmutablePureComponent {
     cachedMediaWidth: PropTypes.number,
     scrollKey: PropTypes.string,
     deployPictureInPicture: PropTypes.func,
+    emojiMap: ImmutablePropTypes.map.isRequired,
     pictureInPicture: ImmutablePropTypes.contains({
       inUse: PropTypes.bool,
       available: PropTypes.bool,
@@ -537,6 +542,15 @@ class Status extends ImmutablePureComponent {
 
             {media}
 
+            <StatusReactions
+              statusId={status.get('id')}
+              reactions={status.get('reactions')}
+              numVisible={visibleReactions}
+              addReaction={this.props.onReactionAdd}
+              removeReaction={this.props.onReactionRemove}
+              emojiMap={this.props.emojiMap}
+            />
+
             <StatusActionBar scrollKey={scrollKey} status={status} account={account} onFilter={matchedFilters ? this.handleFilterClick : null} {...other} />
           </div>
         </div>
diff --git a/app/javascript/mastodon/components/status_action_bar.js b/app/javascript/mastodon/components/status_action_bar.js
index 2a1fedb93..54c9860cf 100644
--- a/app/javascript/mastodon/components/status_action_bar.js
+++ b/app/javascript/mastodon/components/status_action_bar.js
@@ -9,6 +9,8 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
 import { me } from '../initial_state';
 import classNames from 'classnames';
 import { PERMISSION_MANAGE_USERS } from 'mastodon/permissions';
+import EmojiPickerDropdown from '../features/compose/containers/emoji_picker_dropdown_container';
+import { maxReactions } from '../../flavours/glitch/initial_state';
 
 const messages = defineMessages({
   delete: { id: 'status.delete', defaultMessage: 'Delete' },
@@ -27,6 +29,7 @@ const messages = defineMessages({
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
   favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  react: { id: 'status.react', defaultMessage: 'React' },
   bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
   removeBookmark: { id: 'status.remove_bookmark', defaultMessage: 'Remove bookmark' },
   open: { id: 'status.open', defaultMessage: 'Expand this status' },
@@ -66,6 +69,7 @@ class StatusActionBar extends ImmutablePureComponent {
     relationship: ImmutablePropTypes.map,
     onReply: PropTypes.func,
     onFavourite: PropTypes.func,
+    onReactionAdd: PropTypes.func,
     onReblog: PropTypes.func,
     onDelete: PropTypes.func,
     onDirect: PropTypes.func,
@@ -127,6 +131,16 @@ class StatusActionBar extends ImmutablePureComponent {
     }
   }
 
+  handleEmojiPick = data => {
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''));
+    } else {
+      this.props.onInteractionModal('favourite', this.props.status);
+    }
+  }
+
   handleReblogClick = e => {
     const { signedIn } = this.context.identity;
 
@@ -230,6 +244,8 @@ class StatusActionBar extends ImmutablePureComponent {
     this.props.onFilter();
   }
 
+  nop = () => {}
+
   render () {
     const { status, relationship, intl, withDismiss, withCounters, scrollKey } = this.props;
     const { signedIn } = this.context.identity;
@@ -349,11 +365,23 @@ class StatusActionBar extends ImmutablePureComponent {
       <IconButton className='status__action-bar__button' title={intl.formatMessage(messages.hide)} icon='eye' onClick={this.handleHideClick} />
     );
 
+    const canReact = status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
+    const reactButton = (
+      <IconButton
+        className='status__action-bar-button'
+        onClick={this.nop} // EmojiPickerDropdown handles that
+        title={intl.formatMessage(messages.react)}
+        disabled={!canReact}
+        icon='plus'
+      />
+    );
+
     return (
       <div className='status__action-bar'>
         <IconButton className='status__action-bar__button' title={replyTitle} icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon} onClick={this.handleReplyClick} counter={status.get('replies_count')} obfuscateCount />
         <IconButton className={classNames('status__action-bar__button', { reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} counter={withCounters ? status.get('reblogs_count') : undefined} />
         <IconButton className='status__action-bar__button star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} counter={withCounters ? status.get('favourites_count') : undefined} />
+        <EmojiPickerDropdown className='status__action-bar-button' onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
         <IconButton className='status__action-bar__button bookmark-icon' disabled={!signedIn} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} />
 
         {shareButton}
diff --git a/app/javascript/mastodon/components/status_reactions.js b/app/javascript/mastodon/components/status_reactions.js
new file mode 100644
index 000000000..39956270a
--- /dev/null
+++ b/app/javascript/mastodon/components/status_reactions.js
@@ -0,0 +1,179 @@
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import PropTypes from 'prop-types';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import { reduceMotion } from '../initial_state';
+import spring from 'react-motion/lib/spring';
+import TransitionMotion from 'react-motion/lib/TransitionMotion';
+import classNames from 'classnames';
+import React from 'react';
+import unicodeMapping from '../features/emoji/emoji_unicode_mapping_light';
+import AnimatedNumber from './animated_number';
+import { assetHost } from '../utils/config';
+import { autoPlayGif } from '../initial_state';
+
+export default class StatusReactions extends ImmutablePureComponent {
+
+  static propTypes = {
+    statusId: PropTypes.string.isRequired,
+    reactions: ImmutablePropTypes.list.isRequired,
+    numVisible: PropTypes.number,
+    addReaction: PropTypes.func.isRequired,
+    removeReaction: PropTypes.func.isRequired,
+    emojiMap: ImmutablePropTypes.map.isRequired,
+  };
+
+  willEnter() {
+    return { scale: reduceMotion ? 1 : 0 };
+  }
+
+  willLeave() {
+    return { scale: reduceMotion ? 0 : spring(0, { stiffness: 170, damping: 26 }) };
+  }
+
+  render() {
+    const { reactions, numVisible } = this.props;
+    let visibleReactions = reactions
+      .filter(x => x.get('count') > 0)
+      .sort((a, b) => b.get('count') - a.get('count'));
+
+    // numVisible might be NaN because it's pulled from local settings
+    // which doesn't do a whole lot of input validation, but that's okay
+    // because  NaN >= 0  evaluates false.
+    // Still, this should be improved at some point.
+    if (numVisible >= 0) {
+      visibleReactions = visibleReactions.filter((_, i) => i < numVisible);
+    }
+
+    const styles = visibleReactions.map(reaction => ({
+      key: reaction.get('name'),
+      data: reaction,
+      style: { scale: reduceMotion ? 1 : spring(1, { stiffness: 150, damping: 13 }) },
+    })).toArray();
+
+    return (
+      <TransitionMotion styles={styles} willEnter={this.willEnter} willLeave={this.willLeave}>
+        {items => (
+          <div className={classNames('reactions-bar', { 'reactions-bar--empty': visibleReactions.isEmpty() })}>
+            {items.map(({ key, data, style }) => (
+              <Reaction
+                key={key}
+                statusId={this.props.statusId}
+                reaction={data}
+                style={{ transform: `scale(${style.scale})`, position: style.scale < 0.5 ? 'absolute' : 'static' }}
+                addReaction={this.props.addReaction}
+                removeReaction={this.props.removeReaction}
+                emojiMap={this.props.emojiMap}
+              />
+            ))}
+          </div>
+        )}
+      </TransitionMotion>
+    );
+  }
+
+}
+
+class Reaction extends ImmutablePureComponent {
+
+  static propTypes = {
+    statusId: PropTypes.string,
+    reaction: ImmutablePropTypes.map.isRequired,
+    addReaction: PropTypes.func.isRequired,
+    removeReaction: PropTypes.func.isRequired,
+    emojiMap: ImmutablePropTypes.map.isRequired,
+    style: PropTypes.object,
+  };
+
+  state = {
+    hovered: false,
+  };
+
+  handleClick = () => {
+    const { reaction, statusId, addReaction, removeReaction } = this.props;
+
+    if (reaction.get('me')) {
+      removeReaction(statusId, reaction.get('name'));
+    } else {
+      addReaction(statusId, reaction.get('name'));
+    }
+  }
+
+  handleMouseEnter = () => this.setState({ hovered: true })
+
+  handleMouseLeave = () => this.setState({ hovered: false })
+
+  render() {
+    const { reaction } = this.props;
+
+    let shortCode = reaction.get('name');
+
+    if (unicodeMapping[shortCode]) {
+      shortCode = unicodeMapping[shortCode].shortCode;
+    }
+
+    return (
+      <button
+        className={classNames('reactions-bar__item', { active: reaction.get('me') })}
+        onClick={this.handleClick}
+        onMouseEnter={this.handleMouseEnter}
+        onMouseLeave={this.handleMouseLeave}
+        title={`:${shortCode}:`}
+        style={this.props.style}
+      >
+        <span className='reactions-bar__item__emoji'>
+          <Emoji hovered={this.state.hovered} emoji={reaction.get('name')} emojiMap={this.props.emojiMap} />
+        </span>
+        <span className='reactions-bar__item__count'>
+          <AnimatedNumber value={reaction.get('count')} />
+        </span>
+      </button>
+    );
+  }
+
+}
+
+class Emoji extends React.PureComponent {
+
+  static propTypes = {
+    emoji: PropTypes.string.isRequired,
+    emojiMap: ImmutablePropTypes.map.isRequired,
+    hovered: PropTypes.bool.isRequired,
+  };
+
+  render() {
+    const { emoji, emojiMap, hovered } = this.props;
+
+    if (unicodeMapping[emoji]) {
+      const { filename, shortCode } = unicodeMapping[this.props.emoji];
+      const title = shortCode ? `:${shortCode}:` : '';
+
+      return (
+        <img
+          draggable='false'
+          className='emojione'
+          alt={emoji}
+          title={title}
+          src={`${assetHost}/emoji/${filename}.svg`}
+        />
+      );
+    } else if (emojiMap.get(emoji)) {
+      const filename = (autoPlayGif || hovered)
+        ? emojiMap.getIn([emoji, 'url'])
+        : emojiMap.getIn([emoji, 'static_url']);
+      const shortCode = `:${emoji}:`;
+
+      return (
+        <img
+          draggable='false'
+          className='emojione custom-emoji'
+          alt={shortCode}
+          title={shortCode}
+          src={filename}
+        />
+      );
+    } else {
+      return null;
+    }
+  }
+
+}
diff --git a/app/javascript/mastodon/containers/status_container.js b/app/javascript/mastodon/containers/status_container.js
index 294105f25..556910f08 100644
--- a/app/javascript/mastodon/containers/status_container.js
+++ b/app/javascript/mastodon/containers/status_container.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import Status from '../components/status';
-import { makeGetStatus, makeGetPictureInPicture } from '../selectors';
+import { makeGetStatus, makeGetPictureInPicture, makeCustomEmojiMap } from '../selectors';
 import {
   replyCompose,
   mentionCompose,
@@ -16,6 +16,8 @@ import {
   unbookmark,
   pin,
   unpin,
+  addReaction,
+  removeReaction,
 } from '../actions/interactions';
 import {
   muteStatus,
@@ -66,6 +68,7 @@ const makeMapStateToProps = () => {
   const mapStateToProps = (state, props) => ({
     status: getStatus(state, props),
     pictureInPicture: getPictureInPicture(state, props),
+    emojiMap: makeCustomEmojiMap(state),
   });
 
   return mapStateToProps;
@@ -129,6 +132,14 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
     }
   },
 
+  onReactionAdd (statusId, name) {
+    dispatch(addReaction(statusId, name));
+  },
+
+  onReactionRemove (statusId, name) {
+    dispatch(removeReaction(statusId, name));
+  },
+
   onEmbed (status) {
     dispatch(openModal('EMBED', {
       url: status.get('url'),
diff --git a/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js b/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js
index 8cca8af2a..efdbf9c90 100644
--- a/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js
+++ b/app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js
@@ -319,6 +319,7 @@ class EmojiPickerDropdown extends React.PureComponent {
     onSkinTone: PropTypes.func.isRequired,
     skinTone: PropTypes.number.isRequired,
     button: PropTypes.node,
+    disabled: PropTypes.bool,
   };
 
   state = {
@@ -356,7 +357,7 @@ class EmojiPickerDropdown extends React.PureComponent {
   }
 
   onToggle = (e) => {
-    if (!this.state.loading && (!e.key || e.key === 'Enter')) {
+    if (!this.state.disabled && !this.state.loading && (!e.key || e.key === 'Enter')) {
       if (this.state.active) {
         this.onHideDropdown();
       } else {
diff --git a/app/javascript/mastodon/features/notifications/components/column_settings.js b/app/javascript/mastodon/features/notifications/components/column_settings.js
index a38f8d3c2..3e91ebc36 100644
--- a/app/javascript/mastodon/features/notifications/components/column_settings.js
+++ b/app/javascript/mastodon/features/notifications/components/column_settings.js
@@ -6,6 +6,7 @@ import ClearColumnButton from './clear_column_button';
 import GrantPermissionButton from './grant_permission_button';
 import SettingToggle from './setting_toggle';
 import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_REPORTS } from 'mastodon/permissions';
+import PillBarButton from '../../../../flavours/glitch/features/notifications/components/pill_bar_button';
 
 export default class ColumnSettings extends React.PureComponent {
 
@@ -115,6 +116,17 @@ export default class ColumnSettings extends React.PureComponent {
           </div>
         </div>
 
+        <div role='group' aria-labelledby='notifications-reaction'>
+          <span id='notifications-reaction' className='column-settings__section'><FormattedMessage id='notifications.column_settings.reaction' defaultMessage='Reactions:' /></span>
+
+          <div className='column-settings__pillbar'>
+            <SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'reaction']} onChange={onChange} label={alertStr} />
+            {showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'reaction']} onChange={this.onPushChange} label={pushStr} />}
+            <SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'reaction']} onChange={onChange} label={showStr} />
+            <SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'reaction']} onChange={onChange} label={soundStr} />
+          </div>
+        </div>
+
         <div role='group' aria-labelledby='notifications-mention'>
           <span id='notifications-mention' className='column-settings__section'><FormattedMessage id='notifications.column_settings.mention' defaultMessage='Mentions:' /></span>
 
diff --git a/app/javascript/mastodon/features/notifications/components/filter_bar.js b/app/javascript/mastodon/features/notifications/components/filter_bar.js
index 368eb0b7e..2b5f48f0b 100644
--- a/app/javascript/mastodon/features/notifications/components/filter_bar.js
+++ b/app/javascript/mastodon/features/notifications/components/filter_bar.js
@@ -6,6 +6,7 @@ import Icon from 'mastodon/components/icon';
 const tooltips = defineMessages({
   mentions: { id: 'notifications.filter.mentions', defaultMessage: 'Mentions' },
   favourites: { id: 'notifications.filter.favourites', defaultMessage: 'Favourites' },
+  reactions: { id: 'notifications.filter.reactions', defaultMessage: 'Reactions' },
   boosts: { id: 'notifications.filter.boosts', defaultMessage: 'Boosts' },
   polls: { id: 'notifications.filter.polls', defaultMessage: 'Poll results' },
   follows: { id: 'notifications.filter.follows', defaultMessage: 'Follows' },
@@ -74,6 +75,13 @@ class FilterBar extends React.PureComponent {
         >
           <Icon id='star' fixedWidth />
         </button>
+        <button
+          className={selectedFilter === 'reaction' ? 'active' : ''}
+          onClick={this.onClick('reaction')}
+          title={intl.formatMessage(tooltips.reactions)}
+        >
+          <Icon id='plus' fixedWidth />
+        </button>
         <button
           className={selectedFilter === 'reblog' ? 'active' : ''}
           onClick={this.onClick('reblog')}
diff --git a/app/javascript/mastodon/features/notifications/components/notification.js b/app/javascript/mastodon/features/notifications/components/notification.js
index ea2c9c0a4..7b23197cf 100644
--- a/app/javascript/mastodon/features/notifications/components/notification.js
+++ b/app/javascript/mastodon/features/notifications/components/notification.js
@@ -15,6 +15,7 @@ import classNames from 'classnames';
 
 const messages = defineMessages({
   favourite: { id: 'notification.favourite', defaultMessage: '{name} favourited your status' },
+  reaction: { id: 'notification.reaction', defaultMessage: '{name} reacted to your status' },
   follow: { id: 'notification.follow', defaultMessage: '{name} followed you' },
   ownPoll: { id: 'notification.own_poll', defaultMessage: 'Your poll has ended' },
   poll: { id: 'notification.poll', defaultMessage: 'A poll you have voted in has ended' },
@@ -213,6 +214,38 @@ class Notification extends ImmutablePureComponent {
     );
   }
 
+  renderReaction (notification, link) {
+    const { intl, unread } = this.props;
+
+    return (
+      <HotKeys handlers={this.getHandlers()}>
+        <div className={classNames('notification notification-reaction focusable', { unread })} tabIndex='0' aria-label={notificationForScreenReader(intl, intl.formatMessage(messages.reaction, { name: notification.getIn(['account', 'acct']) }), notification.get('created_at'))}>
+          <div className='notification__message'>
+            <div className='notification__favourite-icon-wrapper'>
+              <Icon id='plus' fixedWidth />
+            </div>
+
+            <span title={notification.get('created_at')}>
+              <FormattedMessage id='notification.reaction' defaultMessage='{name} reacted to your status' values={{ name: link }} />
+            </span>
+          </div>
+
+          <StatusContainer
+            id={notification.get('status')}
+            account={notification.get('account')}
+            muted
+            withDismiss
+            hidden={this.props.hidden}
+            getScrollPosition={this.props.getScrollPosition}
+            updateScrollBottom={this.props.updateScrollBottom}
+            cachedMediaWidth={this.props.cachedMediaWidth}
+            cacheMediaWidth={this.props.cacheMediaWidth}
+          />
+        </div>
+      </HotKeys>
+    );
+  }
+
   renderReblog (notification, link) {
     const { intl, unread } = this.props;
 
@@ -414,6 +447,8 @@ class Notification extends ImmutablePureComponent {
       return this.renderMention(notification);
     case 'favourite':
       return this.renderFavourite(notification, link);
+    case 'reaction':
+      return this.renderReaction(notification, link);
     case 'reblog':
       return this.renderReblog(notification, link);
     case 'status':
diff --git a/app/javascript/mastodon/features/status/components/action_bar.js b/app/javascript/mastodon/features/status/components/action_bar.js
index c1242754c..ce272e448 100644
--- a/app/javascript/mastodon/features/status/components/action_bar.js
+++ b/app/javascript/mastodon/features/status/components/action_bar.js
@@ -5,9 +5,10 @@ import IconButton from '../../../components/icon_button';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import DropdownMenuContainer from '../../../containers/dropdown_menu_container';
 import { defineMessages, injectIntl } from 'react-intl';
-import { me } from '../../../initial_state';
+import { me, maxReactions } from '../../../initial_state';
 import classNames from 'classnames';
 import { PERMISSION_MANAGE_USERS } from 'mastodon/permissions';
+import EmojiPickerDropdown from '../../compose/containers/emoji_picker_dropdown_container';
 
 const messages = defineMessages({
   delete: { id: 'status.delete', defaultMessage: 'Delete' },
@@ -21,6 +22,7 @@ const messages = defineMessages({
   cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
   cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
   favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
+  react: { id: 'status.react', defaultMessage: 'React' },
   bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
   more: { id: 'status.more', defaultMessage: 'More' },
   mute: { id: 'status.mute', defaultMessage: 'Mute @{name}' },
@@ -61,6 +63,7 @@ class ActionBar extends React.PureComponent {
     onReply: PropTypes.func.isRequired,
     onReblog: PropTypes.func.isRequired,
     onFavourite: PropTypes.func.isRequired,
+    onReactionAdd: PropTypes.func.isRequired,
     onBookmark: PropTypes.func.isRequired,
     onDelete: PropTypes.func.isRequired,
     onEdit: PropTypes.func.isRequired,
@@ -91,6 +94,10 @@ class ActionBar extends React.PureComponent {
     this.props.onFavourite(this.props.status);
   }
 
+  handleEmojiPick = data => {
+    this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''));
+  }
+
   handleBookmarkClick = (e) => {
     this.props.onBookmark(this.props.status, e);
   }
@@ -179,6 +186,8 @@ class ActionBar extends React.PureComponent {
     navigator.clipboard.writeText(url);
   }
 
+  nop = () => {} // hack for reaction add button
+
   render () {
     const { status, relationship, intl } = this.props;
     const { signedIn, permissions } = this.context.identity;
@@ -250,6 +259,17 @@ class ActionBar extends React.PureComponent {
       }
     }
 
+    const canReact = status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
+    const reactButton = (
+      <IconButton
+        className='plus-icon'
+        onClick={this.nop} // EmojiPickerDropdown handles that
+        title={intl.formatMessage(messages.react)}
+        disabled={!canReact}
+        icon='plus'
+      />
+    );
+
     const shareButton = ('share' in navigator) && publicStatus && (
       <div className='detailed-status__button'><IconButton title={intl.formatMessage(messages.share)} icon='share-alt' onClick={this.handleShare} /></div>
     );
@@ -279,6 +299,7 @@ class ActionBar extends React.PureComponent {
         <div className='detailed-status__button'><IconButton title={intl.formatMessage(messages.reply)} icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon} onClick={this.handleReplyClick} /></div>
         <div className='detailed-status__button' ><IconButton className={classNames({ reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} /></div>
         <div className='detailed-status__button'><IconButton className='star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} /></div>
+        <div className='detailed-status__button'><EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} /></div>
         <div className='detailed-status__button'><IconButton className='bookmark-icon' disabled={!signedIn} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /></div>
 
         {shareButton}
diff --git a/app/javascript/mastodon/features/status/components/detailed_status.js b/app/javascript/mastodon/features/status/components/detailed_status.js
index c62910e0e..ccc7866d4 100644
--- a/app/javascript/mastodon/features/status/components/detailed_status.js
+++ b/app/javascript/mastodon/features/status/components/detailed_status.js
@@ -17,6 +17,7 @@ import Icon from 'mastodon/components/icon';
 import AnimatedNumber from 'mastodon/components/animated_number';
 import PictureInPicturePlaceholder from 'mastodon/components/picture_in_picture_placeholder';
 import EditedTimestamp from 'mastodon/components/edited_timestamp';
+import StatusReactions from '../../../components/status_reactions';
 
 const messages = defineMessages({
   public_short: { id: 'privacy.public.short', defaultMessage: 'Public' },
@@ -48,6 +49,9 @@ class DetailedStatus extends ImmutablePureComponent {
       available: PropTypes.bool,
     }),
     onToggleMediaVisibility: PropTypes.func,
+    onReactionAdd: PropTypes.func.isRequired,
+    onReactionRemove: PropTypes.func.isRequired,
+    emojiMap: ImmutablePropTypes.map.isRequired,
   };
 
   state = {
@@ -275,6 +279,14 @@ class DetailedStatus extends ImmutablePureComponent {
 
           {media}
 
+          <StatusReactions
+            statusId={status.get('id')}
+            reactions={status.get('reactions')}
+            addReaction={this.props.onReactionAdd}
+            removeReaction={this.props.onReactionRemove}
+            emojiMap={this.props.emojiMap}
+          />
+
           <div className='detailed-status__meta'>
             <a className='detailed-status__datetime' href={`/@${status.getIn(['account', 'acct'])}\/${status.get('id')}`} target='_blank' rel='noopener noreferrer'>
               <FormattedDate value={new Date(status.get('created_at'))} hour12={false} year='numeric' month='short' day='2-digit' hour='2-digit' minute='2-digit' />
diff --git a/app/javascript/mastodon/features/status/index.js b/app/javascript/mastodon/features/status/index.js
index 8a63cced2..393080478 100644
--- a/app/javascript/mastodon/features/status/index.js
+++ b/app/javascript/mastodon/features/status/index.js
@@ -20,6 +20,8 @@ import {
   unreblog,
   pin,
   unpin,
+  addReaction,
+  removeReaction,
 } from '../../actions/interactions';
 import {
   replyCompose,
@@ -62,6 +64,7 @@ import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from
 import { textForScreenReader, defaultMediaVisibility } from '../../components/status';
 import Icon from 'mastodon/components/icon';
 import { Helmet } from 'react-helmet';
+import { makeCustomEmojiMap } from '../../selectors';
 
 const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@@ -153,6 +156,7 @@ const makeMapStateToProps = () => {
       askReplyConfirmation: state.getIn(['compose', 'text']).trim().length !== 0,
       domain: state.getIn(['meta', 'domain']),
       pictureInPicture: getPictureInPicture(state, { id: props.params.statusId }),
+      emojiMap: makeCustomEmojiMap(state),
     };
   };
 
@@ -254,6 +258,25 @@ class Status extends ImmutablePureComponent {
     }
   }
 
+  handleReactionAdd = (statusId, name) => {
+    const { dispatch } = this.props;
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      dispatch(addReaction(statusId, name));
+    } else {
+      dispatch(openModal('INTERACTION', {
+        type: 'reaction_add',
+        accountId: status.getIn(['account', 'id']),
+        url: status.get('url'),
+      }));
+    }
+  }
+
+  handleReactionRemove = (statusId, name) => {
+    this.props.dispatch(removeReaction(statusId, name));
+  }
+
   handlePin = (status) => {
     if (status.get('pinned')) {
       this.props.dispatch(unpin(status));
@@ -638,12 +661,15 @@ class Status extends ImmutablePureComponent {
                   status={status}
                   onOpenVideo={this.handleOpenVideo}
                   onOpenMedia={this.handleOpenMedia}
+                  onReactionAdd={this.handleReactionAdd}
+                  onReactionRemove={this.handleReactionRemove}
                   onToggleHidden={this.handleToggleHidden}
                   onTranslate={this.handleTranslate}
                   domain={domain}
                   showMedia={this.state.showMedia}
                   onToggleMediaVisibility={this.handleToggleMediaVisibility}
                   pictureInPicture={pictureInPicture}
+                  emojiMap={this.props.emojiMap}
                 />
 
                 <ActionBar
@@ -651,6 +677,7 @@ class Status extends ImmutablePureComponent {
                   status={status}
                   onReply={this.handleReplyClick}
                   onFavourite={this.handleFavouriteClick}
+                  onReactionAdd={this.handleReactionAdd}
                   onReblog={this.handleReblogClick}
                   onBookmark={this.handleBookmarkClick}
                   onDelete={this.handleDeleteClick}
diff --git a/app/javascript/mastodon/initial_state.js b/app/javascript/mastodon/initial_state.js
index 8eec7f7c7..5f5b1babd 100644
--- a/app/javascript/mastodon/initial_state.js
+++ b/app/javascript/mastodon/initial_state.js
@@ -113,8 +113,10 @@ export const expandSpoilers = getMeta('expand_spoilers');
 export const forceSingleColumn = !getMeta('advanced_layout');
 export const limitedFederationMode = getMeta('limited_federation_mode');
 export const mascot = getMeta('mascot');
+export const maxReactions = (initialState && initialState.max_reactions) || 1;
 export const me = getMeta('me');
 export const movedToAccountId = getMeta('moved_to_account_id');
+export const visibleReactions = getMeta('visible_reactions');
 export const owner = getMeta('owner');
 export const profile_directory = getMeta('profile_directory');
 export const reduceMotion = getMeta('reduce_motion');
diff --git a/app/javascript/mastodon/locales/de.json b/app/javascript/mastodon/locales/de.json
index 67ffd6476..f1316fd7a 100644
--- a/app/javascript/mastodon/locales/de.json
+++ b/app/javascript/mastodon/locales/de.json
@@ -388,6 +388,7 @@
   "notification.admin.report": "{target} wurde von {name} gemeldet",
   "notification.admin.sign_up": "{name} registrierte sich",
   "notification.favourite": "{name} hat deinen Beitrag favorisiert",
+  "notification.reaction": "{name} hat auf deinen Beitrag reagiert",
   "notification.follow": "{name} folgt dir jetzt",
   "notification.follow_request": "{name} möchte dir folgen",
   "notification.mention": "{name} erwähnte dich",
@@ -402,6 +403,7 @@
   "notifications.column_settings.admin.sign_up": "Neue Registrierungen:",
   "notifications.column_settings.alert": "Desktop-Benachrichtigungen",
   "notifications.column_settings.favourite": "Favorisierungen:",
+  "notifications.column_settings.reaction": "Reaktionen:",
   "notifications.column_settings.filter_bar.advanced": "Erweiterte Filterleiste aktivieren",
   "notifications.column_settings.filter_bar.category": "Filterleiste:",
   "notifications.column_settings.filter_bar.show_bar": "Filterleiste anzeigen",
@@ -551,6 +553,7 @@
   "status.edited_x_times": "{count, plural, one {{count} mal} other {{count} mal}} bearbeitet",
   "status.embed": "Beitrag per iFrame einbetten",
   "status.favourite": "Favorisieren",
+  "status.react": "Reagieren",
   "status.filter": "Beitrag filtern",
   "status.filtered": "Gefiltert",
   "status.hide": "Beitrag verbergen",
@@ -609,6 +612,7 @@
   "timeline_hint.resources.statuses": "Ältere Beiträge",
   "trends.counter_by_accounts": "{count, plural, one {{counter} Profil} other {{counter} Profile}} {days, plural, one {seit gestern} other {in {days} Tagen}}",
   "trends.trending_now": "Aktuelle Trends",
+  "tooltips.reactions": "Reaktionen",
   "ui.beforeunload": "Dein Entwurf geht verloren, wenn du Mastodon verlässt.",
   "units.short.billion": "{count} Mrd",
   "units.short.million": "{count} Mio",
diff --git a/app/javascript/mastodon/locales/en.json b/app/javascript/mastodon/locales/en.json
index 4230e0dac..ba9195f11 100644
--- a/app/javascript/mastodon/locales/en.json
+++ b/app/javascript/mastodon/locales/en.json
@@ -393,6 +393,7 @@
   "notification.admin.report": "{name} reported {target}",
   "notification.admin.sign_up": "{name} signed up",
   "notification.favourite": "{name} favourited your post",
+  "notification.reaction": "{name} reacted to your post",
   "notification.follow": "{name} followed you",
   "notification.follow_request": "{name} has requested to follow you",
   "notification.mention": "{name} mentioned you",
@@ -407,6 +408,7 @@
   "notifications.column_settings.admin.sign_up": "New sign-ups:",
   "notifications.column_settings.alert": "Desktop notifications",
   "notifications.column_settings.favourite": "Favourites:",
+  "notifications.column_settings.reaction": "Reactions:",
   "notifications.column_settings.filter_bar.advanced": "Display all categories",
   "notifications.column_settings.filter_bar.category": "Quick filter bar",
   "notifications.column_settings.filter_bar.show_bar": "Show filter bar",
@@ -556,6 +558,7 @@
   "status.edited_x_times": "Edited {count, plural, one {{count} time} other {{count} times}}",
   "status.embed": "Embed",
   "status.favourite": "Favourite",
+  "status.react": "React",
   "status.filter": "Filter this post",
   "status.filtered": "Filtered",
   "status.hide": "Hide toot",
@@ -614,6 +617,7 @@
   "timeline_hint.resources.statuses": "Older posts",
   "trends.counter_by_accounts": "{count, plural, one {{counter} person} other {{counter} people}} in the past {days, plural, one {day} other {{days} days}}",
   "trends.trending_now": "Trending now",
+  "tooltips.reactions": "Reactions",
   "ui.beforeunload": "Your draft will be lost if you leave Mastodon.",
   "units.short.billion": "{count}B",
   "units.short.million": "{count}M",
diff --git a/app/javascript/mastodon/locales/fr.json b/app/javascript/mastodon/locales/fr.json
index ce004ed9f..e9a07a656 100644
--- a/app/javascript/mastodon/locales/fr.json
+++ b/app/javascript/mastodon/locales/fr.json
@@ -98,7 +98,7 @@
   "closed_registrations_modal.preamble": "Mastodon est décentralisé : peu importe où vous créez votre votre, vous serez en mesure de suivre et d'interagir avec quiconque sur ce serveur. Vous pouvez même l'héberger !",
   "closed_registrations_modal.title": "Inscription sur Mastodon",
   "column.about": "À propos",
-  "column.blocks": "Comptes bloqués",
+  "column.blocks": "Utilisateurs bloqués",
   "column.bookmarks": "Signets",
   "column.community": "Fil public local",
   "column.direct": "Messages directs",
@@ -138,7 +138,7 @@
   "compose_form.poll.switch_to_multiple": "Changer le sondage pour autoriser plusieurs choix",
   "compose_form.poll.switch_to_single": "Changer le sondage pour autoriser qu'un seul choix",
   "compose_form.publish": "Publier",
-  "compose_form.publish_form": "Publier",
+  "compose_form.publish_form": "Publish",
   "compose_form.publish_loud": "{publish} !",
   "compose_form.save_changes": "Enregistrer les modifications",
   "compose_form.sensitive.hide": "Marquer le média comme sensible",
@@ -387,7 +387,7 @@
   "not_signed_in_indicator.not_signed_in": "Vous devez vous connecter pour accéder à cette ressource.",
   "notification.admin.report": "{name} a signalé {target}",
   "notification.admin.sign_up": "{name} s'est inscrit·e",
-  "notification.favourite": "{name} a aimé votre publication",
+  "notification.favourite": "{name} a ajouté le message à ses favoris",
   "notification.follow": "{name} vous suit",
   "notification.follow_request": "{name} a demandé à vous suivre",
   "notification.mention": "{name} vous a mentionné·e :",
@@ -527,8 +527,8 @@
   "search_results.statuses_fts_disabled": "La recherche de messages par leur contenu n'est pas activée sur ce serveur Mastodon.",
   "search_results.title": "Rechercher {q}",
   "search_results.total": "{count, number} {count, plural, one {résultat} other {résultats}}",
-  "server_banner.about_active_users": "Personnes utilisant ce serveur au cours des 30 derniers jours (Comptes actifs mensuellement)",
-  "server_banner.active_users": "comptes actifs",
+  "server_banner.about_active_users": "Personnes utilisant ce serveur au cours des 30 derniers jours (Utilisateur·rice·s Actifs·ives Mensuellement)",
+  "server_banner.active_users": "Utilisateurs actifs",
   "server_banner.administered_by": "Administré par :",
   "server_banner.introduction": "{domain} fait partie du réseau social décentralisé propulsé par {mastodon}.",
   "server_banner.learn_more": "En savoir plus",
diff --git a/app/javascript/mastodon/reducers/settings.js b/app/javascript/mastodon/reducers/settings.js
index f9d3236e4..c8def2384 100644
--- a/app/javascript/mastodon/reducers/settings.js
+++ b/app/javascript/mastodon/reducers/settings.js
@@ -33,6 +33,7 @@ const initialState = ImmutableMap({
       follow: false,
       follow_request: false,
       favourite: false,
+      reaction: false,
       reblog: false,
       mention: false,
       poll: false,
@@ -56,6 +57,7 @@ const initialState = ImmutableMap({
       follow_request: false,
       favourite: true,
       reblog: true,
+      reaction: true,
       mention: true,
       poll: true,
       status: true,
@@ -69,6 +71,7 @@ const initialState = ImmutableMap({
       follow_request: false,
       favourite: true,
       reblog: true,
+      reaction: true,
       mention: true,
       poll: true,
       status: true,
diff --git a/app/javascript/mastodon/reducers/statuses.js b/app/javascript/mastodon/reducers/statuses.js
index c30c1e2cc..222890667 100644
--- a/app/javascript/mastodon/reducers/statuses.js
+++ b/app/javascript/mastodon/reducers/statuses.js
@@ -6,6 +6,11 @@ import {
   UNFAVOURITE_SUCCESS,
   BOOKMARK_REQUEST,
   BOOKMARK_FAIL,
+  REACTION_UPDATE,
+  REACTION_ADD_FAIL,
+  REACTION_REMOVE_FAIL,
+  REACTION_ADD_REQUEST,
+  REACTION_REMOVE_REQUEST,
 } from '../actions/interactions';
 import {
   STATUS_MUTE_SUCCESS,
@@ -35,6 +40,37 @@ const deleteStatus = (state, id, references) => {
   return state.delete(id);
 };
 
+const updateReaction = (state, id, name, updater) => state.update(
+  id,
+  status => status.update(
+    'reactions',
+    reactions => {
+      const index = reactions.findIndex(reaction => reaction.get('name') === name);
+      if (index > -1) {
+        return reactions.update(index, reaction => updater(reaction));
+      } else {
+        return reactions.push(updater(fromJS({ name, count: 0 })));
+      }
+    },
+  ),
+);
+
+const updateReactionCount = (state, reaction) => updateReaction(state, reaction.status_id, reaction.name, x => x.set('count', reaction.count));
+
+const addReaction = (state, id, name) => updateReaction(
+  state,
+  id,
+  name,
+  x => x.set('me', true).update('count', n => n + 1),
+);
+
+const removeReaction = (state, id, name) => updateReaction(
+  state,
+  id,
+  name,
+  x => x.set('me', false).update('count', n => n - 1),
+);
+
 const initialState = ImmutableMap();
 
 export default function statuses(state = initialState, action) {
@@ -61,6 +97,14 @@ export default function statuses(state = initialState, action) {
     return state.setIn([action.status.get('id'), 'reblogged'], true);
   case REBLOG_FAIL:
     return state.get(action.status.get('id')) === undefined ? state : state.setIn([action.status.get('id'), 'reblogged'], false);
+  case REACTION_UPDATE:
+    return updateReactionCount(state, action.reaction);
+  case REACTION_ADD_REQUEST:
+  case REACTION_REMOVE_FAIL:
+    return addReaction(state, action.id, action.name);
+  case REACTION_REMOVE_REQUEST:
+  case REACTION_ADD_FAIL:
+    return removeReaction(state, action.id, action.name);
   case STATUS_MUTE_SUCCESS:
     return state.setIn([action.id, 'muted'], true);
   case STATUS_UNMUTE_SUCCESS:
diff --git a/app/javascript/mastodon/selectors/index.js b/app/javascript/mastodon/selectors/index.js
index bf46c810e..56fd5b5b2 100644
--- a/app/javascript/mastodon/selectors/index.js
+++ b/app/javascript/mastodon/selectors/index.js
@@ -135,3 +135,11 @@ export const getAccountHidden = createSelector([
 ], (hidden, followingOrRequested, isSelf) => {
   return hidden && !(isSelf || followingOrRequested);
 });
+
+export const makeCustomEmojiMap = createSelector(
+  [state => state.get('custom_emojis')],
+  items => items.reduce(
+    (map, emoji) => map.set(emoji.get('shortcode'), emoji),
+    ImmutableMap(),
+  ),
+);
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index 3650e3ec8..0c4f726d8 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -1106,6 +1106,10 @@
       }
     }
   }
+
+  .reactions-bar--empty {
+    margin-top: 0;
+  }
 }
 
 .status__relative-time {
@@ -1228,6 +1232,16 @@
   align-items: center;
   gap: 18px;
   margin-top: 16px;
+
+  & > .emoji-picker-dropdown > .emoji-button {
+    padding: 0;
+  }
+}
+
+.status__action-bar-button {
+  .fa-plus {
+    padding-top: 1px;
+  }
 }
 
 .detailed-status__action-bar-dropdown {
@@ -3996,6 +4010,10 @@ a.status-card.compact:hover {
   text-align: center;
 }
 
+.detailed-status__button .emoji-button {
+  padding: 0;
+}
+
 .column-settings__outer {
   background: lighten($ui-base-color, 8%);
   padding: 15px;

From a47ecf6e695de79b9a964d0405e21563f6a8632e Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 30 Nov 2022 17:09:16 +0000
Subject: [PATCH 20/47] clean up new imports in vanilla flavour

---
 app/javascript/mastodon/components/status.js                   | 2 +-
 app/javascript/mastodon/components/status_action_bar.js        | 3 +--
 .../features/notifications/components/column_settings.js       | 1 -
 3 files changed, 2 insertions(+), 4 deletions(-)

diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index ec9e583e2..da926229e 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -22,7 +22,7 @@ import PictureInPicturePlaceholder from 'mastodon/components/picture_in_picture_
 // We use the component (and not the container) since we do not want
 // to use the progress bar to show download progress
 import Bundle from '../features/ui/components/bundle';
-import { visibleReactions } from '../../flavours/glitch/initial_state';
+import { visibleReactions } from '../initial_state';
 
 export const textForScreenReader = (intl, status, rebloggedByText = false) => {
   const displayName = status.getIn(['account', 'display_name']);
diff --git a/app/javascript/mastodon/components/status_action_bar.js b/app/javascript/mastodon/components/status_action_bar.js
index 54c9860cf..24e556466 100644
--- a/app/javascript/mastodon/components/status_action_bar.js
+++ b/app/javascript/mastodon/components/status_action_bar.js
@@ -6,11 +6,10 @@ import IconButton from './icon_button';
 import DropdownMenuContainer from '../containers/dropdown_menu_container';
 import { defineMessages, injectIntl } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
-import { me } from '../initial_state';
+import { me, maxReactions } from '../initial_state';
 import classNames from 'classnames';
 import { PERMISSION_MANAGE_USERS } from 'mastodon/permissions';
 import EmojiPickerDropdown from '../features/compose/containers/emoji_picker_dropdown_container';
-import { maxReactions } from '../../flavours/glitch/initial_state';
 
 const messages = defineMessages({
   delete: { id: 'status.delete', defaultMessage: 'Delete' },
diff --git a/app/javascript/mastodon/features/notifications/components/column_settings.js b/app/javascript/mastodon/features/notifications/components/column_settings.js
index 3e91ebc36..3b36e634e 100644
--- a/app/javascript/mastodon/features/notifications/components/column_settings.js
+++ b/app/javascript/mastodon/features/notifications/components/column_settings.js
@@ -6,7 +6,6 @@ import ClearColumnButton from './clear_column_button';
 import GrantPermissionButton from './grant_permission_button';
 import SettingToggle from './setting_toggle';
 import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_REPORTS } from 'mastodon/permissions';
-import PillBarButton from '../../../../flavours/glitch/features/notifications/components/pill_bar_button';
 
 export default class ColumnSettings extends React.PureComponent {
 

From 029097a1a0be1e7d652326cf04f933a5827fdb6f Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 30 Nov 2022 19:29:56 +0000
Subject: [PATCH 21/47] remove outdated comments

---
 app/javascript/flavours/glitch/components/status_reactions.js | 4 ----
 app/javascript/mastodon/components/status_reactions.js        | 4 ----
 2 files changed, 8 deletions(-)

diff --git a/app/javascript/flavours/glitch/components/status_reactions.js b/app/javascript/flavours/glitch/components/status_reactions.js
index 39956270a..df2a686ab 100644
--- a/app/javascript/flavours/glitch/components/status_reactions.js
+++ b/app/javascript/flavours/glitch/components/status_reactions.js
@@ -36,10 +36,6 @@ export default class StatusReactions extends ImmutablePureComponent {
       .filter(x => x.get('count') > 0)
       .sort((a, b) => b.get('count') - a.get('count'));
 
-    // numVisible might be NaN because it's pulled from local settings
-    // which doesn't do a whole lot of input validation, but that's okay
-    // because  NaN >= 0  evaluates false.
-    // Still, this should be improved at some point.
     if (numVisible >= 0) {
       visibleReactions = visibleReactions.filter((_, i) => i < numVisible);
     }
diff --git a/app/javascript/mastodon/components/status_reactions.js b/app/javascript/mastodon/components/status_reactions.js
index 39956270a..df2a686ab 100644
--- a/app/javascript/mastodon/components/status_reactions.js
+++ b/app/javascript/mastodon/components/status_reactions.js
@@ -36,10 +36,6 @@ export default class StatusReactions extends ImmutablePureComponent {
       .filter(x => x.get('count') > 0)
       .sort((a, b) => b.get('count') - a.get('count'));
 
-    // numVisible might be NaN because it's pulled from local settings
-    // which doesn't do a whole lot of input validation, but that's okay
-    // because  NaN >= 0  evaluates false.
-    // Still, this should be improved at some point.
     if (numVisible >= 0) {
       visibleReactions = visibleReactions.filter((_, i) => i < numVisible);
     }

From 935788db142a43aaf4fa64bba17b47de02b475cc Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Thu, 1 Dec 2022 01:41:47 +0000
Subject: [PATCH 22/47] fix reaction deletion bug and clean up controller

Turns out the strange error where it would delete
the wrong reaction occurred because I forgot to
pass the emoji name to the query, which resulted
in the database deleting the first reaction it
found.  Also, this removes the unused set_reaction
callback and includes the Authorization module for
the status reactions controller.
---
 .../api/v1/statuses/reactions_controller.rb            | 10 +++-------
 app/services/unreact_service.rb                        |  4 ++--
 2 files changed, 5 insertions(+), 9 deletions(-)

diff --git a/app/controllers/api/v1/statuses/reactions_controller.rb b/app/controllers/api/v1/statuses/reactions_controller.rb
index db43346de..9542d491c 100644
--- a/app/controllers/api/v1/statuses/reactions_controller.rb
+++ b/app/controllers/api/v1/statuses/reactions_controller.rb
@@ -1,11 +1,11 @@
 # frozen_string_literal: true
 
 class Api::V1::Statuses::ReactionsController < Api::BaseController
+  include Authorization
+
   before_action -> { doorkeeper_authorize! :write, :'write:favourites' }
   before_action :require_user!
-
   before_action :set_status
-  before_action :set_reaction, except: :update
 
   def update
     ReactService.new.call(current_account, @status, params[:id])
@@ -13,16 +13,12 @@ class Api::V1::Statuses::ReactionsController < Api::BaseController
   end
 
   def destroy
-    UnreactService.new.call(current_account, @status)
+    UnreactService.new.call(current_account, @status, params[:id])
     render_empty
   end
 
   private
 
-  def set_reaction
-    @reaction = @status.status_reactions.where(account: current_account).find_by!(name: params[:id])
-  end
-
   def set_status
     @status = Status.find(params[:status_id])
   end
diff --git a/app/services/unreact_service.rb b/app/services/unreact_service.rb
index ebc270383..f4089f33b 100644
--- a/app/services/unreact_service.rb
+++ b/app/services/unreact_service.rb
@@ -3,8 +3,8 @@
 class UnreactService < BaseService
   include Payloadable
 
-  def call(account, status)
-    reaction = StatusReaction.find_by(account: account, status: status)
+  def call(account, status, name)
+    reaction = StatusReaction.find_by(account: account, status: status, name: name)
     return if reaction.nil?
 
     reaction.destroy!

From e3f97f60a6790b248c2a6b2bca0a3f62a947fa8e Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Thu, 1 Dec 2022 02:24:08 +0000
Subject: [PATCH 23/47] change reaction api to match other interactions

Status reactions had an API similar to that of
announcement reactions, using PUT and DELETE at a
single endpoint.  I believe that for statuses, it
makes more sense to follow the convention of the
other interactions and use separate POST endpoints
for create and destroy respectively.
---
 app/controllers/api/v1/statuses/reactions_controller.rb | 2 +-
 app/javascript/flavours/glitch/actions/interactions.js  | 4 ++--
 app/javascript/mastodon/actions/interactions.js         | 4 ++--
 config/routes.rb                                        | 4 +++-
 4 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/app/controllers/api/v1/statuses/reactions_controller.rb b/app/controllers/api/v1/statuses/reactions_controller.rb
index 9542d491c..333054f2a 100644
--- a/app/controllers/api/v1/statuses/reactions_controller.rb
+++ b/app/controllers/api/v1/statuses/reactions_controller.rb
@@ -7,7 +7,7 @@ class Api::V1::Statuses::ReactionsController < Api::BaseController
   before_action :require_user!
   before_action :set_status
 
-  def update
+  def create
     ReactService.new.call(current_account, @status, params[:id])
     render_empty
   end
diff --git a/app/javascript/flavours/glitch/actions/interactions.js b/app/javascript/flavours/glitch/actions/interactions.js
index f65d7ec49..97cefaa20 100644
--- a/app/javascript/flavours/glitch/actions/interactions.js
+++ b/app/javascript/flavours/glitch/actions/interactions.js
@@ -416,7 +416,7 @@ export const addReaction = (statusId, name) => (dispatch, getState) => {
     dispatch(addReactionRequest(statusId, name, alreadyAdded));
   }
 
-  api(getState).put(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
+  api(getState).post(`/api/v1/statuses/${statusId}/react/${name}`).then(() => {
     dispatch(addReactionSuccess(statusId, name, alreadyAdded));
   }).catch(err => {
     if (!alreadyAdded) {
@@ -450,7 +450,7 @@ export const addReactionFail = (statusId, name, error) => ({
 export const removeReaction = (statusId, name) => (dispatch, getState) => {
   dispatch(removeReactionRequest(statusId, name));
 
-  api(getState).delete(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
+  api(getState).post(`/api/v1/statuses/${statusId}/unreact/${name}`).then(() => {
     dispatch(removeReactionSuccess(statusId, name));
   }).catch(err => {
     dispatch(removeReactionFail(statusId, name, err));
diff --git a/app/javascript/mastodon/actions/interactions.js b/app/javascript/mastodon/actions/interactions.js
index afae6705f..c2672845e 100644
--- a/app/javascript/mastodon/actions/interactions.js
+++ b/app/javascript/mastodon/actions/interactions.js
@@ -436,7 +436,7 @@ export const addReaction = (statusId, name) => (dispatch, getState) => {
     dispatch(addReactionRequest(statusId, name, alreadyAdded));
   }
 
-  api(getState).put(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
+  api(getState).post(`/api/v1/statuses/${statusId}/react/${name}`).then(() => {
     dispatch(addReactionSuccess(statusId, name, alreadyAdded));
   }).catch(err => {
     if (!alreadyAdded) {
@@ -470,7 +470,7 @@ export const addReactionFail = (statusId, name, error) => ({
 export const removeReaction = (statusId, name) => (dispatch, getState) => {
   dispatch(removeReactionRequest(statusId, name));
 
-  api(getState).delete(`/api/v1/statuses/${statusId}/reactions/${name}`).then(() => {
+  api(getState).post(`/api/v1/statuses/${statusId}/unreact/${name}`).then(() => {
     dispatch(removeReactionSuccess(statusId, name));
   }).catch(err => {
     dispatch(removeReactionFail(statusId, name, err));
diff --git a/config/routes.rb b/config/routes.rb
index da4ddfa20..2eeff8fcb 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -442,6 +442,9 @@ Rails.application.routes.draw do
           resource :favourite, only: :create
           post :unfavourite, to: 'favourites#destroy'
 
+          post '/react/:id', to: 'reactions#create'
+          post '/unreact/:id', to: 'reactions#destroy'
+
           resource :bookmark, only: :create
           post :unbookmark, to: 'bookmarks#destroy'
 
@@ -453,7 +456,6 @@ Rails.application.routes.draw do
 
           resource :history, only: :show
           resource :source, only: :show
-          resources :reactions, only: [:update, :destroy]
 
           post :translate, to: 'translations#create'
         end

From 14561a05c8fd37e91c309ea30a0f63f8abcb37e5 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Thu, 1 Dec 2022 04:26:13 +0000
Subject: [PATCH 24/47] remove unnecessary parameter

---
 app/javascript/flavours/glitch/actions/interactions.js | 4 ++--
 app/javascript/mastodon/actions/interactions.js        | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/javascript/flavours/glitch/actions/interactions.js b/app/javascript/flavours/glitch/actions/interactions.js
index 97cefaa20..3717fe5a1 100644
--- a/app/javascript/flavours/glitch/actions/interactions.js
+++ b/app/javascript/flavours/glitch/actions/interactions.js
@@ -413,11 +413,11 @@ export const addReaction = (statusId, name) => (dispatch, getState) => {
     }
   }
   if (!alreadyAdded) {
-    dispatch(addReactionRequest(statusId, name, alreadyAdded));
+    dispatch(addReactionRequest(statusId, name));
   }
 
   api(getState).post(`/api/v1/statuses/${statusId}/react/${name}`).then(() => {
-    dispatch(addReactionSuccess(statusId, name, alreadyAdded));
+    dispatch(addReactionSuccess(statusId, name));
   }).catch(err => {
     if (!alreadyAdded) {
       dispatch(addReactionFail(statusId, name, err));
diff --git a/app/javascript/mastodon/actions/interactions.js b/app/javascript/mastodon/actions/interactions.js
index c2672845e..b06c0457f 100644
--- a/app/javascript/mastodon/actions/interactions.js
+++ b/app/javascript/mastodon/actions/interactions.js
@@ -433,11 +433,11 @@ export const addReaction = (statusId, name) => (dispatch, getState) => {
     }
   }
   if (!alreadyAdded) {
-    dispatch(addReactionRequest(statusId, name, alreadyAdded));
+    dispatch(addReactionRequest(statusId, name));
   }
 
   api(getState).post(`/api/v1/statuses/${statusId}/react/${name}`).then(() => {
-    dispatch(addReactionSuccess(statusId, name, alreadyAdded));
+    dispatch(addReactionSuccess(statusId, name));
   }).catch(err => {
     if (!alreadyAdded) {
       dispatch(addReactionFail(statusId, name, err));

From 7187d6f9cf1a88216027da1d274276c0afd7d14c Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Thu, 1 Dec 2022 23:30:39 +0100
Subject: [PATCH 25/47] cleanup JS imports and other minor stuff

---
 .../flavours/glitch/actions/interactions.js           |  6 ------
 .../flavours/glitch/components/status_reactions.js    | 10 +---------
 .../glitch/features/local_settings/page/index.js      |  1 -
 .../glitch/features/local_settings/page/item/index.js | 11 +++++------
 .../features/status/components/detailed_status.js     |  2 +-
 .../flavours/glitch/features/status/index.js          |  3 +--
 app/javascript/flavours/glitch/initial_state.js       |  4 +++-
 app/javascript/mastodon/actions/interactions.js       |  6 ------
 app/javascript/mastodon/components/status.js          |  3 +--
 .../mastodon/components/status_reactions.js           | 10 +---------
 .../features/status/components/detailed_status.js     |  2 +-
 app/javascript/mastodon/features/status/index.js      |  3 +--
 app/javascript/mastodon/initial_state.js              |  4 +++-
 13 files changed, 18 insertions(+), 47 deletions(-)

diff --git a/app/javascript/flavours/glitch/actions/interactions.js b/app/javascript/flavours/glitch/actions/interactions.js
index 3717fe5a1..0df6db427 100644
--- a/app/javascript/flavours/glitch/actions/interactions.js
+++ b/app/javascript/flavours/glitch/actions/interactions.js
@@ -429,14 +429,12 @@ export const addReactionRequest = (statusId, name) => ({
   type: REACTION_ADD_REQUEST,
   id: statusId,
   name,
-  skipLoading: true,
 });
 
 export const addReactionSuccess = (statusId, name) => ({
   type: REACTION_ADD_SUCCESS,
   id: statusId,
   name,
-  skipLoading: true,
 });
 
 export const addReactionFail = (statusId, name, error) => ({
@@ -444,7 +442,6 @@ export const addReactionFail = (statusId, name, error) => ({
   id: statusId,
   name,
   error,
-  skipLoading: true,
 });
 
 export const removeReaction = (statusId, name) => (dispatch, getState) => {
@@ -461,19 +458,16 @@ export const removeReactionRequest = (statusId, name) => ({
   type: REACTION_REMOVE_REQUEST,
   id: statusId,
   name,
-  skipLoading: true,
 });
 
 export const removeReactionSuccess = (statusId, name) => ({
   type: REACTION_REMOVE_SUCCESS,
   id: statusId,
   name,
-  skipLoading: true,
 });
 
 export const removeReactionFail = (statusId, name) => ({
   type: REACTION_REMOVE_FAIL,
   id: statusId,
   name,
-  skipLoading: true,
 });
diff --git a/app/javascript/flavours/glitch/components/status_reactions.js b/app/javascript/flavours/glitch/components/status_reactions.js
index df2a686ab..63ec7941c 100644
--- a/app/javascript/flavours/glitch/components/status_reactions.js
+++ b/app/javascript/flavours/glitch/components/status_reactions.js
@@ -1,7 +1,7 @@
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
-import { reduceMotion } from '../initial_state';
+import { autoPlayGif, reduceMotion } from '../initial_state';
 import spring from 'react-motion/lib/spring';
 import TransitionMotion from 'react-motion/lib/TransitionMotion';
 import classNames from 'classnames';
@@ -9,7 +9,6 @@ import React from 'react';
 import unicodeMapping from '../features/emoji/emoji_unicode_mapping_light';
 import AnimatedNumber from './animated_number';
 import { assetHost } from '../utils/config';
-import { autoPlayGif } from '../initial_state';
 
 export default class StatusReactions extends ImmutablePureComponent {
 
@@ -101,19 +100,12 @@ class Reaction extends ImmutablePureComponent {
   render() {
     const { reaction } = this.props;
 
-    let shortCode = reaction.get('name');
-
-    if (unicodeMapping[shortCode]) {
-      shortCode = unicodeMapping[shortCode].shortCode;
-    }
-
     return (
       <button
         className={classNames('reactions-bar__item', { active: reaction.get('me') })}
         onClick={this.handleClick}
         onMouseEnter={this.handleMouseEnter}
         onMouseLeave={this.handleMouseLeave}
-        title={`:${shortCode}:`}
         style={this.props.style}
       >
         <span className='reactions-bar__item__emoji'>
diff --git a/app/javascript/flavours/glitch/features/local_settings/page/index.js b/app/javascript/flavours/glitch/features/local_settings/page/index.js
index cc8e1f8f2..d01eec811 100644
--- a/app/javascript/flavours/glitch/features/local_settings/page/index.js
+++ b/app/javascript/flavours/glitch/features/local_settings/page/index.js
@@ -29,7 +29,6 @@ const messages = defineMessages({
   rewrite_mentions_username: { id: 'settings.rewrite_mentions_username', defaultMessage:  'Rewrite with username' },
   pop_in_left: { id: 'settings.pop_in_left', defaultMessage: 'Left' },
   pop_in_right: { id: 'settings.pop_in_right', defaultMessage:  'Right' },
-  enter_amount_prompt: { id: 'settings.enter_amount_prompt', defaultMessage: 'Enter an amount' },
 });
 
 export default @injectIntl
diff --git a/app/javascript/flavours/glitch/features/local_settings/page/item/index.js b/app/javascript/flavours/glitch/features/local_settings/page/item/index.js
index 966fc5c1e..6b24e4143 100644
--- a/app/javascript/flavours/glitch/features/local_settings/page/item/index.js
+++ b/app/javascript/flavours/glitch/features/local_settings/page/item/index.js
@@ -21,21 +21,20 @@ export default class LocalSettingsPageItem extends React.PureComponent {
     })),
     settings: ImmutablePropTypes.map.isRequired,
     placeholder: PropTypes.string,
-    number: PropTypes.bool,
     disabled: PropTypes.bool,
   };
 
   handleChange = e => {
     const { target } = e;
-    const { item, onChange, options, placeholder, number } = this.props;
+    const { item, onChange, options, placeholder } = this.props;
     if (options && options.length > 0) onChange(item, target.value);
-    else if (placeholder) onChange(item, number ? parseInt(target.value) : target.value);
+    else if (placeholder) onChange(item, target.value);
     else onChange(item, target.checked);
   }
 
   render () {
     const { handleChange } = this;
-    const { settings, item, id, options, children, dependsOn, dependsOnNot, placeholder, number, disabled } = this.props;
+    const { settings, item, id, options, children, dependsOn, dependsOnNot, placeholder, disabled } = this.props;
     let enabled = !disabled;
 
     if (dependsOn) {
@@ -77,7 +76,7 @@ export default class LocalSettingsPageItem extends React.PureComponent {
           </fieldset>
         </div>
       );
-    } else if (placeholder || number) {
+    } else if (placeholder) {
       return (
         <div className='glitch local-settings__page__item string'>
           <label htmlFor={id}>
@@ -85,7 +84,7 @@ export default class LocalSettingsPageItem extends React.PureComponent {
             <p>
               <input
                 id={id}
-                type={number ? 'number' : 'text'}
+                type='text'
                 value={settings.getIn(item)}
                 placeholder={placeholder}
                 onChange={handleChange}
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.js b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
index 68e199e9c..835a0ead3 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.js
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
@@ -20,7 +20,7 @@ import Icon from 'flavours/glitch/components/icon';
 import AnimatedNumber from 'flavours/glitch/components/animated_number';
 import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder';
 import EditedTimestamp from 'flavours/glitch/components/edited_timestamp';
-import StatusReactions from '../../../components/status_reactions';
+import StatusReactions from 'flavours/glitch/components/status_reactions';
 
 export default @injectIntl
 class DetailedStatus extends ImmutablePureComponent {
diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js
index 3d0c503e7..910be5998 100644
--- a/app/javascript/flavours/glitch/features/status/index.js
+++ b/app/javascript/flavours/glitch/features/status/index.js
@@ -43,7 +43,7 @@ import { initMuteModal } from 'flavours/glitch/actions/mutes';
 import { initBlockModal } from 'flavours/glitch/actions/blocks';
 import { initReport } from 'flavours/glitch/actions/reports';
 import { initBoostModal } from 'flavours/glitch/actions/boosts';
-import { makeGetStatus } from 'flavours/glitch/selectors';
+import { makeCustomEmojiMap, makeGetStatus } from 'flavours/glitch/selectors';
 import ScrollContainer from 'flavours/glitch/containers/scroll_container';
 import ColumnBackButton from 'flavours/glitch/components/column_back_button';
 import ColumnHeader from '../../components/column_header';
@@ -58,7 +58,6 @@ import { autoUnfoldCW } from 'flavours/glitch/utils/content_warning';
 import { textForScreenReader, defaultMediaVisibility } from 'flavours/glitch/components/status';
 import Icon from 'flavours/glitch/components/icon';
 import { Helmet } from 'react-helmet';
-import { makeCustomEmojiMap } from '../../selectors';
 
 const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
diff --git a/app/javascript/flavours/glitch/initial_state.js b/app/javascript/flavours/glitch/initial_state.js
index cafa5b1bb..9431c6643 100644
--- a/app/javascript/flavours/glitch/initial_state.js
+++ b/app/javascript/flavours/glitch/initial_state.js
@@ -61,6 +61,7 @@
  * @property {boolean} limited_federation_mode
  * @property {string} locale
  * @property {string | null} mascot
+ * @property {number} max_reactions
  * @property {string=} me
  * @property {string=} moved_to_account_id
  * @property {string=} owner
@@ -79,6 +80,7 @@
  * @property {boolean} use_blurhash
  * @property {boolean=} use_pending_items
  * @property {string} version
+ * @property {number} visible_reactions
  * @property {boolean} translation_enabled
  * @property {object} local_settings
  */
@@ -124,7 +126,6 @@ export const mascot = getMeta('mascot');
 export const maxReactions = (initialState && initialState.max_reactions) || 1;
 export const me = getMeta('me');
 export const movedToAccountId = getMeta('moved_to_account_id');
-export const visibleReactions = getMeta('visible_reactions');
 export const owner = getMeta('owner');
 export const profile_directory = getMeta('profile_directory');
 export const reduceMotion = getMeta('reduce_motion');
@@ -140,6 +141,7 @@ export const unfollowModal = getMeta('unfollow_modal');
 export const useBlurhash = getMeta('use_blurhash');
 export const usePendingItems = getMeta('use_pending_items');
 export const version = getMeta('version');
+export const visibleReactions = getMeta('visible_reactions');
 export const translationEnabled = getMeta('translation_enabled');
 export const languages = initialState?.languages;
 
diff --git a/app/javascript/mastodon/actions/interactions.js b/app/javascript/mastodon/actions/interactions.js
index b06c0457f..dd1395cbd 100644
--- a/app/javascript/mastodon/actions/interactions.js
+++ b/app/javascript/mastodon/actions/interactions.js
@@ -449,14 +449,12 @@ export const addReactionRequest = (statusId, name) => ({
   type: REACTION_ADD_REQUEST,
   id: statusId,
   name,
-  skipLoading: true,
 });
 
 export const addReactionSuccess = (statusId, name) => ({
   type: REACTION_ADD_SUCCESS,
   id: statusId,
   name,
-  skipLoading: true,
 });
 
 export const addReactionFail = (statusId, name, error) => ({
@@ -464,7 +462,6 @@ export const addReactionFail = (statusId, name, error) => ({
   id: statusId,
   name,
   error,
-  skipLoading: true,
 });
 
 export const removeReaction = (statusId, name) => (dispatch, getState) => {
@@ -481,19 +478,16 @@ export const removeReactionRequest = (statusId, name) => ({
   type: REACTION_REMOVE_REQUEST,
   id: statusId,
   name,
-  skipLoading: true,
 });
 
 export const removeReactionSuccess = (statusId, name) => ({
   type: REACTION_REMOVE_SUCCESS,
   id: statusId,
   name,
-  skipLoading: true,
 });
 
 export const removeReactionFail = (statusId, name) => ({
   type: REACTION_REMOVE_FAIL,
   id: statusId,
   name,
-  skipLoading: true,
 });
diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index da926229e..284c5dbd7 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -16,13 +16,12 @@ import { MediaGallery, Video, Audio } from '../features/ui/util/async-components
 import { HotKeys } from 'react-hotkeys';
 import classNames from 'classnames';
 import Icon from 'mastodon/components/icon';
-import { displayMedia } from '../initial_state';
+import { displayMedia, visibleReactions } from '../initial_state';
 import PictureInPicturePlaceholder from 'mastodon/components/picture_in_picture_placeholder';
 
 // We use the component (and not the container) since we do not want
 // to use the progress bar to show download progress
 import Bundle from '../features/ui/components/bundle';
-import { visibleReactions } from '../initial_state';
 
 export const textForScreenReader = (intl, status, rebloggedByText = false) => {
   const displayName = status.getIn(['account', 'display_name']);
diff --git a/app/javascript/mastodon/components/status_reactions.js b/app/javascript/mastodon/components/status_reactions.js
index df2a686ab..63ec7941c 100644
--- a/app/javascript/mastodon/components/status_reactions.js
+++ b/app/javascript/mastodon/components/status_reactions.js
@@ -1,7 +1,7 @@
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
-import { reduceMotion } from '../initial_state';
+import { autoPlayGif, reduceMotion } from '../initial_state';
 import spring from 'react-motion/lib/spring';
 import TransitionMotion from 'react-motion/lib/TransitionMotion';
 import classNames from 'classnames';
@@ -9,7 +9,6 @@ import React from 'react';
 import unicodeMapping from '../features/emoji/emoji_unicode_mapping_light';
 import AnimatedNumber from './animated_number';
 import { assetHost } from '../utils/config';
-import { autoPlayGif } from '../initial_state';
 
 export default class StatusReactions extends ImmutablePureComponent {
 
@@ -101,19 +100,12 @@ class Reaction extends ImmutablePureComponent {
   render() {
     const { reaction } = this.props;
 
-    let shortCode = reaction.get('name');
-
-    if (unicodeMapping[shortCode]) {
-      shortCode = unicodeMapping[shortCode].shortCode;
-    }
-
     return (
       <button
         className={classNames('reactions-bar__item', { active: reaction.get('me') })}
         onClick={this.handleClick}
         onMouseEnter={this.handleMouseEnter}
         onMouseLeave={this.handleMouseLeave}
-        title={`:${shortCode}:`}
         style={this.props.style}
       >
         <span className='reactions-bar__item__emoji'>
diff --git a/app/javascript/mastodon/features/status/components/detailed_status.js b/app/javascript/mastodon/features/status/components/detailed_status.js
index ccc7866d4..f34b66110 100644
--- a/app/javascript/mastodon/features/status/components/detailed_status.js
+++ b/app/javascript/mastodon/features/status/components/detailed_status.js
@@ -17,7 +17,7 @@ import Icon from 'mastodon/components/icon';
 import AnimatedNumber from 'mastodon/components/animated_number';
 import PictureInPicturePlaceholder from 'mastodon/components/picture_in_picture_placeholder';
 import EditedTimestamp from 'mastodon/components/edited_timestamp';
-import StatusReactions from '../../../components/status_reactions';
+import StatusReactions from 'mastodon/components/status_reactions';
 
 const messages = defineMessages({
   public_short: { id: 'privacy.public.short', defaultMessage: 'Public' },
diff --git a/app/javascript/mastodon/features/status/index.js b/app/javascript/mastodon/features/status/index.js
index 393080478..e262cd94f 100644
--- a/app/javascript/mastodon/features/status/index.js
+++ b/app/javascript/mastodon/features/status/index.js
@@ -50,7 +50,7 @@ import { initMuteModal } from '../../actions/mutes';
 import { initBlockModal } from '../../actions/blocks';
 import { initBoostModal } from '../../actions/boosts';
 import { initReport } from '../../actions/reports';
-import { makeGetStatus, makeGetPictureInPicture } from '../../selectors';
+import { makeCustomEmojiMap, makeGetStatus, makeGetPictureInPicture } from '../../selectors';
 import ScrollContainer from 'mastodon/containers/scroll_container';
 import ColumnBackButton from '../../components/column_back_button';
 import ColumnHeader from '../../components/column_header';
@@ -64,7 +64,6 @@ import { attachFullscreenListener, detachFullscreenListener, isFullscreen } from
 import { textForScreenReader, defaultMediaVisibility } from '../../components/status';
 import Icon from 'mastodon/components/icon';
 import { Helmet } from 'react-helmet';
-import { makeCustomEmojiMap } from '../../selectors';
 
 const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
diff --git a/app/javascript/mastodon/initial_state.js b/app/javascript/mastodon/initial_state.js
index 5f5b1babd..9db8b2332 100644
--- a/app/javascript/mastodon/initial_state.js
+++ b/app/javascript/mastodon/initial_state.js
@@ -61,6 +61,7 @@
  * @property {boolean} limited_federation_mode
  * @property {string} locale
  * @property {string | null} mascot
+ * @property {number} max_reactions
  * @property {string=} me
  * @property {string=} moved_to_account_id
  * @property {string=} owner
@@ -79,6 +80,7 @@
  * @property {boolean} use_blurhash
  * @property {boolean=} use_pending_items
  * @property {string} version
+ * @property {number} visible_reactions
  * @property {boolean} translation_enabled
  */
 
@@ -116,7 +118,6 @@ export const mascot = getMeta('mascot');
 export const maxReactions = (initialState && initialState.max_reactions) || 1;
 export const me = getMeta('me');
 export const movedToAccountId = getMeta('moved_to_account_id');
-export const visibleReactions = getMeta('visible_reactions');
 export const owner = getMeta('owner');
 export const profile_directory = getMeta('profile_directory');
 export const reduceMotion = getMeta('reduce_motion');
@@ -132,6 +133,7 @@ export const unfollowModal = getMeta('unfollow_modal');
 export const useBlurhash = getMeta('use_blurhash');
 export const usePendingItems = getMeta('use_pending_items');
 export const version = getMeta('version');
+export const visibleReactions = getMeta('visible_reactions');
 export const translationEnabled = getMeta('translation_enabled');
 export const languages = initialState?.languages;
 

From 6aa7d7fb12f86783706e5dabb465d1257fd2a23e Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Fri, 2 Dec 2022 01:00:08 +0000
Subject: [PATCH 26/47] rename nop handler to handleNoOp

This also adds the comment in action_bar.js to
status_action_bar.js, clarifying that a future
version could improve this code by modifying
EmojiPickerDropdown.
---
 .../flavours/glitch/components/status_action_bar.js           | 4 ++--
 .../flavours/glitch/features/status/components/action_bar.js  | 4 ++--
 app/javascript/mastodon/components/status_action_bar.js       | 4 ++--
 .../mastodon/features/status/components/action_bar.js         | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/app/javascript/flavours/glitch/components/status_action_bar.js b/app/javascript/flavours/glitch/components/status_action_bar.js
index 44e5c770d..36a3f8307 100644
--- a/app/javascript/flavours/glitch/components/status_action_bar.js
+++ b/app/javascript/flavours/glitch/components/status_action_bar.js
@@ -208,7 +208,7 @@ class StatusActionBar extends ImmutablePureComponent {
     this.props.onAddFilter(this.props.status);
   }
 
-  nop = () => {}
+  handleNoOp = () => {} // hack for reaction add button
 
   render () {
     const { status, intl, withDismiss, withCounters, showReplyCount, scrollKey } = this.props;
@@ -315,7 +315,7 @@ class StatusActionBar extends ImmutablePureComponent {
     const reactButton = (
       <IconButton
         className='status__action-bar-button'
-        onClick={this.nop} // EmojiPickerDropdown handles that
+        onClick={this.handleNoOp} // EmojiPickerDropdown handles that
         title={intl.formatMessage(messages.react)}
         disabled={!canReact}
         icon='plus'
diff --git a/app/javascript/flavours/glitch/features/status/components/action_bar.js b/app/javascript/flavours/glitch/features/status/components/action_bar.js
index f93e3d0a3..619c57685 100644
--- a/app/javascript/flavours/glitch/features/status/components/action_bar.js
+++ b/app/javascript/flavours/glitch/features/status/components/action_bar.js
@@ -144,7 +144,7 @@ class ActionBar extends React.PureComponent {
     navigator.clipboard.writeText(url);
   }
 
-  nop = () => {} // hack for reaction add button
+  handleNoOp = () => {} // hack for reaction add button
 
   render () {
     const { status, intl } = this.props;
@@ -207,7 +207,7 @@ class ActionBar extends React.PureComponent {
     const reactButton = (
       <IconButton
         className='plus-icon'
-        onClick={this.nop} // EmojiPickerDropdown handles that
+        onClick={this.handleNoOp} // EmojiPickerDropdown handles that
         title={intl.formatMessage(messages.react)}
         disabled={!canReact}
         icon='plus'
diff --git a/app/javascript/mastodon/components/status_action_bar.js b/app/javascript/mastodon/components/status_action_bar.js
index 24e556466..0f8d54814 100644
--- a/app/javascript/mastodon/components/status_action_bar.js
+++ b/app/javascript/mastodon/components/status_action_bar.js
@@ -243,7 +243,7 @@ class StatusActionBar extends ImmutablePureComponent {
     this.props.onFilter();
   }
 
-  nop = () => {}
+  handleNoOp = () => {} // hack for reaction add button
 
   render () {
     const { status, relationship, intl, withDismiss, withCounters, scrollKey } = this.props;
@@ -368,7 +368,7 @@ class StatusActionBar extends ImmutablePureComponent {
     const reactButton = (
       <IconButton
         className='status__action-bar-button'
-        onClick={this.nop} // EmojiPickerDropdown handles that
+        onClick={this.handleNoOp} // EmojiPickerDropdown handles that
         title={intl.formatMessage(messages.react)}
         disabled={!canReact}
         icon='plus'
diff --git a/app/javascript/mastodon/features/status/components/action_bar.js b/app/javascript/mastodon/features/status/components/action_bar.js
index ce272e448..095bccfa8 100644
--- a/app/javascript/mastodon/features/status/components/action_bar.js
+++ b/app/javascript/mastodon/features/status/components/action_bar.js
@@ -186,7 +186,7 @@ class ActionBar extends React.PureComponent {
     navigator.clipboard.writeText(url);
   }
 
-  nop = () => {} // hack for reaction add button
+  handleNoOp = () => {} // hack for reaction add button
 
   render () {
     const { status, relationship, intl } = this.props;
@@ -263,7 +263,7 @@ class ActionBar extends React.PureComponent {
     const reactButton = (
       <IconButton
         className='plus-icon'
-        onClick={this.nop} // EmojiPickerDropdown handles that
+        onClick={this.handleNoOp} // EmojiPickerDropdown handles that
         title={intl.formatMessage(messages.react)}
         disabled={!canReact}
         icon='plus'

From bdd3c4691d659c57448edc14a6d3b1f67962b956 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Fri, 2 Dec 2022 01:52:59 +0000
Subject: [PATCH 27/47] fix padding on posts without reactions

The margins of the elements above and below the
main reaction list element overlapped before
reactions were added.  Adding display: none to
empty reaction bars restores this exact look.
---
 app/javascript/flavours/glitch/styles/components/status.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss
index c746a0bb1..8268aecdf 100644
--- a/app/javascript/flavours/glitch/styles/components/status.scss
+++ b/app/javascript/flavours/glitch/styles/components/status.scss
@@ -432,7 +432,7 @@
   }
 
   .reactions-bar--empty {
-    margin-top: 0;
+    display: none;
   }
 }
 

From 5de3784c9ba2296953706aca1808069664e5f0a6 Mon Sep 17 00:00:00 2001
From: Jeremy Kescher <jeremy@kescher.at>
Date: Fri, 2 Dec 2022 08:05:10 +0100
Subject: [PATCH 28/47] Add reaction limit to instance serializer

---
 app/serializers/rest/instance_serializer.rb    | 4 ++++
 app/serializers/rest/v1/instance_serializer.rb | 4 ++++
 2 files changed, 8 insertions(+)

diff --git a/app/serializers/rest/instance_serializer.rb b/app/serializers/rest/instance_serializer.rb
index 5ae1099d0..e28c93220 100644
--- a/app/serializers/rest/instance_serializer.rb
+++ b/app/serializers/rest/instance_serializer.rb
@@ -76,6 +76,10 @@ class REST::InstanceSerializer < ActiveModel::Serializer
       translation: {
         enabled: TranslationService.configured?,
       },
+
+      reactions: {
+        max_reactions: StatusReactionValidator::LIMIT,
+      },
     }
   end
 
diff --git a/app/serializers/rest/v1/instance_serializer.rb b/app/serializers/rest/v1/instance_serializer.rb
index 389ec7dff..0bee371bc 100644
--- a/app/serializers/rest/v1/instance_serializer.rb
+++ b/app/serializers/rest/v1/instance_serializer.rb
@@ -96,6 +96,10 @@ class REST::V1::InstanceSerializer < ActiveModel::Serializer
         min_expiration: PollValidator::MIN_EXPIRATION,
         max_expiration: PollValidator::MAX_EXPIRATION,
       },
+
+      reactions: {
+        max_reactions: StatusReactionValidator::LIMIT,
+      },
     }
   end
 

From 90a4c158f7c0ac25bdb55ad7d5e69bc969605829 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Fri, 2 Dec 2022 09:37:56 +0000
Subject: [PATCH 29/47] sanitize setting for number of visible reactions

This is kind of a hack, but the lack of
validation for settings unfortunately makes it
necessary.
---
 app/lib/user_settings_decorator.rb                       | 9 ++++++---
 app/views/settings/preferences/appearance/show.html.haml | 2 +-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/app/lib/user_settings_decorator.rb b/app/lib/user_settings_decorator.rb
index 17fbacf0d..f4360b947 100644
--- a/app/lib/user_settings_decorator.rb
+++ b/app/lib/user_settings_decorator.rb
@@ -160,7 +160,7 @@ class UserSettingsDecorator
   end
 
   def visible_reactions_preference
-    integer_cast_setting 'setting_visible_reactions'
+    integer_cast_setting('setting_visible_reactions', 0)
   end
 
   def always_send_emails_preference
@@ -171,8 +171,11 @@ class UserSettingsDecorator
     ActiveModel::Type::Boolean.new.cast(settings[key])
   end
 
-  def integer_cast_setting(key)
-    ActiveModel::Type::Integer.new.cast(settings[key])
+  def integer_cast_setting(key, min = nil, max = nil)
+    i = ActiveModel::Type::Integer.new.cast(settings[key])
+    return min if !min.nil? && i < min
+    return max if !max.nil? && i > max
+    i
   end
 
   def coerced_settings(key)
diff --git a/app/views/settings/preferences/appearance/show.html.haml b/app/views/settings/preferences/appearance/show.html.haml
index 6c5f7414e..af8cd4bd8 100644
--- a/app/views/settings/preferences/appearance/show.html.haml
+++ b/app/views/settings/preferences/appearance/show.html.haml
@@ -37,7 +37,7 @@
     = f.input :setting_crop_images, as: :boolean, wrapper: :with_label
 
   .fields-group.fields-row__column.fields-row__column-6
-    = f.input :setting_visible_reactions, wrapper: :with_label, input_html: { type: 'number', data: { default: '6' } }, hint: false
+    = f.input :setting_visible_reactions, wrapper: :with_label, input_html: { type: 'number', min: '0', data: { default: '6' } }, hint: false
 
   %h4= t 'appearance.discovery'
 

From ea82a96b47bbca5ce6f33bee169e0ebc473a42ae Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Fri, 2 Dec 2022 10:17:59 +0000
Subject: [PATCH 30/47] fix integer cast bug

Gotta love Rails.
---
 app/lib/user_settings_decorator.rb | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/app/lib/user_settings_decorator.rb b/app/lib/user_settings_decorator.rb
index f4360b947..92c393785 100644
--- a/app/lib/user_settings_decorator.rb
+++ b/app/lib/user_settings_decorator.rb
@@ -173,6 +173,8 @@ class UserSettingsDecorator
 
   def integer_cast_setting(key, min = nil, max = nil)
     i = ActiveModel::Type::Integer.new.cast(settings[key])
+    # the cast above doesn't return a number if passed the string "e"
+    i = 0 unless i.is_a? Numeric
     return min if !min.nil? && i < min
     return max if !max.nil? && i > max
     i

From 8dcf7b224ca2b96c3694e328a99b067b2caea2c9 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Fri, 2 Dec 2022 17:02:06 +0000
Subject: [PATCH 31/47] download remote custom emojis from reactions

Emoji reactions containing custom emojis from
remote instances were assumed to already have
been downloaded and stored in the database.
This might obviously not be the case.
---
 app/lib/activitypub/activity.rb             | 26 +++++++++++++++++
 app/lib/activitypub/activity/emoji_react.rb | 13 +++++++--
 app/lib/activitypub/activity/like.rb        | 32 ++++++++++++++-------
 3 files changed, 58 insertions(+), 13 deletions(-)

diff --git a/app/lib/activitypub/activity.rb b/app/lib/activitypub/activity.rb
index a6b91f62d..29df44506 100644
--- a/app/lib/activitypub/activity.rb
+++ b/app/lib/activitypub/activity.rb
@@ -176,4 +176,30 @@ class ActivityPub::Activity
     Rails.logger.info("Rejected #{@json['type']} activity #{@json['id']} from #{@account.uri}#{@options[:relayed_through_actor] && "via #{@options[:relayed_through_actor].uri}"}")
     nil
   end
+
+  # Ensure all emojis declared in the activity's tags are
+  # present in the database and downloaded to the local cache.
+  def process_emoji_tags
+    as_array(@object['tag']).each do |tag|
+      process_single_emoji(tag) if tag['type'] == 'Emoji'
+    end
+  end
+
+  def process_single_emoji(tag)
+    parser = ActivityPub::Parser::CustomEmojiParser.new(tag)
+    return if parser.shortcode.blank? || parser.image_remote_url.blank?
+
+    emoji = CustomEmoji.find_by(shortcode: parser.shortcode, domain: @account.domain)
+    return unless emoji.nil? ||
+                  parser.image_remote_url != emoji.image_remote_url ||
+                  (parser.updated_at && parser.updated_at >= emoji.updated_at)
+
+    begin
+      emoji ||= CustomEmoji.new(domain: @account.domain, shortcode: parser.shortcode, uri: parser.uri)
+      emoji.image_remote_url = parser.image_remote_url
+      emoji.save
+    rescue Seahorse::Client::NetworkingError => e
+      Rails.logger.warn "Error fetching emoji: #{e}"
+    end
+  end
 end
diff --git a/app/lib/activitypub/activity/emoji_react.rb b/app/lib/activitypub/activity/emoji_react.rb
index 595751aaa..c3d50b1e0 100644
--- a/app/lib/activitypub/activity/emoji_react.rb
+++ b/app/lib/activitypub/activity/emoji_react.rb
@@ -5,9 +5,16 @@ class ActivityPub::Activity::EmojiReact < ActivityPub::Activity
     original_status = status_from_uri(object_uri)
     name = @json['content']
     return if original_status.nil? ||
-      !original_status.account.local? ||
-      delete_arrived_first?(@json['id']) ||
-      @account.reacted?(original_status, name)
+              !original_status.account.local? ||
+              delete_arrived_first?(@json['id']) ||
+              @account.reacted?(original_status, name)
+
+    if name =~ /^:.*:$/
+      process_emoji_tags
+
+      name.delete! ':'
+      return if CustomEmoji.find_by(shortcode: name, domain: @account.domain).nil?
+    end
 
     reaction = original_status.status_reactions.create!(account: @account, name: name)
 
diff --git a/app/lib/activitypub/activity/like.rb b/app/lib/activitypub/activity/like.rb
index 6af516d10..311a58d3c 100644
--- a/app/lib/activitypub/activity/like.rb
+++ b/app/lib/activitypub/activity/like.rb
@@ -5,16 +5,7 @@ class ActivityPub::Activity::Like < ActivityPub::Activity
     original_status = status_from_uri(object_uri)
     return if original_status.nil? || !original_status.account.local? || delete_arrived_first?(@json['id'])
 
-    # misskey delivers reactions as likes and attaches the emoji in _misskey_reaction
-    mk_reaction = @json['_misskey_reaction']
-    unless mk_reaction.nil?
-      custom_emoji = CustomEmoji.find_by(shortcode: mk_reaction, domain: @account.domain)
-      return if @account.reacted?(original_status, mk_reaction, custom_emoji)
-
-      reaction = original_status.status_reactions.create!(account: @account, name: mk_reaction, custom_emoji: custom_emoji)
-      LocalNotificationWorker.perform_async(original_status.account_id, reaction.id, 'StatusReaction', 'reaction')
-      return
-    end
+    return if maybe_process_misskey_reaction(original_status)
 
     return if @account.favourited?(original_status)
 
@@ -23,4 +14,25 @@ class ActivityPub::Activity::Like < ActivityPub::Activity
     LocalNotificationWorker.perform_async(original_status.account_id, favourite.id, 'Favourite', 'favourite')
     Trends.statuses.register(original_status)
   end
+
+  # Misskey delivers reactions as likes with the emoji in _misskey_reaction
+  # see https://misskey-hub.net/ns.html#misskey-reaction for details
+  def maybe_process_misskey_reaction(original_status)
+    name = @json['_misskey_reaction']
+    return false if name.nil?
+
+    custom_emoji = nil
+    if name =~ /^:.*:$/
+      process_emoji_tags
+
+      name.delete! ':'
+      custom_emoji = CustomEmoji.find_by(shortcode: name, domain: @account.domain)
+      return false if custom_emoji.nil? # invalid custom emoji, treat it as a regular like
+    end
+    return true if @account.reacted?(original_status, name, custom_emoji)
+
+    reaction = original_status.status_reactions.create!(account: @account, name: name, custom_emoji: custom_emoji)
+    LocalNotificationWorker.perform_async(original_status.account_id, reaction.id, 'StatusReaction', 'reaction')
+    return true
+  end
 end

From e0607e36a97079b502d91688c8d5b181f92e7592 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sat, 3 Dec 2022 08:24:23 +0000
Subject: [PATCH 32/47] support Undo action for EmojiReaction

---
 app/lib/activitypub/activity/undo.rb | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/app/lib/activitypub/activity/undo.rb b/app/lib/activitypub/activity/undo.rb
index 9eff1b71c..54cda1947 100644
--- a/app/lib/activitypub/activity/undo.rb
+++ b/app/lib/activitypub/activity/undo.rb
@@ -11,6 +11,8 @@ class ActivityPub::Activity::Undo < ActivityPub::Activity
       undo_follow
     when 'Like'
       undo_like
+    when 'EmojiReact'
+      undo_emoji_react
     when 'Block'
       undo_block
     when nil
@@ -113,6 +115,22 @@ class ActivityPub::Activity::Undo < ActivityPub::Activity
     end
   end
 
+  def undo_emoji_react
+    name = @object['content']
+    return if name.nil?
+
+    status = status_from_uri(target_uri)
+
+    return if status.nil? || !status.account.local?
+
+    if @account.reacted?(status, name.delete(':'))
+      reaction = status.status_reactions.where(account: @account, name: name).first
+      reaction&.destroy
+    else
+      delete_later!(object_uri)
+    end
+  end
+
   def undo_block
     target_account = account_from_uri(target_uri)
 

From a688a0b880a14eae4853641cb2dba45e137254ff Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sat, 3 Dec 2022 10:22:15 +0000
Subject: [PATCH 33/47] handle incoming custom emoji reactions properly

---
 app/lib/activitypub/activity.rb             | 23 ++++++++++++---------
 app/lib/activitypub/activity/emoji_react.rb |  8 ++++---
 app/lib/activitypub/activity/like.rb        |  6 +++---
 app/models/concerns/account_interactions.rb |  4 ++--
 app/models/status_reaction.rb               |  7 ++++++-
 5 files changed, 29 insertions(+), 19 deletions(-)

diff --git a/app/lib/activitypub/activity.rb b/app/lib/activitypub/activity.rb
index 29df44506..8324dfe71 100644
--- a/app/lib/activitypub/activity.rb
+++ b/app/lib/activitypub/activity.rb
@@ -179,24 +179,27 @@ class ActivityPub::Activity
 
   # Ensure all emojis declared in the activity's tags are
   # present in the database and downloaded to the local cache.
-  def process_emoji_tags
-    as_array(@object['tag']).each do |tag|
-      process_single_emoji(tag) if tag['type'] == 'Emoji'
+  # Required by EmojiReact and Like for emoji reactions.
+  def process_emoji_tags(tags)
+    as_array(tags).each do |tag|
+      process_single_emoji tag if tag['type'] == 'Emoji'
     end
   end
 
   def process_single_emoji(tag)
-    parser = ActivityPub::Parser::CustomEmojiParser.new(tag)
-    return if parser.shortcode.blank? || parser.image_remote_url.blank?
+    custom_emoji_parser = ActivityPub::Parser::CustomEmojiParser.new(tag)
+    return if custom_emoji_parser.shortcode.blank? || custom_emoji_parser.image_remote_url.blank?
 
-    emoji = CustomEmoji.find_by(shortcode: parser.shortcode, domain: @account.domain)
+    emoji = CustomEmoji.find_by(shortcode: custom_emoji_parser.shortcode, domain: @account.domain)
     return unless emoji.nil? ||
-                  parser.image_remote_url != emoji.image_remote_url ||
-                  (parser.updated_at && parser.updated_at >= emoji.updated_at)
+                  custom_emoji_parser.image_remote_url != emoji.image_remote_url ||
+                  (custom_emoji_parser.updated_at && custom_emoji_parser.updated_at >= emoji.updated_at)
 
     begin
-      emoji ||= CustomEmoji.new(domain: @account.domain, shortcode: parser.shortcode, uri: parser.uri)
-      emoji.image_remote_url = parser.image_remote_url
+      emoji ||= CustomEmoji.new(domain: @account.domain,
+                                shortcode: custom_emoji_parser.shortcode,
+                                uri: custom_emoji_parser.uri)
+      emoji.image_remote_url = custom_emoji_parser.image_remote_url
       emoji.save
     rescue Seahorse::Client::NetworkingError => e
       Rails.logger.warn "Error fetching emoji: #{e}"
diff --git a/app/lib/activitypub/activity/emoji_react.rb b/app/lib/activitypub/activity/emoji_react.rb
index c3d50b1e0..2730270fc 100644
--- a/app/lib/activitypub/activity/emoji_react.rb
+++ b/app/lib/activitypub/activity/emoji_react.rb
@@ -9,14 +9,16 @@ class ActivityPub::Activity::EmojiReact < ActivityPub::Activity
               delete_arrived_first?(@json['id']) ||
               @account.reacted?(original_status, name)
 
+    custom_emoji = nil
     if name =~ /^:.*:$/
-      process_emoji_tags
+      process_emoji_tags(@json['tag'])
 
       name.delete! ':'
-      return if CustomEmoji.find_by(shortcode: name, domain: @account.domain).nil?
+      custom_emoji = CustomEmoji.find_by(shortcode: name, domain: @account.domain)
+      return if custom_emoji.nil?
     end
 
-    reaction = original_status.status_reactions.create!(account: @account, name: name)
+    reaction = original_status.status_reactions.create!(account: @account, name: name, custom_emoji: custom_emoji)
 
     LocalNotificationWorker.perform_async(original_status.account_id, reaction.id, 'StatusReaction', 'reaction')
   end
diff --git a/app/lib/activitypub/activity/like.rb b/app/lib/activitypub/activity/like.rb
index 311a58d3c..66d8e59c8 100644
--- a/app/lib/activitypub/activity/like.rb
+++ b/app/lib/activitypub/activity/like.rb
@@ -23,16 +23,16 @@ class ActivityPub::Activity::Like < ActivityPub::Activity
 
     custom_emoji = nil
     if name =~ /^:.*:$/
-      process_emoji_tags
+      process_emoji_tags(@json['tag'])
 
       name.delete! ':'
       custom_emoji = CustomEmoji.find_by(shortcode: name, domain: @account.domain)
       return false if custom_emoji.nil? # invalid custom emoji, treat it as a regular like
     end
-    return true if @account.reacted?(original_status, name, custom_emoji)
+    return true if @account.reacted?(original_status, name)
 
     reaction = original_status.status_reactions.create!(account: @account, name: name, custom_emoji: custom_emoji)
     LocalNotificationWorker.perform_async(original_status.account_id, reaction.id, 'StatusReaction', 'reaction')
-    return true
+    true
   end
 end
diff --git a/app/models/concerns/account_interactions.rb b/app/models/concerns/account_interactions.rb
index b8dd7e4d0..f93dfecc5 100644
--- a/app/models/concerns/account_interactions.rb
+++ b/app/models/concerns/account_interactions.rb
@@ -235,8 +235,8 @@ module AccountInteractions
     status.proper.favourites.where(account: self).exists?
   end
 
-  def reacted?(status, name, custom_emoji = nil)
-    status.proper.status_reactions.where(account: self, name: name, custom_emoji: custom_emoji).exists?
+  def reacted?(status, name)
+    status.proper.status_reactions.where(account: self, name: name).exists?
   end
 
   def bookmarked?(status)
diff --git a/app/models/status_reaction.rb b/app/models/status_reaction.rb
index 32cb9edd4..4793ff9aa 100644
--- a/app/models/status_reaction.rb
+++ b/app/models/status_reaction.rb
@@ -24,6 +24,11 @@ class StatusReaction < ApplicationRecord
   private
 
   def set_custom_emoji
-    self.custom_emoji = CustomEmoji.local.find_by(disabled: false, shortcode: name) if name.present?
+    return if name.blank?
+    self.custom_emoji = if account.local?
+                          CustomEmoji.local.find_by(disabled: false, shortcode: name)
+                        else
+                          CustomEmoji.find_by(shortcode: name, domain: account.domain)
+                        end
   end
 end

From 0ea02e608cf0ce0747a50130b9629af48ef3f7f9 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sat, 3 Dec 2022 11:57:00 +0000
Subject: [PATCH 34/47] display external custom emoji reactions properly

Using an emoji map was completely unnecessary in
the first place, because the reaction list from
the API response includes URLs for every custom
emoji anyway.  The reaction list now also contains
a boolean field indicating whether it is an
external custom emoji, which is required because
people should only be able to react with Unicode
emojis and local custom ones, not with custom
emojis from other servers.
---
 .../flavours/glitch/components/status.js      |  2 --
 .../glitch/components/status_action_bar.js    | 11 ++-----
 .../glitch/components/status_reactions.js     | 33 ++++++++++---------
 .../glitch/containers/status_container.js     |  2 --
 .../features/status/components/action_bar.js  |  2 +-
 .../status/components/detailed_status.js      |  2 --
 .../flavours/glitch/features/status/index.js  |  4 +--
 .../flavours/glitch/selectors/index.js        | 10 +-----
 app/serializers/rest/reaction_serializer.rb   | 10 +++++-
 9 files changed, 32 insertions(+), 44 deletions(-)

diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js
index 3ef5f453f..08cfbdada 100644
--- a/app/javascript/flavours/glitch/components/status.js
+++ b/app/javascript/flavours/glitch/components/status.js
@@ -105,7 +105,6 @@ class Status extends ImmutablePureComponent {
     scrollKey: PropTypes.string,
     deployPictureInPicture: PropTypes.func,
     settings: ImmutablePropTypes.map.isRequired,
-    emojiMap: ImmutablePropTypes.map.isRequired,
     pictureInPicture: PropTypes.shape({
       inUse: PropTypes.bool,
       available: PropTypes.bool,
@@ -811,7 +810,6 @@ class Status extends ImmutablePureComponent {
             numVisible={visibleReactions}
             addReaction={this.props.onReactionAdd}
             removeReaction={this.props.onReactionRemove}
-            emojiMap={this.props.emojiMap}
           />
 
           {!isCollapsed || !(muted || !settings.getIn(['collapsed', 'show_action_bar'])) ? (
diff --git a/app/javascript/flavours/glitch/components/status_action_bar.js b/app/javascript/flavours/glitch/components/status_action_bar.js
index 36a3f8307..5129d3a68 100644
--- a/app/javascript/flavours/glitch/components/status_action_bar.js
+++ b/app/javascript/flavours/glitch/components/status_action_bar.js
@@ -118,13 +118,7 @@ class StatusActionBar extends ImmutablePureComponent {
   }
 
   handleEmojiPick = data => {
-    const { signedIn } = this.context.identity;
-
-    if (signedIn) {
-      this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''));
-    } else {
-      this.props.onInteractionModal('favourite', this.props.status);
-    }
+    this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''));
   }
 
   handleReblogClick = e => {
@@ -212,6 +206,7 @@ class StatusActionBar extends ImmutablePureComponent {
 
   render () {
     const { status, intl, withDismiss, withCounters, showReplyCount, scrollKey } = this.props;
+    const { signedIn } = this.context.identity;
 
     const anonymousAccess    = !me;
     const mutingConversation = status.get('muted');
@@ -311,7 +306,7 @@ class StatusActionBar extends ImmutablePureComponent {
       <IconButton className='status__action-bar-button' title={intl.formatMessage(messages.hide)} icon='eye' onClick={this.handleHideClick} />
     );
 
-    const canReact = status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
+    const canReact = signedIn && status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
     const reactButton = (
       <IconButton
         className='status__action-bar-button'
diff --git a/app/javascript/flavours/glitch/components/status_reactions.js b/app/javascript/flavours/glitch/components/status_reactions.js
index 63ec7941c..e263a6480 100644
--- a/app/javascript/flavours/glitch/components/status_reactions.js
+++ b/app/javascript/flavours/glitch/components/status_reactions.js
@@ -18,7 +18,6 @@ export default class StatusReactions extends ImmutablePureComponent {
     numVisible: PropTypes.number,
     addReaction: PropTypes.func.isRequired,
     removeReaction: PropTypes.func.isRequired,
-    emojiMap: ImmutablePropTypes.map.isRequired,
   };
 
   willEnter() {
@@ -57,7 +56,6 @@ export default class StatusReactions extends ImmutablePureComponent {
                 style={{ transform: `scale(${style.scale})`, position: style.scale < 0.5 ? 'absolute' : 'static' }}
                 addReaction={this.props.addReaction}
                 removeReaction={this.props.removeReaction}
-                emojiMap={this.props.emojiMap}
               />
             ))}
           </div>
@@ -75,7 +73,6 @@ class Reaction extends ImmutablePureComponent {
     reaction: ImmutablePropTypes.map.isRequired,
     addReaction: PropTypes.func.isRequired,
     removeReaction: PropTypes.func.isRequired,
-    emojiMap: ImmutablePropTypes.map.isRequired,
     style: PropTypes.object,
   };
 
@@ -86,10 +83,12 @@ class Reaction extends ImmutablePureComponent {
   handleClick = () => {
     const { reaction, statusId, addReaction, removeReaction } = this.props;
 
-    if (reaction.get('me')) {
-      removeReaction(statusId, reaction.get('name'));
-    } else {
-      addReaction(statusId, reaction.get('name'));
+    if (!reaction.get('extern')) {
+      if (reaction.get('me')) {
+        removeReaction(statusId, reaction.get('name'));
+      } else {
+        addReaction(statusId, reaction.get('name'));
+      }
     }
   }
 
@@ -109,7 +108,12 @@ class Reaction extends ImmutablePureComponent {
         style={this.props.style}
       >
         <span className='reactions-bar__item__emoji'>
-          <Emoji hovered={this.state.hovered} emoji={reaction.get('name')} emojiMap={this.props.emojiMap} />
+          <Emoji
+            hovered={this.state.hovered}
+            emoji={reaction.get('name')}
+            url={reaction.get('url')}
+            staticUrl={reaction.get('static_url')}
+          />
         </span>
         <span className='reactions-bar__item__count'>
           <AnimatedNumber value={reaction.get('count')} />
@@ -124,12 +128,13 @@ class Emoji extends React.PureComponent {
 
   static propTypes = {
     emoji: PropTypes.string.isRequired,
-    emojiMap: ImmutablePropTypes.map.isRequired,
     hovered: PropTypes.bool.isRequired,
+    url: PropTypes.string,
+    staticUrl: PropTypes.string,
   };
 
   render() {
-    const { emoji, emojiMap, hovered } = this.props;
+    const { emoji, hovered, url, staticUrl } = this.props;
 
     if (unicodeMapping[emoji]) {
       const { filename, shortCode } = unicodeMapping[this.props.emoji];
@@ -144,10 +149,8 @@ class Emoji extends React.PureComponent {
           src={`${assetHost}/emoji/${filename}.svg`}
         />
       );
-    } else if (emojiMap.get(emoji)) {
-      const filename = (autoPlayGif || hovered)
-        ? emojiMap.getIn([emoji, 'url'])
-        : emojiMap.getIn([emoji, 'static_url']);
+    } else {
+      const filename = (autoPlayGif || hovered) ? url : staticUrl;
       const shortCode = `:${emoji}:`;
 
       return (
@@ -159,8 +162,6 @@ class Emoji extends React.PureComponent {
           src={filename}
         />
       );
-    } else {
-      return null;
     }
   }
 
diff --git a/app/javascript/flavours/glitch/containers/status_container.js b/app/javascript/flavours/glitch/containers/status_container.js
index c2fd15b17..d68e059af 100644
--- a/app/javascript/flavours/glitch/containers/status_container.js
+++ b/app/javascript/flavours/glitch/containers/status_container.js
@@ -45,7 +45,6 @@ import { showAlertForError } from '../actions/alerts';
 import AccountContainer from 'flavours/glitch/containers/account_container';
 import Spoilers from '../components/spoilers';
 import Icon from 'flavours/glitch/components/icon';
-import { makeCustomEmojiMap } from '../selectors';
 
 const messages = defineMessages({
   deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
@@ -85,7 +84,6 @@ const makeMapStateToProps = () => {
       account: account || props.account,
       settings: state.get('local_settings'),
       prepend: prepend || props.prepend,
-      emojiMap: makeCustomEmojiMap(state),
 
       pictureInPicture: {
         inUse: state.getIn(['meta', 'layout']) !== 'mobile' && state.get('picture_in_picture').statusId === props.id,
diff --git a/app/javascript/flavours/glitch/features/status/components/action_bar.js b/app/javascript/flavours/glitch/features/status/components/action_bar.js
index 619c57685..1ed89ea05 100644
--- a/app/javascript/flavours/glitch/features/status/components/action_bar.js
+++ b/app/javascript/flavours/glitch/features/status/components/action_bar.js
@@ -203,7 +203,7 @@ class ActionBar extends React.PureComponent {
       }
     }
 
-    const canReact = status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
+    const canReact = signedIn && status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
     const reactButton = (
       <IconButton
         className='plus-icon'
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.js b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
index 835a0ead3..a3d6150b7 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.js
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
@@ -46,7 +46,6 @@ class DetailedStatus extends ImmutablePureComponent {
     onToggleMediaVisibility: PropTypes.func,
     onReactionAdd: PropTypes.func.isRequired,
     onReactionRemove: PropTypes.func.isRequired,
-    emojiMap: ImmutablePropTypes.map.isRequired,
     intl: PropTypes.object.isRequired,
   };
 
@@ -328,7 +327,6 @@ class DetailedStatus extends ImmutablePureComponent {
             reactions={status.get('reactions')}
             addReaction={this.props.onReactionAdd}
             removeReaction={this.props.onReactionRemove}
-            emojiMap={this.props.emojiMap}
           />
 
           <div className='detailed-status__meta'>
diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js
index 910be5998..fd2769247 100644
--- a/app/javascript/flavours/glitch/features/status/index.js
+++ b/app/javascript/flavours/glitch/features/status/index.js
@@ -43,7 +43,7 @@ import { initMuteModal } from 'flavours/glitch/actions/mutes';
 import { initBlockModal } from 'flavours/glitch/actions/blocks';
 import { initReport } from 'flavours/glitch/actions/reports';
 import { initBoostModal } from 'flavours/glitch/actions/boosts';
-import { makeCustomEmojiMap, makeGetStatus } from 'flavours/glitch/selectors';
+import { makeGetStatus } from 'flavours/glitch/selectors';
 import ScrollContainer from 'flavours/glitch/containers/scroll_container';
 import ColumnBackButton from 'flavours/glitch/components/column_back_button';
 import ColumnHeader from '../../components/column_header';
@@ -148,7 +148,6 @@ const makeMapStateToProps = () => {
       askReplyConfirmation: state.getIn(['local_settings', 'confirm_before_clearing_draft']) && state.getIn(['compose', 'text']).trim().length !== 0,
       domain: state.getIn(['meta', 'domain']),
       usingPiP: state.get('picture_in_picture').statusId === props.params.statusId,
-      emojiMap: makeCustomEmojiMap(state),
     };
   };
 
@@ -707,7 +706,6 @@ class Status extends ImmutablePureComponent {
                   showMedia={this.state.showMedia}
                   onToggleMediaVisibility={this.handleToggleMediaVisibility}
                   usingPiP={usingPiP}
-                  emojiMap={this.props.emojiMap}
                 />
 
                 <ActionBar
diff --git a/app/javascript/flavours/glitch/selectors/index.js b/app/javascript/flavours/glitch/selectors/index.js
index ab7ac248b..df46b58a8 100644
--- a/app/javascript/flavours/glitch/selectors/index.js
+++ b/app/javascript/flavours/glitch/selectors/index.js
@@ -1,6 +1,6 @@
 import escapeTextContentForBrowser from 'escape-html';
 import { createSelector } from 'reselect';
-import { List as ImmutableList, Map as ImmutableMap } from 'immutable';
+import { List as ImmutableList } from 'immutable';
 import { toServerSideType } from 'flavours/glitch/utils/filters';
 import { me } from 'flavours/glitch/initial_state';
 
@@ -127,11 +127,3 @@ export const getAccountHidden = createSelector([
 ], (hidden, followingOrRequested, isSelf) => {
   return hidden && !(isSelf || followingOrRequested);
 });
-
-export const makeCustomEmojiMap = createSelector(
-  [state => state.get('custom_emojis')],
-  items => items.reduce(
-    (map, emoji) => map.set(emoji.get('shortcode'), emoji),
-    ImmutableMap(),
-  ),
-);
diff --git a/app/serializers/rest/reaction_serializer.rb b/app/serializers/rest/reaction_serializer.rb
index 1a5dca018..007d3b501 100644
--- a/app/serializers/rest/reaction_serializer.rb
+++ b/app/serializers/rest/reaction_serializer.rb
@@ -3,7 +3,7 @@
 class REST::ReactionSerializer < ActiveModel::Serializer
   include RoutingHelper
 
-  attributes :name, :count
+  attributes :name, :count, :extern
 
   attribute :me, if: :current_user?
   attribute :url, if: :custom_emoji?
@@ -21,6 +21,14 @@ class REST::ReactionSerializer < ActiveModel::Serializer
     object.custom_emoji.present?
   end
 
+  def extern
+    if custom_emoji?
+      object.custom_emoji.domain.present?
+    else
+      false
+    end
+  end
+
   def url
     full_asset_url(object.custom_emoji.image.url)
   end

From 7e16a2286db83067f6d7ff14b950ad9fd206ce3b Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sat, 3 Dec 2022 14:23:55 +0000
Subject: [PATCH 35/47] run i18n-tasks normalize

---
 config/locales/de.yml    | 8 ++++----
 config/locales/en.yml    | 8 ++++----
 config/locales/en_GB.yml | 8 ++++----
 config/locales/fr.yml    | 8 ++++----
 4 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/config/locales/de.yml b/config/locales/de.yml
index 1899b131d..e8b7261f4 100644
--- a/config/locales/de.yml
+++ b/config/locales/de.yml
@@ -1285,10 +1285,6 @@ de:
       body: 'Dein Beitrag wurde von %{name} favorisiert:'
       subject: "%{name} hat deinen Beitrag favorisiert"
       title: Neue Favorisierung
-    reaction:
-      body: '%{name} hat auf deinen Beitrag reagiert:'
-      subject: '%{name} hat auf deinen Beitrag reagiert'
-      title: Neue Reaktion
     follow:
       body: "%{name} folgt dir jetzt!"
       subject: "%{name} folgt dir jetzt"
@@ -1305,6 +1301,10 @@ de:
       title: Neue Erwähnung
     poll:
       subject: Eine Umfrage von %{name} ist beendet
+    reaction:
+      body: "%{name} hat auf deinen Beitrag reagiert:"
+      subject: "%{name} hat auf deinen Beitrag reagiert"
+      title: Neue Reaktion
     reblog:
       body: 'Deinen Beitrag hat %{name} geteilt:'
       subject: "%{name} hat deinen Beitrag geteilt"
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 5792f5de9..e5484e076 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -1285,10 +1285,6 @@ en:
       body: 'Your post was favourited by %{name}:'
       subject: "%{name} favourited your post"
       title: New favourite
-    reaction:
-      body: '%{name} reacted to your post:'
-      subject: '%{name} reacted to your post'
-      title: New reaction
     follow:
       body: "%{name} is now following you!"
       subject: "%{name} is now following you"
@@ -1305,6 +1301,10 @@ en:
       title: New mention
     poll:
       subject: A poll by %{name} has ended
+    reaction:
+      body: "%{name} reacted to your post:"
+      subject: "%{name} reacted to your post"
+      title: New reaction
     reblog:
       body: 'Your post was boosted by %{name}:'
       subject: "%{name} boosted your post"
diff --git a/config/locales/en_GB.yml b/config/locales/en_GB.yml
index 80084d9a6..506d46240 100644
--- a/config/locales/en_GB.yml
+++ b/config/locales/en_GB.yml
@@ -707,10 +707,6 @@ en_GB:
       body: 'Your status was favourited by %{name}:'
       subject: "%{name} favourited your status"
       title: New favourite
-    reaction:
-      body: '%{name} reacted on your post with %{reaction}:'
-      subject: '%{name} reacted on your post'
-      title: New reaction
     follow:
       body: "%{name} is now following you!"
       subject: "%{name} is now following you"
@@ -725,6 +721,10 @@ en_GB:
       body: 'You were mentioned by %{name} in:'
       subject: You were mentioned by %{name}
       title: New mention
+    reaction:
+      body: "%{name} reacted on your post with %{reaction}:"
+      subject: "%{name} reacted on your post"
+      title: New reaction
     reblog:
       body: 'Your status was boosted by %{name}:'
       subject: "%{name} boosted your status"
diff --git a/config/locales/fr.yml b/config/locales/fr.yml
index 9f3cf843a..e1deaab22 100644
--- a/config/locales/fr.yml
+++ b/config/locales/fr.yml
@@ -1285,10 +1285,6 @@ fr:
       body: "%{name} a ajouté votre message à ses favoris :"
       subject: "%{name} a ajouté votre message à ses favoris"
       title: Nouveau favori
-    reaction:
-      body: '%{name} a réagi·e à votre message:'
-      subject: '%{name} a réagi·e à votre message'
-      title: Nouvelle réaction
     follow:
       body: "%{name} vous suit !"
       subject: "%{name} vous suit"
@@ -1305,6 +1301,10 @@ fr:
       title: Nouvelle mention
     poll:
       subject: Un sondage de %{name} est terminé
+    reaction:
+      body: "%{name} a réagi·e à votre message:"
+      subject: "%{name} a réagi·e à votre message"
+      title: Nouvelle réaction
     reblog:
       body: 'Votre message été partagé par %{name} :'
       subject: "%{name} a partagé votre message"

From e6c9206f5c5a82a367fc612ca658aafab187c231 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sat, 3 Dec 2022 16:20:29 +0000
Subject: [PATCH 36/47] fix image for new custom emoji reactions

---
 .../flavours/glitch/actions/interactions.js          |  7 ++++---
 .../flavours/glitch/components/status_action_bar.js  |  2 +-
 .../flavours/glitch/containers/status_container.js   |  4 ++--
 .../glitch/features/status/components/action_bar.js  |  2 +-
 .../flavours/glitch/features/status/index.js         |  4 ++--
 app/javascript/flavours/glitch/reducers/statuses.js  | 12 +++++++++---
 app/javascript/mastodon/actions/interactions.js      |  7 ++++---
 .../mastodon/containers/status_container.js          |  4 ++--
 app/javascript/mastodon/features/status/index.js     |  4 ++--
 app/javascript/mastodon/reducers/statuses.js         | 12 +++++++++---
 10 files changed, 36 insertions(+), 22 deletions(-)

diff --git a/app/javascript/flavours/glitch/actions/interactions.js b/app/javascript/flavours/glitch/actions/interactions.js
index 0df6db427..2d483de81 100644
--- a/app/javascript/flavours/glitch/actions/interactions.js
+++ b/app/javascript/flavours/glitch/actions/interactions.js
@@ -403,7 +403,7 @@ export function unpinFail(status, error) {
   };
 };
 
-export const addReaction = (statusId, name) => (dispatch, getState) => {
+export const addReaction = (statusId, name, url) => (dispatch, getState) => {
   const status = getState().get('statuses').get(statusId);
   let alreadyAdded = false;
   if (status) {
@@ -413,7 +413,7 @@ export const addReaction = (statusId, name) => (dispatch, getState) => {
     }
   }
   if (!alreadyAdded) {
-    dispatch(addReactionRequest(statusId, name));
+    dispatch(addReactionRequest(statusId, name, url));
   }
 
   api(getState).post(`/api/v1/statuses/${statusId}/react/${name}`).then(() => {
@@ -425,10 +425,11 @@ export const addReaction = (statusId, name) => (dispatch, getState) => {
   });
 };
 
-export const addReactionRequest = (statusId, name) => ({
+export const addReactionRequest = (statusId, name, url) => ({
   type: REACTION_ADD_REQUEST,
   id: statusId,
   name,
+  url,
 });
 
 export const addReactionSuccess = (statusId, name) => ({
diff --git a/app/javascript/flavours/glitch/components/status_action_bar.js b/app/javascript/flavours/glitch/components/status_action_bar.js
index 5129d3a68..e6e58f8ad 100644
--- a/app/javascript/flavours/glitch/components/status_action_bar.js
+++ b/app/javascript/flavours/glitch/components/status_action_bar.js
@@ -118,7 +118,7 @@ class StatusActionBar extends ImmutablePureComponent {
   }
 
   handleEmojiPick = data => {
-    this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''));
+    this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''), data.imageUrl);
   }
 
   handleReblogClick = e => {
diff --git a/app/javascript/flavours/glitch/containers/status_container.js b/app/javascript/flavours/glitch/containers/status_container.js
index d68e059af..3edcf9c7a 100644
--- a/app/javascript/flavours/glitch/containers/status_container.js
+++ b/app/javascript/flavours/glitch/containers/status_container.js
@@ -167,8 +167,8 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
     }
   },
 
-  onReactionAdd (statusId, name) {
-    dispatch(addReaction(statusId, name));
+  onReactionAdd (statusId, name, url) {
+    dispatch(addReaction(statusId, name, url));
   },
 
   onReactionRemove (statusId, name) {
diff --git a/app/javascript/flavours/glitch/features/status/components/action_bar.js b/app/javascript/flavours/glitch/features/status/components/action_bar.js
index 1ed89ea05..6f86e2aa2 100644
--- a/app/javascript/flavours/glitch/features/status/components/action_bar.js
+++ b/app/javascript/flavours/glitch/features/status/components/action_bar.js
@@ -81,7 +81,7 @@ class ActionBar extends React.PureComponent {
   }
 
   handleEmojiPick = data => {
-    this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''));
+    this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''), data.imageUrl);
   }
 
   handleBookmarkClick = (e) => {
diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js
index fd2769247..37b703efa 100644
--- a/app/javascript/flavours/glitch/features/status/index.js
+++ b/app/javascript/flavours/glitch/features/status/index.js
@@ -293,12 +293,12 @@ class Status extends ImmutablePureComponent {
     }
   }
 
-  handleReactionAdd = (statusId, name) => {
+  handleReactionAdd = (statusId, name, url) => {
     const { dispatch } = this.props;
     const { signedIn } = this.context.identity;
 
     if (signedIn) {
-      dispatch(addReaction(statusId, name));
+      dispatch(addReaction(statusId, name, url));
     } else {
       dispatch(openModal('INTERACTION', {
         type: 'reaction_add',
diff --git a/app/javascript/flavours/glitch/reducers/statuses.js b/app/javascript/flavours/glitch/reducers/statuses.js
index 22fdeb284..446c991ca 100644
--- a/app/javascript/flavours/glitch/reducers/statuses.js
+++ b/app/javascript/flavours/glitch/reducers/statuses.js
@@ -59,11 +59,17 @@ const updateReaction = (state, id, name, updater) => state.update(
 
 const updateReactionCount = (state, reaction) => updateReaction(state, reaction.status_id, reaction.name, x => x.set('count', reaction.count));
 
-const addReaction = (state, id, name) => updateReaction(
+// The url parameter is only used when adding a new custom emoji reaction
+// (one that wasn't in the reactions list before) because we don't have its
+// URL yet.  In all other cases, it's undefined.
+const addReaction = (state, id, name, url) => updateReaction(
   state,
   id,
   name,
-  x => x.set('me', true).update('count', n => n + 1),
+  x => x.set('me', true)
+    .update('count', n => n + 1)
+    .update('url', old => old ? old : url)
+    .update('static_url', old => old ? old : url),
 );
 
 const removeReaction = (state, id, name) => updateReaction(
@@ -103,7 +109,7 @@ export default function statuses(state = initialState, action) {
     return updateReactionCount(state, action.reaction);
   case REACTION_ADD_REQUEST:
   case REACTION_REMOVE_FAIL:
-    return addReaction(state, action.id, action.name);
+    return addReaction(state, action.id, action.name, action.url);
   case REACTION_REMOVE_REQUEST:
   case REACTION_ADD_FAIL:
     return removeReaction(state, action.id, action.name);
diff --git a/app/javascript/mastodon/actions/interactions.js b/app/javascript/mastodon/actions/interactions.js
index dd1395cbd..54592ec53 100644
--- a/app/javascript/mastodon/actions/interactions.js
+++ b/app/javascript/mastodon/actions/interactions.js
@@ -423,7 +423,7 @@ export function unpinFail(status, error) {
   };
 };
 
-export const addReaction = (statusId, name) => (dispatch, getState) => {
+export const addReaction = (statusId, name, url) => (dispatch, getState) => {
   const status = getState().get('statuses').get(statusId);
   let alreadyAdded = false;
   if (status) {
@@ -433,7 +433,7 @@ export const addReaction = (statusId, name) => (dispatch, getState) => {
     }
   }
   if (!alreadyAdded) {
-    dispatch(addReactionRequest(statusId, name));
+    dispatch(addReactionRequest(statusId, name, url));
   }
 
   api(getState).post(`/api/v1/statuses/${statusId}/react/${name}`).then(() => {
@@ -445,10 +445,11 @@ export const addReaction = (statusId, name) => (dispatch, getState) => {
   });
 };
 
-export const addReactionRequest = (statusId, name) => ({
+export const addReactionRequest = (statusId, name, url) => ({
   type: REACTION_ADD_REQUEST,
   id: statusId,
   name,
+  url,
 });
 
 export const addReactionSuccess = (statusId, name) => ({
diff --git a/app/javascript/mastodon/containers/status_container.js b/app/javascript/mastodon/containers/status_container.js
index 556910f08..70adc0493 100644
--- a/app/javascript/mastodon/containers/status_container.js
+++ b/app/javascript/mastodon/containers/status_container.js
@@ -132,8 +132,8 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
     }
   },
 
-  onReactionAdd (statusId, name) {
-    dispatch(addReaction(statusId, name));
+  onReactionAdd (statusId, name, url) {
+    dispatch(addReaction(statusId, name, url));
   },
 
   onReactionRemove (statusId, name) {
diff --git a/app/javascript/mastodon/features/status/index.js b/app/javascript/mastodon/features/status/index.js
index e262cd94f..d22009d0e 100644
--- a/app/javascript/mastodon/features/status/index.js
+++ b/app/javascript/mastodon/features/status/index.js
@@ -257,12 +257,12 @@ class Status extends ImmutablePureComponent {
     }
   }
 
-  handleReactionAdd = (statusId, name) => {
+  handleReactionAdd = (statusId, name, url) => {
     const { dispatch } = this.props;
     const { signedIn } = this.context.identity;
 
     if (signedIn) {
-      dispatch(addReaction(statusId, name));
+      dispatch(addReaction(statusId, name, url));
     } else {
       dispatch(openModal('INTERACTION', {
         type: 'reaction_add',
diff --git a/app/javascript/mastodon/reducers/statuses.js b/app/javascript/mastodon/reducers/statuses.js
index 222890667..cb9759119 100644
--- a/app/javascript/mastodon/reducers/statuses.js
+++ b/app/javascript/mastodon/reducers/statuses.js
@@ -57,11 +57,17 @@ const updateReaction = (state, id, name, updater) => state.update(
 
 const updateReactionCount = (state, reaction) => updateReaction(state, reaction.status_id, reaction.name, x => x.set('count', reaction.count));
 
-const addReaction = (state, id, name) => updateReaction(
+// The url parameter is only used when adding a new custom emoji reaction
+// (one that wasn't in the reactions list before) because we don't have its
+// URL yet.  In all other cases, it's undefined.
+const addReaction = (state, id, name, url) => updateReaction(
   state,
   id,
   name,
-  x => x.set('me', true).update('count', n => n + 1),
+  x => x.set('me', true)
+    .update('count', n => n + 1)
+    .update('url', old => old ? old : url)
+    .update('static_url', old => old ? old : url),
 );
 
 const removeReaction = (state, id, name) => updateReaction(
@@ -101,7 +107,7 @@ export default function statuses(state = initialState, action) {
     return updateReactionCount(state, action.reaction);
   case REACTION_ADD_REQUEST:
   case REACTION_REMOVE_FAIL:
-    return addReaction(state, action.id, action.name);
+    return addReaction(state, action.id, action.name, action.url);
   case REACTION_REMOVE_REQUEST:
   case REACTION_ADD_FAIL:
     return removeReaction(state, action.id, action.name);

From bb93649f38fd15e88e370273fb83ead1110b1b00 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sat, 3 Dec 2022 16:55:37 +0000
Subject: [PATCH 37/47] disable reaction button when not signed in

---
 .../flavours/glitch/containers/status_container.js          | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/app/javascript/flavours/glitch/containers/status_container.js b/app/javascript/flavours/glitch/containers/status_container.js
index 3edcf9c7a..93a92c137 100644
--- a/app/javascript/flavours/glitch/containers/status_container.js
+++ b/app/javascript/flavours/glitch/containers/status_container.js
@@ -168,7 +168,11 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
   },
 
   onReactionAdd (statusId, name, url) {
-    dispatch(addReaction(statusId, name, url));
+    const { signedIn } = this.context.identity;
+
+    if (signedIn) {
+      dispatch(addReaction(statusId, name, url));
+    }
   },
 
   onReactionRemove (statusId, name) {

From 55ba8f9c928fdf5f060faf69a4209f959b131f1e Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sun, 4 Dec 2022 08:47:24 +0000
Subject: [PATCH 38/47] also disable reaction buttons in vanilla flavour

---
 .../mastodon/components/status_action_bar.js          |  2 +-
 .../mastodon/components/status_reactions.js           | 11 +++++++----
 .../mastodon/features/status/components/action_bar.js |  2 +-
 3 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/app/javascript/mastodon/components/status_action_bar.js b/app/javascript/mastodon/components/status_action_bar.js
index 0f8d54814..c880a6959 100644
--- a/app/javascript/mastodon/components/status_action_bar.js
+++ b/app/javascript/mastodon/components/status_action_bar.js
@@ -364,7 +364,7 @@ class StatusActionBar extends ImmutablePureComponent {
       <IconButton className='status__action-bar__button' title={intl.formatMessage(messages.hide)} icon='eye' onClick={this.handleHideClick} />
     );
 
-    const canReact = status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
+    const canReact = signedIn && status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
     const reactButton = (
       <IconButton
         className='status__action-bar-button'
diff --git a/app/javascript/mastodon/components/status_reactions.js b/app/javascript/mastodon/components/status_reactions.js
index 63ec7941c..c16b7e826 100644
--- a/app/javascript/mastodon/components/status_reactions.js
+++ b/app/javascript/mastodon/components/status_reactions.js
@@ -85,11 +85,14 @@ class Reaction extends ImmutablePureComponent {
 
   handleClick = () => {
     const { reaction, statusId, addReaction, removeReaction } = this.props;
+    const { signedIn } = this.context.identity;
 
-    if (reaction.get('me')) {
-      removeReaction(statusId, reaction.get('name'));
-    } else {
-      addReaction(statusId, reaction.get('name'));
+    if (signedIn) {
+      if (reaction.get('me')) {
+        removeReaction(statusId, reaction.get('name'));
+      } else {
+        addReaction(statusId, reaction.get('name'));
+      }
     }
   }
 
diff --git a/app/javascript/mastodon/features/status/components/action_bar.js b/app/javascript/mastodon/features/status/components/action_bar.js
index 095bccfa8..9ab228bde 100644
--- a/app/javascript/mastodon/features/status/components/action_bar.js
+++ b/app/javascript/mastodon/features/status/components/action_bar.js
@@ -259,7 +259,7 @@ class ActionBar extends React.PureComponent {
       }
     }
 
-    const canReact = status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
+    const canReact = signedIn && status.get('reactions').filter(r => r.get('count') > 0 && r.get('me')).size < maxReactions;
     const reactButton = (
       <IconButton
         className='plus-icon'

From 6da2a0d0fb077917eefa1fb4f153330b44f738e9 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sun, 4 Dec 2022 10:52:02 +0000
Subject: [PATCH 39/47] serialize custom emoji reactions properly for AP

Akkoma and possibly others expect the `tag` field
in an EmojiReact activity to be an array, not just
a single object, so it's being wrapped into one
now.  I'm not entirely sure whether this is the
idiomatic way of doing it tbh, but it works fine.
---
 app/serializers/activitypub/emoji_reaction_serializer.rb | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/app/serializers/activitypub/emoji_reaction_serializer.rb b/app/serializers/activitypub/emoji_reaction_serializer.rb
index 50f3efa3c..f8887f15b 100644
--- a/app/serializers/activitypub/emoji_reaction_serializer.rb
+++ b/app/serializers/activitypub/emoji_reaction_serializer.rb
@@ -3,8 +3,7 @@
 class ActivityPub::EmojiReactionSerializer < ActivityPub::Serializer
   attributes :id, :type, :actor, :content
   attribute :virtual_object, key: :object
-
-  has_one :custom_emoji, key: :tag, serializer: ActivityPub::EmojiSerializer, unless: -> { object.custom_emoji.nil? }
+  attribute :custom_emoji, key: :tag, unless: -> { object.custom_emoji.nil? }
 
   def id
     [ActivityPub::TagManager.instance.uri_for(object.account), '#emoji_reactions/', object.id].join
@@ -31,4 +30,10 @@ class ActivityPub::EmojiReactionSerializer < ActivityPub::Serializer
   end
 
   alias reaction content
+
+  # Akkoma (and possibly others) expect `tag` to be an array, so we can't just
+  # use the has_one shorthand because we need to wrap it into an array manually
+  def custom_emoji
+    [ActivityPub::EmojiSerializer.new(object.custom_emoji).serializable_hash]
+  end
 end

From 66ade5c1fd1bbc42d2d994fce9fe32f0f89bc919 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sun, 4 Dec 2022 12:33:47 +0000
Subject: [PATCH 40/47] properly disable reactions when not logged in

---
 .../flavours/glitch/components/status.js      |  2 +
 .../glitch/components/status_action_bar.js    |  6 ++-
 .../glitch/components/status_reactions.js     | 14 ++++---
 .../glitch/containers/status_container.js     |  6 +--
 .../features/status/components/action_bar.js  |  8 +++-
 .../status/components/detailed_status.js      |  2 +
 .../flavours/glitch/features/status/index.js  |  6 ---
 app/javascript/mastodon/components/status.js  |  3 +-
 .../mastodon/components/status_action_bar.js  |  8 +---
 .../mastodon/components/status_reactions.js   | 38 +++++++++----------
 .../features/status/components/action_bar.js  |  8 +++-
 .../status/components/detailed_status.js      |  4 +-
 .../mastodon/features/status/index.js         |  6 ---
 13 files changed, 56 insertions(+), 55 deletions(-)

diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js
index 08cfbdada..99ed644aa 100644
--- a/app/javascript/flavours/glitch/components/status.js
+++ b/app/javascript/flavours/glitch/components/status.js
@@ -62,6 +62,7 @@ class Status extends ImmutablePureComponent {
 
   static contextTypes = {
     router: PropTypes.object,
+    identity: PropTypes.object,
   };
 
   static propTypes = {
@@ -810,6 +811,7 @@ class Status extends ImmutablePureComponent {
             numVisible={visibleReactions}
             addReaction={this.props.onReactionAdd}
             removeReaction={this.props.onReactionRemove}
+            canReact={this.context.identity.signedIn}
           />
 
           {!isCollapsed || !(muted || !settings.getIn(['collapsed', 'show_action_bar'])) ? (
diff --git a/app/javascript/flavours/glitch/components/status_action_bar.js b/app/javascript/flavours/glitch/components/status_action_bar.js
index e6e58f8ad..53a8a7686 100644
--- a/app/javascript/flavours/glitch/components/status_action_bar.js
+++ b/app/javascript/flavours/glitch/components/status_action_bar.js
@@ -329,7 +329,11 @@ class StatusActionBar extends ImmutablePureComponent {
         />
         <IconButton className={classNames('status__action-bar-button', { reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon={reblogIcon} onClick={this.handleReblogClick} counter={withCounters ? status.get('reblogs_count') : undefined} />
         <IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} counter={withCounters ? status.get('favourites_count') : undefined} />
-        <EmojiPickerDropdown className='status__action-bar-button' onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
+        {
+          signedIn
+            ? <EmojiPickerDropdown className='status__action-bar-button' onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
+            : reactButton
+        }
         {shareButton}
         <IconButton className='status__action-bar-button bookmark-icon' disabled={anonymousAccess} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} />
 
diff --git a/app/javascript/flavours/glitch/components/status_reactions.js b/app/javascript/flavours/glitch/components/status_reactions.js
index e263a6480..ff025e8d2 100644
--- a/app/javascript/flavours/glitch/components/status_reactions.js
+++ b/app/javascript/flavours/glitch/components/status_reactions.js
@@ -17,6 +17,7 @@ export default class StatusReactions extends ImmutablePureComponent {
     reactions: ImmutablePropTypes.list.isRequired,
     numVisible: PropTypes.number,
     addReaction: PropTypes.func.isRequired,
+    canReact: PropTypes.bool.isRequired,
     removeReaction: PropTypes.func.isRequired,
   };
 
@@ -56,6 +57,7 @@ export default class StatusReactions extends ImmutablePureComponent {
                 style={{ transform: `scale(${style.scale})`, position: style.scale < 0.5 ? 'absolute' : 'static' }}
                 addReaction={this.props.addReaction}
                 removeReaction={this.props.removeReaction}
+                canReact={this.props.canReact}
               />
             ))}
           </div>
@@ -73,6 +75,7 @@ class Reaction extends ImmutablePureComponent {
     reaction: ImmutablePropTypes.map.isRequired,
     addReaction: PropTypes.func.isRequired,
     removeReaction: PropTypes.func.isRequired,
+    canReact: PropTypes.bool.isRequired,
     style: PropTypes.object,
   };
 
@@ -83,12 +86,10 @@ class Reaction extends ImmutablePureComponent {
   handleClick = () => {
     const { reaction, statusId, addReaction, removeReaction } = this.props;
 
-    if (!reaction.get('extern')) {
-      if (reaction.get('me')) {
-        removeReaction(statusId, reaction.get('name'));
-      } else {
-        addReaction(statusId, reaction.get('name'));
-      }
+    if (reaction.get('me')) {
+      removeReaction(statusId, reaction.get('name'));
+    } else {
+      addReaction(statusId, reaction.get('name'));
     }
   }
 
@@ -105,6 +106,7 @@ class Reaction extends ImmutablePureComponent {
         onClick={this.handleClick}
         onMouseEnter={this.handleMouseEnter}
         onMouseLeave={this.handleMouseLeave}
+        disabled={!this.props.canReact}
         style={this.props.style}
       >
         <span className='reactions-bar__item__emoji'>
diff --git a/app/javascript/flavours/glitch/containers/status_container.js b/app/javascript/flavours/glitch/containers/status_container.js
index 93a92c137..3edcf9c7a 100644
--- a/app/javascript/flavours/glitch/containers/status_container.js
+++ b/app/javascript/flavours/glitch/containers/status_container.js
@@ -168,11 +168,7 @@ const mapDispatchToProps = (dispatch, { intl, contextType }) => ({
   },
 
   onReactionAdd (statusId, name, url) {
-    const { signedIn } = this.context.identity;
-
-    if (signedIn) {
-      dispatch(addReaction(statusId, name, url));
-    }
+    dispatch(addReaction(statusId, name, url));
   },
 
   onReactionRemove (statusId, name) {
diff --git a/app/javascript/flavours/glitch/features/status/components/action_bar.js b/app/javascript/flavours/glitch/features/status/components/action_bar.js
index 6f86e2aa2..39d32178a 100644
--- a/app/javascript/flavours/glitch/features/status/components/action_bar.js
+++ b/app/javascript/flavours/glitch/features/status/components/action_bar.js
@@ -236,7 +236,13 @@ class ActionBar extends React.PureComponent {
         <div className='detailed-status__button'><IconButton title={intl.formatMessage(messages.reply)} icon={status.get('in_reply_to_id', null) === null ? 'reply' : 'reply-all'} onClick={this.handleReplyClick} /></div>
         <div className='detailed-status__button'><IconButton className={classNames({ reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} /></div>
         <div className='detailed-status__button'><IconButton className='star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} /></div>
-        <div className='detailed-status__button'><EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} /></div>
+        <div className='detailed-status__button'>
+          {
+            signedIn
+              ? <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
+              : reactButton
+          }
+        </div>
         {shareButton}
         <div className='detailed-status__button'><IconButton className='bookmark-icon' disabled={!signedIn} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /></div>
 
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.js b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
index a3d6150b7..87eb463d3 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.js
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
@@ -27,6 +27,7 @@ class DetailedStatus extends ImmutablePureComponent {
 
   static contextTypes = {
     router: PropTypes.object,
+    identity: PropTypes.object,
   };
 
   static propTypes = {
@@ -327,6 +328,7 @@ class DetailedStatus extends ImmutablePureComponent {
             reactions={status.get('reactions')}
             addReaction={this.props.onReactionAdd}
             removeReaction={this.props.onReactionRemove}
+            canReact={this.context.identity.signedIn}
           />
 
           <div className='detailed-status__meta'>
diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js
index 37b703efa..0879a7ab6 100644
--- a/app/javascript/flavours/glitch/features/status/index.js
+++ b/app/javascript/flavours/glitch/features/status/index.js
@@ -299,12 +299,6 @@ class Status extends ImmutablePureComponent {
 
     if (signedIn) {
       dispatch(addReaction(statusId, name, url));
-    } else {
-      dispatch(openModal('INTERACTION', {
-        type: 'reaction_add',
-        accountId: status.getIn(['account', 'id']),
-        url: status.get('url'),
-      }));
     }
   }
 
diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index 284c5dbd7..367131efe 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -65,6 +65,7 @@ class Status extends ImmutablePureComponent {
 
   static contextTypes = {
     router: PropTypes.object,
+    identity: PropTypes.object,
   };
 
   static propTypes = {
@@ -547,7 +548,7 @@ class Status extends ImmutablePureComponent {
               numVisible={visibleReactions}
               addReaction={this.props.onReactionAdd}
               removeReaction={this.props.onReactionRemove}
-              emojiMap={this.props.emojiMap}
+              canReact={this.context.identity.signedIn}
             />
 
             <StatusActionBar scrollKey={scrollKey} status={status} account={account} onFilter={matchedFilters ? this.handleFilterClick : null} {...other} />
diff --git a/app/javascript/mastodon/components/status_action_bar.js b/app/javascript/mastodon/components/status_action_bar.js
index c880a6959..40738aa4e 100644
--- a/app/javascript/mastodon/components/status_action_bar.js
+++ b/app/javascript/mastodon/components/status_action_bar.js
@@ -131,13 +131,7 @@ class StatusActionBar extends ImmutablePureComponent {
   }
 
   handleEmojiPick = data => {
-    const { signedIn } = this.context.identity;
-
-    if (signedIn) {
-      this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''));
-    } else {
-      this.props.onInteractionModal('favourite', this.props.status);
-    }
+      this.props.onReactionAdd(this.props.status.get('id'), data.native.replace(/:/g, ''), data.imageUrl);
   }
 
   handleReblogClick = e => {
diff --git a/app/javascript/mastodon/components/status_reactions.js b/app/javascript/mastodon/components/status_reactions.js
index c16b7e826..ff025e8d2 100644
--- a/app/javascript/mastodon/components/status_reactions.js
+++ b/app/javascript/mastodon/components/status_reactions.js
@@ -17,8 +17,8 @@ export default class StatusReactions extends ImmutablePureComponent {
     reactions: ImmutablePropTypes.list.isRequired,
     numVisible: PropTypes.number,
     addReaction: PropTypes.func.isRequired,
+    canReact: PropTypes.bool.isRequired,
     removeReaction: PropTypes.func.isRequired,
-    emojiMap: ImmutablePropTypes.map.isRequired,
   };
 
   willEnter() {
@@ -57,7 +57,7 @@ export default class StatusReactions extends ImmutablePureComponent {
                 style={{ transform: `scale(${style.scale})`, position: style.scale < 0.5 ? 'absolute' : 'static' }}
                 addReaction={this.props.addReaction}
                 removeReaction={this.props.removeReaction}
-                emojiMap={this.props.emojiMap}
+                canReact={this.props.canReact}
               />
             ))}
           </div>
@@ -75,7 +75,7 @@ class Reaction extends ImmutablePureComponent {
     reaction: ImmutablePropTypes.map.isRequired,
     addReaction: PropTypes.func.isRequired,
     removeReaction: PropTypes.func.isRequired,
-    emojiMap: ImmutablePropTypes.map.isRequired,
+    canReact: PropTypes.bool.isRequired,
     style: PropTypes.object,
   };
 
@@ -85,14 +85,11 @@ class Reaction extends ImmutablePureComponent {
 
   handleClick = () => {
     const { reaction, statusId, addReaction, removeReaction } = this.props;
-    const { signedIn } = this.context.identity;
 
-    if (signedIn) {
-      if (reaction.get('me')) {
-        removeReaction(statusId, reaction.get('name'));
-      } else {
-        addReaction(statusId, reaction.get('name'));
-      }
+    if (reaction.get('me')) {
+      removeReaction(statusId, reaction.get('name'));
+    } else {
+      addReaction(statusId, reaction.get('name'));
     }
   }
 
@@ -109,10 +106,16 @@ class Reaction extends ImmutablePureComponent {
         onClick={this.handleClick}
         onMouseEnter={this.handleMouseEnter}
         onMouseLeave={this.handleMouseLeave}
+        disabled={!this.props.canReact}
         style={this.props.style}
       >
         <span className='reactions-bar__item__emoji'>
-          <Emoji hovered={this.state.hovered} emoji={reaction.get('name')} emojiMap={this.props.emojiMap} />
+          <Emoji
+            hovered={this.state.hovered}
+            emoji={reaction.get('name')}
+            url={reaction.get('url')}
+            staticUrl={reaction.get('static_url')}
+          />
         </span>
         <span className='reactions-bar__item__count'>
           <AnimatedNumber value={reaction.get('count')} />
@@ -127,12 +130,13 @@ class Emoji extends React.PureComponent {
 
   static propTypes = {
     emoji: PropTypes.string.isRequired,
-    emojiMap: ImmutablePropTypes.map.isRequired,
     hovered: PropTypes.bool.isRequired,
+    url: PropTypes.string,
+    staticUrl: PropTypes.string,
   };
 
   render() {
-    const { emoji, emojiMap, hovered } = this.props;
+    const { emoji, hovered, url, staticUrl } = this.props;
 
     if (unicodeMapping[emoji]) {
       const { filename, shortCode } = unicodeMapping[this.props.emoji];
@@ -147,10 +151,8 @@ class Emoji extends React.PureComponent {
           src={`${assetHost}/emoji/${filename}.svg`}
         />
       );
-    } else if (emojiMap.get(emoji)) {
-      const filename = (autoPlayGif || hovered)
-        ? emojiMap.getIn([emoji, 'url'])
-        : emojiMap.getIn([emoji, 'static_url']);
+    } else {
+      const filename = (autoPlayGif || hovered) ? url : staticUrl;
       const shortCode = `:${emoji}:`;
 
       return (
@@ -162,8 +164,6 @@ class Emoji extends React.PureComponent {
           src={filename}
         />
       );
-    } else {
-      return null;
     }
   }
 
diff --git a/app/javascript/mastodon/features/status/components/action_bar.js b/app/javascript/mastodon/features/status/components/action_bar.js
index 9ab228bde..91a8a7793 100644
--- a/app/javascript/mastodon/features/status/components/action_bar.js
+++ b/app/javascript/mastodon/features/status/components/action_bar.js
@@ -299,7 +299,13 @@ class ActionBar extends React.PureComponent {
         <div className='detailed-status__button'><IconButton title={intl.formatMessage(messages.reply)} icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon} onClick={this.handleReplyClick} /></div>
         <div className='detailed-status__button' ><IconButton className={classNames({ reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} /></div>
         <div className='detailed-status__button'><IconButton className='star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} /></div>
-        <div className='detailed-status__button'><EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} /></div>
+        <div className='detailed-status__button'>
+          {
+            canReact
+              ? <EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
+              : reactButton
+          }
+        </div>
         <div className='detailed-status__button'><IconButton className='bookmark-icon' disabled={!signedIn} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /></div>
 
         {shareButton}
diff --git a/app/javascript/mastodon/features/status/components/detailed_status.js b/app/javascript/mastodon/features/status/components/detailed_status.js
index f34b66110..acb9fff57 100644
--- a/app/javascript/mastodon/features/status/components/detailed_status.js
+++ b/app/javascript/mastodon/features/status/components/detailed_status.js
@@ -31,6 +31,7 @@ class DetailedStatus extends ImmutablePureComponent {
 
   static contextTypes = {
     router: PropTypes.object,
+    identity: PropTypes.object,
   };
 
   static propTypes = {
@@ -51,7 +52,6 @@ class DetailedStatus extends ImmutablePureComponent {
     onToggleMediaVisibility: PropTypes.func,
     onReactionAdd: PropTypes.func.isRequired,
     onReactionRemove: PropTypes.func.isRequired,
-    emojiMap: ImmutablePropTypes.map.isRequired,
   };
 
   state = {
@@ -284,7 +284,7 @@ class DetailedStatus extends ImmutablePureComponent {
             reactions={status.get('reactions')}
             addReaction={this.props.onReactionAdd}
             removeReaction={this.props.onReactionRemove}
-            emojiMap={this.props.emojiMap}
+            canReact={this.context.identity.signedIn}
           />
 
           <div className='detailed-status__meta'>
diff --git a/app/javascript/mastodon/features/status/index.js b/app/javascript/mastodon/features/status/index.js
index d22009d0e..a3a0f0af7 100644
--- a/app/javascript/mastodon/features/status/index.js
+++ b/app/javascript/mastodon/features/status/index.js
@@ -263,12 +263,6 @@ class Status extends ImmutablePureComponent {
 
     if (signedIn) {
       dispatch(addReaction(statusId, name, url));
-    } else {
-      dispatch(openModal('INTERACTION', {
-        type: 'reaction_add',
-        accountId: status.getIn(['account', 'id']),
-        url: status.get('url'),
-      }));
     }
   }
 

From 1cb9c9dccaf5f736c63f0a6eb932828518d8d144 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 7 Dec 2022 12:19:36 +0000
Subject: [PATCH 41/47] support reacting with foreign custom emojis

---
 app/models/status_reaction.rb               |  7 +------
 app/serializers/rest/reaction_serializer.rb | 16 +++++++++++-----
 app/validators/status_reaction_validator.rb |  4 ----
 config/routes.rb                            |  6 ++++--
 4 files changed, 16 insertions(+), 17 deletions(-)

diff --git a/app/models/status_reaction.rb b/app/models/status_reaction.rb
index 4793ff9aa..0833a7eaf 100644
--- a/app/models/status_reaction.rb
+++ b/app/models/status_reaction.rb
@@ -24,11 +24,6 @@ class StatusReaction < ApplicationRecord
   private
 
   def set_custom_emoji
-    return if name.blank?
-    self.custom_emoji = if account.local?
-                          CustomEmoji.local.find_by(disabled: false, shortcode: name)
-                        else
-                          CustomEmoji.find_by(shortcode: name, domain: account.domain)
-                        end
+    self.custom_emoji = CustomEmoji.find_by(shortcode: name, domain: account.domain) if name.blank?
   end
 end
diff --git a/app/serializers/rest/reaction_serializer.rb b/app/serializers/rest/reaction_serializer.rb
index 007d3b501..b0f0732bf 100644
--- a/app/serializers/rest/reaction_serializer.rb
+++ b/app/serializers/rest/reaction_serializer.rb
@@ -3,7 +3,7 @@
 class REST::ReactionSerializer < ActiveModel::Serializer
   include RoutingHelper
 
-  attributes :name, :count, :extern
+  attributes :name, :count
 
   attribute :me, if: :current_user?
   attribute :url, if: :custom_emoji?
@@ -21,11 +21,11 @@ class REST::ReactionSerializer < ActiveModel::Serializer
     object.custom_emoji.present?
   end
 
-  def extern
-    if custom_emoji?
-      object.custom_emoji.domain.present?
+  def name
+    if extern?
+      [object.name, '@', object.custom_emoji.domain].join
     else
-      false
+      object.name
     end
   end
 
@@ -36,4 +36,10 @@ class REST::ReactionSerializer < ActiveModel::Serializer
   def static_url
     full_asset_url(object.custom_emoji.image.url(:static))
   end
+
+  private
+
+  def extern?
+    custom_emoji? && object.custom_emoji.domain.present?
+  end
 end
diff --git a/app/validators/status_reaction_validator.rb b/app/validators/status_reaction_validator.rb
index a60271dd8..d85d48e4c 100644
--- a/app/validators/status_reaction_validator.rb
+++ b/app/validators/status_reaction_validator.rb
@@ -18,10 +18,6 @@ class StatusReactionValidator < ActiveModel::Validator
     SUPPORTED_EMOJIS.include?(name)
   end
 
-  def new_reaction?(reaction)
-    !reaction.status.status_reactions.where(name: reaction.name).exists?
-  end
-
   def limit_reached?(reaction)
     reaction.status.status_reactions.where(status: reaction.status, account: reaction.account).count >= LIMIT
   end
diff --git a/config/routes.rb b/config/routes.rb
index 2eeff8fcb..87634a7f5 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -442,8 +442,10 @@ Rails.application.routes.draw do
           resource :favourite, only: :create
           post :unfavourite, to: 'favourites#destroy'
 
-          post '/react/:id', to: 'reactions#create'
-          post '/unreact/:id', to: 'reactions#destroy'
+          # foreign custom emojis are encoded as shortcode@domain.tld
+          # the constraint prevents rails from interpreting the ".tld" as a filename extension
+          post '/react/:id', to: 'reactions#create', constraints: { id: /[^\/]+/ }
+          post '/unreact/:id', to: 'reactions#destroy', constraints: { id: /[^\/]+/ }
 
           resource :bookmark, only: :create
           post :unbookmark, to: 'bookmarks#destroy'

From 6e5fc00fff651c6d0fb92d7f4dbbd2b1fb879be1 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 7 Dec 2022 12:47:03 +0000
Subject: [PATCH 42/47] delete reaction notifications when deleting status

---
 app/models/status_reaction.rb | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/app/models/status_reaction.rb b/app/models/status_reaction.rb
index 0833a7eaf..00be17e23 100644
--- a/app/models/status_reaction.rb
+++ b/app/models/status_reaction.rb
@@ -16,6 +16,8 @@ class StatusReaction < ApplicationRecord
   belongs_to :status, inverse_of: :status_reactions
   belongs_to :custom_emoji, optional: true
 
+  has_one :notification, as: :activity, dependent: :destroy
+
   validates :name, presence: true
   validates_with StatusReactionValidator
 

From 74c0ec42f6cb4911e709c3042a64deaf518e2592 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Wed, 7 Dec 2022 21:52:53 +0100
Subject: [PATCH 43/47] fix schema after rebase

---
 db/schema.rb | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/db/schema.rb b/db/schema.rb
index 7462bf2c7..bb685a9db 100644
--- a/db/schema.rb
+++ b/db/schema.rb
@@ -897,6 +897,19 @@ ActiveRecord::Schema.define(version: 2022_12_06_114142) do
     t.index ["status_id"], name: "index_status_pins_on_status_id"
   end
 
+  create_table "status_reactions", force: :cascade do |t|
+    t.bigint "account_id", null: false
+    t.bigint "status_id", null: false
+    t.string "name", default: "", null: false
+    t.bigint "custom_emoji_id"
+    t.datetime "created_at", precision: 6, null: false
+    t.datetime "updated_at", precision: 6, null: false
+    t.index ["account_id", "status_id", "name"], name: "index_status_reactions_on_account_id_and_status_id", unique: true
+    t.index ["account_id"], name: "index_status_reactions_on_account_id"
+    t.index ["custom_emoji_id"], name: "index_status_reactions_on_custom_emoji_id"
+    t.index ["status_id"], name: "index_status_reactions_on_status_id"
+  end
+
   create_table "status_stats", force: :cascade do |t|
     t.bigint "status_id", null: false
     t.bigint "replies_count", default: 0, null: false
@@ -1211,6 +1224,9 @@ ActiveRecord::Schema.define(version: 2022_12_06_114142) do
   add_foreign_key "status_edits", "statuses", on_delete: :cascade
   add_foreign_key "status_pins", "accounts", name: "fk_d4cb435b62", on_delete: :cascade
   add_foreign_key "status_pins", "statuses", on_delete: :cascade
+  add_foreign_key "status_reactions", "accounts", on_delete: :cascade
+  add_foreign_key "status_reactions", "custom_emojis", on_delete: :cascade
+  add_foreign_key "status_reactions", "statuses", on_delete: :cascade
   add_foreign_key "status_stats", "statuses", on_delete: :cascade
   add_foreign_key "status_trends", "accounts", on_delete: :cascade
   add_foreign_key "status_trends", "statuses", on_delete: :cascade

From 1d43e6b9b05a9c5b27c50e2e0d3d6552806608fa Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Thu, 8 Dec 2022 09:48:55 +0000
Subject: [PATCH 44/47] fix status action bar after upstream changes

---
 app/javascript/mastodon/components/status_action_bar.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/app/javascript/mastodon/components/status_action_bar.js b/app/javascript/mastodon/components/status_action_bar.js
index 40738aa4e..56a98744f 100644
--- a/app/javascript/mastodon/components/status_action_bar.js
+++ b/app/javascript/mastodon/components/status_action_bar.js
@@ -374,7 +374,11 @@ class StatusActionBar extends ImmutablePureComponent {
         <IconButton className='status__action-bar__button' title={replyTitle} icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon} onClick={this.handleReplyClick} counter={status.get('replies_count')} obfuscateCount />
         <IconButton className={classNames('status__action-bar__button', { reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} counter={withCounters ? status.get('reblogs_count') : undefined} />
         <IconButton className='status__action-bar__button star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} counter={withCounters ? status.get('favourites_count') : undefined} />
-        <EmojiPickerDropdown className='status__action-bar-button' onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
+        {
+          signedIn
+            ? <EmojiPickerDropdown className='status__action-bar-button' onPickEmoji={this.handleEmojiPick} button={reactButton} disabled={!canReact} />
+            : reactButton
+        }
         <IconButton className='status__action-bar__button bookmark-icon' disabled={!signedIn} active={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} />
 
         {shareButton}

From c957eb758c1b4beb5d000e922e8931492b9912dd Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Sun, 11 Dec 2022 13:26:23 +0000
Subject: [PATCH 45/47] fix 404 when reacting with Keycap Number Sign

The Unicode sequence for this emoji starts with an
ASCII # character, which the browser's URI parser
truncates before sending the request to the
backend.
---
 app/javascript/flavours/glitch/actions/interactions.js | 6 ++++--
 app/javascript/mastodon/actions/interactions.js        | 6 ++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/app/javascript/flavours/glitch/actions/interactions.js b/app/javascript/flavours/glitch/actions/interactions.js
index 2d483de81..a7eb7a78d 100644
--- a/app/javascript/flavours/glitch/actions/interactions.js
+++ b/app/javascript/flavours/glitch/actions/interactions.js
@@ -416,7 +416,9 @@ export const addReaction = (statusId, name, url) => (dispatch, getState) => {
     dispatch(addReactionRequest(statusId, name, url));
   }
 
-  api(getState).post(`/api/v1/statuses/${statusId}/react/${name}`).then(() => {
+  // encodeURIComponent is required for the Keycap Number Sign emoji, see:
+  // <https://github.com/glitch-soc/mastodon/pull/1980#issuecomment-1345538932>
+  api(getState).post(`/api/v1/statuses/${statusId}/react/${encodeURIComponent(name)}`).then(() => {
     dispatch(addReactionSuccess(statusId, name));
   }).catch(err => {
     if (!alreadyAdded) {
@@ -448,7 +450,7 @@ export const addReactionFail = (statusId, name, error) => ({
 export const removeReaction = (statusId, name) => (dispatch, getState) => {
   dispatch(removeReactionRequest(statusId, name));
 
-  api(getState).post(`/api/v1/statuses/${statusId}/unreact/${name}`).then(() => {
+  api(getState).post(`/api/v1/statuses/${statusId}/unreact/${encodeURIComponent(name)}`).then(() => {
     dispatch(removeReactionSuccess(statusId, name));
   }).catch(err => {
     dispatch(removeReactionFail(statusId, name, err));
diff --git a/app/javascript/mastodon/actions/interactions.js b/app/javascript/mastodon/actions/interactions.js
index 54592ec53..743387025 100644
--- a/app/javascript/mastodon/actions/interactions.js
+++ b/app/javascript/mastodon/actions/interactions.js
@@ -436,7 +436,9 @@ export const addReaction = (statusId, name, url) => (dispatch, getState) => {
     dispatch(addReactionRequest(statusId, name, url));
   }
 
-  api(getState).post(`/api/v1/statuses/${statusId}/react/${name}`).then(() => {
+  // encodeURIComponent is required for the Keycap Number Sign emoji, see:
+  // <https://github.com/glitch-soc/mastodon/pull/1980#issuecomment-1345538932>
+  api(getState).post(`/api/v1/statuses/${statusId}/react/${encodeURIComponent(name)}`).then(() => {
     dispatch(addReactionSuccess(statusId, name));
   }).catch(err => {
     if (!alreadyAdded) {
@@ -468,7 +470,7 @@ export const addReactionFail = (statusId, name, error) => ({
 export const removeReaction = (statusId, name) => (dispatch, getState) => {
   dispatch(removeReactionRequest(statusId, name));
 
-  api(getState).post(`/api/v1/statuses/${statusId}/unreact/${name}`).then(() => {
+  api(getState).post(`/api/v1/statuses/${statusId}/unreact/${encodeURIComponent(name)}`).then(() => {
     dispatch(removeReactionSuccess(statusId, name));
   }).catch(err => {
     dispatch(removeReactionFail(statusId, name, err));

From 303cd4038a3c9bf6640105eadd720d73a60b6050 Mon Sep 17 00:00:00 2001
From: fef <owo@fef.moe>
Date: Thu, 15 Dec 2022 15:27:54 +0000
Subject: [PATCH 46/47] bypass reaction limit for foreign accounts

---
 app/validators/status_reaction_validator.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/validators/status_reaction_validator.rb b/app/validators/status_reaction_validator.rb
index d85d48e4c..8c623c823 100644
--- a/app/validators/status_reaction_validator.rb
+++ b/app/validators/status_reaction_validator.rb
@@ -9,7 +9,7 @@ class StatusReactionValidator < ActiveModel::Validator
     return if reaction.name.blank?
 
     reaction.errors.add(:name, I18n.t('reactions.errors.unrecognized_emoji')) if reaction.custom_emoji_id.blank? && !unicode_emoji?(reaction.name)
-    reaction.errors.add(:base, I18n.t('reactions.errors.limit_reached')) if limit_reached?(reaction)
+    reaction.errors.add(:base, I18n.t('reactions.errors.limit_reached')) if reaction.account.local? && limit_reached?(reaction)
   end
 
   private

From e35c31114f4880f8422592b3fab73270bfffaab7 Mon Sep 17 00:00:00 2001
From: Jeremy Kescher <jeremy@kescher.at>
Date: Sun, 18 Dec 2022 04:23:42 +0100
Subject: [PATCH 47/47] Fix status reactions preventing an on_cascade delete

---
 db/migrate/20221124114030_create_status_reactions.rb | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/db/migrate/20221124114030_create_status_reactions.rb b/db/migrate/20221124114030_create_status_reactions.rb
index bbf1f3376..5f010c4a0 100644
--- a/db/migrate/20221124114030_create_status_reactions.rb
+++ b/db/migrate/20221124114030_create_status_reactions.rb
@@ -1,10 +1,10 @@
 class CreateStatusReactions < ActiveRecord::Migration[6.1]
   def change
     create_table :status_reactions do |t|
-      t.references :account, null: false, foreign_key: true
-      t.references :status, null: false, foreign_key: true
+      t.references :account, null: false, foreign_key: { on_delete: :cascade }
+      t.references :status, null: false, foreign_key: { on_delete: :cascade }
       t.string :name, null: false, default: ''
-      t.references :custom_emoji, null: true, foreign_key: true
+      t.references :custom_emoji, null: true, foreign_key: { on_delete: :cascade }
 
       t.timestamps
     end