Allow users to set the trigger height for lengthy toot auto-collapse (#2070)

* Allow users to set the trigger height for lengthy toot autocollapse

Add a field in the glitch-soc preferences to set the exact height in pixels of a "lengthy toot" where auto-collapse is triggered

Originally authored by Dean Bassett (github.com/deanveloper)

Squashed 3 commits from neatchee/mastodon and returned some values to project defaults:
* ef665c1df5821e684c8da3392049f33243fafa74
* 0fce108d210efe55027a3af061bfc57aaaa83843
* 998f701a2b2e37edbda7dffb11a61f67f5559b18

* Remove bad escape characters

* Apply feedback from glitch-soc code review
- move input width specification to CSS
- adjust language for clarity

* Update comments re: lengthy toot height

* Fix inconsistent indentation

* Use a calculated width that scales better with browser font instead of static 45px width

1 files changed, 13 insertions, 1 deletions

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..d1573da9c 100644
--- a/app/javascript/flavours/glitch/features/local_settings/page/index.js
+++ b/app/javascript/flavours/glitch/features/local_settings/page/index.js
@@ -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='400'
+            onChange={onChange}
+            dependsOn={[['collapsed', 'enabled']]}
+            dependsOnNot={[['collapsed', 'auto', 'all']]}
+            inputProps={{type: 'number', min: '200', max: '999'}}
+          >
+            <FormattedMessage id='settings.auto_collapse_height' defaultMessage='Height (in pixels) for a toot to be considered lengthy' />
+          </LocalSettingsPageItem>
         </section>
         <section>
           <h2><FormattedMessage id='settings.image_backgrounds' defaultMessage='Image backgrounds' /></h2>