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

@@ -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)

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}

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

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;

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',
 };
 

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)',

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',
 };
 

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,

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

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
 

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

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

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

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

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

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