add configuration option for autocollapse (#2)

pull/2061/head
Dean Bassett 2022-12-29 17:26:08 -08:00 committed by neatchee
parent de67b567ad
commit ef665c1df5
5 changed files with 29 additions and 4 deletions

View File

@ -251,6 +251,10 @@ class Status extends ImmutablePureComponent {
// as it could cause surprising changes when receiving notifications
if (settings.getIn(['content_warnings', 'shared_state']) && status.get('spoiler_text').length && !status.get('hidden')) return;
let autoCollapseHeight = autoCollapseSettings.get('height');
if (status.get('media_attachments').size && !muted) {
autoCollapseHeight += 300;
}
if (collapse ||
autoCollapseSettings.get('all') ||
(autoCollapseSettings.get('notifications') && muted) ||

View File

@ -5,7 +5,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
// Our imports
import { expandSpoilers, disableSwiping } from 'flavours/glitch/initial_state';
import { expandSpoilers } from 'flavours/glitch/initial_state';
import { preferenceLink } from 'flavours/glitch/utils/backend_links';
import LocalSettingsPageItem from './item';
import DeprecatedLocalSettingsPageItem from './deprecated_item';
@ -406,6 +406,18 @@ class LocalSettingsPage extends React.PureComponent {
>
<FormattedMessage id='settings.auto_collapse_media' defaultMessage='Toots with media' />
</LocalSettingsPageItem>
<LocalSettingsPageItem
settings={settings}
item={['collapsed', 'auto', 'height']}
id='mastodon-settings--collapsed-auto-height'
placeholder='500'
onChange={onChange}
dependsOn={[['collapsed', 'enabled']]}
dependsOnNot={[['collapsed', 'auto', 'all']]}
inputProps={{ type: 'number', min: '200' }}
>
<FormattedMessage id='settings.auto_collapse_height' defaultMessage='Height (pixels) of toots before auto-collapsing' />
</LocalSettingsPageItem>
</section>
<section>
<h2><FormattedMessage id='settings.image_backgrounds' defaultMessage='Image backgrounds' /></h2>

View File

@ -14,6 +14,7 @@ export default class LocalSettingsPageItem extends React.PureComponent {
id: PropTypes.string.isRequired,
item: PropTypes.array.isRequired,
onChange: PropTypes.func.isRequired,
inputProps: PropTypes.object,
options: PropTypes.arrayOf(PropTypes.shape({
value: PropTypes.string.isRequired,
message: PropTypes.string.isRequired,
@ -27,6 +28,7 @@ export default class LocalSettingsPageItem extends React.PureComponent {
handleChange = e => {
const { target } = e;
const { item, onChange, options, placeholder } = this.props;
if (options && options.length > 0) onChange(item, target.value);
else if (placeholder) onChange(item, target.value);
else onChange(item, target.checked);
@ -34,7 +36,7 @@ export default class LocalSettingsPageItem extends React.PureComponent {
render () {
const { handleChange } = this;
const { settings, item, id, options, children, dependsOn, dependsOnNot, placeholder, disabled } = this.props;
const { settings, item, id, inputProps, options, children, dependsOn, dependsOnNot, placeholder, disabled } = this.props;
let enabled = !disabled;
if (dependsOn) {
@ -54,14 +56,17 @@ export default class LocalSettingsPageItem extends React.PureComponent {
let optionId = `${id}--${opt.value}`;
return (
<label htmlFor={optionId}>
<input type='radio'
<input
type='radio'
name={id}
id={optionId}
key={optionId}
value={opt.value}
onBlur={handleChange}
onChange={handleChange}
checked={ currentValue === opt.value }
checked={currentValue === opt.value}
disabled={!enabled}
{...inputProps}
/>
{opt.message}
{opt.hint && <span className='hint'>{opt.hint}</span>}
@ -89,6 +94,7 @@ export default class LocalSettingsPageItem extends React.PureComponent {
placeholder={placeholder}
onChange={handleChange}
disabled={!enabled}
{...inputProps}
/>
</p>
</label>
@ -103,6 +109,7 @@ export default class LocalSettingsPageItem extends React.PureComponent {
checked={settings.getIn(item)}
onChange={handleChange}
disabled={!enabled}
{...inputProps}
/>
{children}
</label>

View File

@ -103,6 +103,7 @@
"settings.auto_collapse_all": "Everything",
"settings.auto_collapse_lengthy": "Lengthy toots",
"settings.auto_collapse_media": "Toots with media",
"settings.auto_collapse_height": "Maximum height (pixels) of toots before auto-collapsing",
"settings.auto_collapse_notifications": "Notifications",
"settings.auto_collapse_reblogs": "Boosts",
"settings.auto_collapse_replies": "Replies",

View File

@ -37,6 +37,7 @@ const initialState = ImmutableMap({
reblogs : false,
replies : false,
media : false,
height : 500,
}),
backgrounds : ImmutableMap({
user_backgrounds : false,