Add media_expand setting

app/controllers/settings/preferences_controller.rb

@@ -42,6 +42,7 @@ class Settings::PreferencesController < Settings::BaseController
       :setting_delete_modal,
       :setting_auto_play_gif,
       :setting_display_media,
+      :setting_display_media_expand,
       :setting_expand_spoilers,
       :setting_reduce_motion,
       :setting_disable_swiping,

app/javascript/mastodon/components/media_gallery.jsx

@@ -5,7 +5,7 @@ import { is } from 'immutable';
 import IconButton from './icon_button';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 import classNames from 'classnames';
-import { autoPlayGif, cropImages, displayMedia, useBlurhash } from '../initial_state';
+import { autoPlayGif, cropImages, displayMedia, displayMediaExpand, useBlurhash } from '../initial_state';
 import { debounce } from 'lodash';
 import Blurhash from 'mastodon/components/blurhash';
 
@@ -357,13 +357,16 @@ class MediaGallery extends React.PureComponent {
       style.height = height;
     }
 
-    const size     = media.take(8).size;
+    const maxSize = displayMediaExpand ? 8 : 4;
+    console.log(displayMediaExpand)
+
+    const size     = media.take(maxSize).size;
     const uncached = media.every(attachment => attachment.get('type') === 'unknown');
 
     if (standalone && this.isFullSizeEligible()) {
       children = <Item standalone autoplay={autoplay} onClick={this.handleClick} attachment={media.get(0)} lang={lang} displayWidth={width} visible={visible} />;
     } else {
-      children = media.take(8).map((attachment, i) => <Item key={attachment.get('id')} autoplay={autoplay} onClick={this.handleClick} attachment={attachment} index={i} lang={lang} size={size} displayWidth={width} visible={visible || uncached} />);
+      children = media.take(maxSize).map((attachment, i) => <Item key={attachment.get('id')} autoplay={autoplay} onClick={this.handleClick} attachment={attachment} index={i} lang={lang} size={size} displayWidth={width} visible={visible || uncached} />);
     }
 
     if (uncached) {

app/javascript/mastodon/initial_state.js

@@ -56,6 +56,7 @@
  * @property {boolean=} disable_swiping
  * @property {string=} disabled_account_id
  * @property {boolean} display_media
+ * @property {boolean} display_media_expand
  * @property {string} domain
  * @property {boolean=} expand_spoilers
  * @property {boolean} limited_federation_mode
@@ -108,6 +109,7 @@ export const deleteModal = getMeta('delete_modal');
 export const disableSwiping = getMeta('disable_swiping');
 export const disabledAccountId = getMeta('disabled_account_id');
 export const displayMedia = getMeta('display_media');
+export const displayMediaExpand = getMeta('display_media_expand');
 export const domain = getMeta('domain');
 export const expandSpoilers = getMeta('expand_spoilers');
 export const forceSingleColumn = !getMeta('advanced_layout');

app/lib/user_settings_decorator.rb

@@ -26,6 +26,7 @@ class UserSettingsDecorator
     user.settings['delete_modal']        = delete_modal_preference if change?('setting_delete_modal')
     user.settings['auto_play_gif']       = auto_play_gif_preference if change?('setting_auto_play_gif')
     user.settings['display_media']       = display_media_preference if change?('setting_display_media')
+    user.settings['display_media_expand']= display_media_expand_preference if change?('setting_display_media_expand')
     user.settings['expand_spoilers']     = expand_spoilers_preference if change?('setting_expand_spoilers')
     user.settings['reduce_motion']       = reduce_motion_preference if change?('setting_reduce_motion')
     user.settings['disable_swiping']     = disable_swiping_preference if change?('setting_disable_swiping')
@@ -86,6 +87,10 @@ class UserSettingsDecorator
     settings['setting_display_media']
   end
 
+  def display_media_expand_preference
+    boolean_cast_setting 'setting_display_media_expand'
+  end
+
   def expand_spoilers_preference
     boolean_cast_setting 'setting_expand_spoilers'
   end

app/models/user.rb

@@ -134,7 +134,7 @@ class User < ApplicationRecord
   has_many :session_activations, dependent: :destroy
 
   delegate :auto_play_gif, :default_sensitive, :unfollow_modal, :boost_modal, :delete_modal,
-           :reduce_motion, :system_font_ui, :noindex, :theme, :display_media,
+           :reduce_motion, :system_font_ui, :noindex, :theme, :display_media, :display_media_expand,
            :expand_spoilers, :default_language, :aggregate_reblogs, :show_application,
            :advanced_layout, :use_blurhash, :use_pending_items, :trends, :crop_images,
            :disable_swiping, :always_send_emails,

app/serializers/initial_state_serializer.rb

@@ -41,6 +41,7 @@ class InitialStateSerializer < ActiveModel::Serializer
       store[:delete_modal]      = object.current_account.user.setting_delete_modal
       store[:auto_play_gif]     = object.current_account.user.setting_auto_play_gif
       store[:display_media]     = object.current_account.user.setting_display_media
+      store[:display_media_expand]=object.current_account.user.setting_display_media_expand
       store[:expand_spoilers]   = object.current_account.user.setting_expand_spoilers
       store[:reduce_motion]     = object.current_account.user.setting_reduce_motion
       store[:disable_swiping]   = object.current_account.user.setting_disable_swiping

app/views/settings/preferences/appearance/show.html.haml

@@ -55,6 +55,9 @@
   .fields-group
     = f.input :setting_display_media, collection: ['default', 'show_all', 'hide_all'],label_method: lambda { |item| t("simple_form.hints.defaults.setting_display_media_#{item}") }, hint: false, as: :radio_buttons, collection_wrapper_tag: 'ul', item_wrapper_tag: 'li', wrapper: :with_floating_label
 
+  .fields-group
+    = f.input :setting_display_media_expand, as: :boolean, wrapper: :with_label
+
   .fields-group
     = f.input :setting_use_blurhash, as: :boolean, wrapper: :with_label
 

config/locales/simple_form.en.yml

@@ -212,6 +212,7 @@ en:
         setting_disable_swiping: Disable swiping motions
         setting_display_media: Media display
         setting_display_media_default: Default
+        setting_display_media_expand: Show more medias
         setting_display_media_hide_all: Hide all
         setting_display_media_show_all: Show all
         setting_expand_spoilers: Always expand posts marked with content warnings

config/locales/simple_form.ja.yml

@@ -58,6 +58,7 @@ ja:
         setting_display_media_hide_all: メディアを常に隠す
         setting_display_media_show_all: メディアを常に表示する
         setting_hide_network: フォローとフォロワーの情報がプロフィールページで見られないようにします
+        setting_display_media_expand: Misskeyなどは4個を超えて投稿可能です。その追加分を最大8個まで表示します。kmyblueからアップロードはできません
         setting_noindex: 公開プロフィールおよび各投稿ページに影響します
         setting_show_application: 投稿するのに使用したアプリが投稿の詳細ビューに表示されるようになります
         setting_use_blurhash: ぼかしはメディアの色を元に生成されますが、細部は見えにくくなっています
@@ -212,6 +213,7 @@ ja:
         setting_disable_swiping: スワイプでの切り替えを無効にする
         setting_display_media: メディアの表示
         setting_display_media_default: 標準
+        setting_display_media_expand: 5個目以降のメディアも表示する (最大8)
         setting_display_media_hide_all: 非表示
         setting_display_media_show_all: 表示
         setting_expand_spoilers: 閲覧注意としてマークされた投稿を常に展開する