tykayn/mastodon
1
0
Fork 0
mirror of https://framagit.org/tykayn/mastodon.git synced 2023-08-25 08:33:12 +02:00
Code Issues Projects Releases Wiki Activity

⚡ factorize maxTootCharsLimit to only have one setting in the compose form

Browse Source
This commit is contained in:
Baptiste Lemoine 2019-12-23 12:10:55 +01:00
parent 26002f4b67
commit 879a6ef656
1 changed files with 35 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
app/javascript/mastodon/features/compose/components/compose_form.js
View File

@ -46,6 +46,7 @@ class ComposeForm extends ImmutablePureComponent {
spoilerText : PropTypes.string,
focusDate : PropTypes.instanceOf(Date),
caretPosition : PropTypes.number,
maxTootCharsLimit : PropTypes.number,
preselectDate : PropTypes.instanceOf(Date),
isSubmitting : PropTypes.bool,
isChangingUpload : PropTypes.bool,
@ -64,7 +65,8 @@ class ComposeForm extends ImmutablePureComponent {
};
static defaultProps = {
showSearch: false,
showSearch : false,
maxTootCharsLimit: 7777,
};
handleChange = (e) => {
@ -88,7 +90,7 @@ class ComposeForm extends ImmutablePureComponent {
const { isSubmitting, isChangingUpload, isUploading, anyMedia } = this.props;
const fulltext = [this.props.spoilerText, countableText(this.props.text)].join('');
if (isSubmitting || isUploading || isChangingUpload || length(fulltext) > 7777 || (fulltext.length !== 0 && fulltext.trim().length === 0 && !anyMedia)) {
if (isSubmitting || isUploading || isChangingUpload || length(fulltext) > this.props.maxTootCharsLimit || (fulltext.length !== 0 && fulltext.trim().length === 0 && !anyMedia)) {
return;
}
@ -181,23 +183,26 @@ class ComposeForm extends ImmutablePureComponent {
const { intl, onPaste, showSearch, anyMedia } = this.props;
const disabled = this.props.isSubmitting;
const text = [this.props.spoilerText, countableText(this.props.text)].join('');
const disabledButton = disabled || this.props.isUploading || this.props.isChangingUpload || length(text) > 7777 || (text.length !== 0 && text.trim().length === 0 && !anyMedia);
const disabledButton = disabled || this.props.isUploading || this.props.isChangingUpload || length(text) > this.props.maxTootCharsLimit || (text.length !== 0 && text.trim().length === 0 && !anyMedia);
let publishText = '';
if (this.props.privacy === 'private' || this.props.privacy === 'direct') {
publishText =
<span className='compose-form__publish-private'><Icon id='lock'/> {intl.formatMessage(messages.publish)}</span>;
<span className='compose-form__publish-private'><Icon id='lock' /> {intl.formatMessage(messages.publish)}</span >;
} else {
publishText = this.props.privacy !== 'unlisted' ? intl.formatMessage(messages.publishLoud, { publish: intl.formatMessage(messages.publish) }) : intl.formatMessage(messages.publish);
}
return (
<div className='compose-form'>
<WarningContainer/>
<WarningContainer />
<ReplyIndicatorContainer/>
<ReplyIndicatorContainer />
<div className={`spoiler-input ${this.props.spoiler ? 'spoiler-input--visible' : ''}`} ref={this.setRef}>
<div
className={`spoiler-input ${this.props.spoiler ? 'spoiler-input--visible' : ''}`}
ref={this.setRef}
>
<AutosuggestInput
placeholder={intl.formatMessage(messages.spoiler_placeholder)}
value={this.props.spoilerText}
@ -213,7 +218,7 @@ class ComposeForm extends ImmutablePureComponent {
id='cw-spoiler-input'
className='spoiler-input__input'
/>
</div>
</div >
<AutosuggestTextarea
ref={this.setAutosuggestTextarea}
@ -230,31 +235,36 @@ class ComposeForm extends ImmutablePureComponent {
onPaste={onPaste}
autoFocus={!showSearch && !isMobile(window.innerWidth)}
>
<EmojiPickerDropdown onPickEmoji={this.handleEmojiPick}/>
<EmojiPickerDropdown onPickEmoji={this.handleEmojiPick} />
<div className='compose-form__modifiers'>
<UploadFormContainer/>
<PollFormContainer/>
</div>
</AutosuggestTextarea>
<UploadFormContainer />
<PollFormContainer />
</div >
</AutosuggestTextarea >
<div className='compose-form__buttons-wrapper'>
<div className='compose-form__buttons'>
<UploadButtonContainer/>
<PollButtonContainer/>
<PrivacyDropdownContainer/>
<SpoilerButtonContainer/>
</div>
<div className='character-counter__wrapper'><CharacterCounter max={7777} text={text}/></div>
</div>
<UploadButtonContainer />
<PollButtonContainer />
<PrivacyDropdownContainer />
<SpoilerButtonContainer />
</div >
<div className='character-counter__wrapper'><CharacterCounter
max={this.props.maxTootCharsLimit}
text={text}
/></div >
</div >
<div className='compose-form__publish'>
<div className='compose-form__publish-button-wrapper'><Button
text={publishText} onClick={this.handleSubmit}
disabled={disabledButton} block
/></div>
</div>
text={publishText}
onClick={this.handleSubmit}
disabled={disabledButton}
block
/></div >
</div >
</div>
</div >
);
}