From 20166444de497a38835d5832fe72241957fb31d8 Mon Sep 17 00:00:00 2001 From: fef Date: Wed, 30 Nov 2022 13:20:20 +0000 Subject: [PATCH] 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 | 15 ++ .../flavours/glitch/locales/de.json | 3 + app/javascript/flavours/glitch/locales/en.js | 199 ++++++++++++++++++ .../flavours/glitch/locales/en.json | 3 + app/javascript/flavours/glitch/locales/fr.js | 15 ++ .../flavours/glitch/locales/fr.json | 3 + .../glitch/reducers/local_settings.js | 1 + 12 files changed, 272 insertions(+), 16 deletions(-) create mode 100644 app/javascript/flavours/glitch/locales/de.js create mode 100644 app/javascript/flavours/glitch/locales/en.js create mode 100644 app/javascript/flavours/glitch/locales/fr.js diff --git a/.env.production.sample b/.env.production.sample index 326c2cc40..b604c4b04 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 95d7d5698..fd8924f19 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 { { - 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 { > + + +

{ 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 { ); - } else if (placeholder) { + } else if (placeholder || number) { return (