diff --git a/app/javascript/flavours/glitch/actions/compose.js b/app/javascript/flavours/glitch/actions/compose.js index 064a49f5c8..e038dac88b 100644 --- a/app/javascript/flavours/glitch/actions/compose.js +++ b/app/javascript/flavours/glitch/actions/compose.js @@ -192,6 +192,9 @@ export function directCompose(account) { }; } +/** + * @param {null | string} overridePrivacy + */ export function submitCompose(overridePrivacy = null) { return function (dispatch, getState) { let status = getState().getIn(['compose', 'text'], ''); diff --git a/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx b/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx index b423c61e5f..957141cd78 100644 --- a/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx +++ b/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx @@ -10,6 +10,8 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; import { length } from 'stringz'; +import { missingAltTextModal } from 'flavours/glitch/initial_state'; + import AutosuggestInput from '../../../components/autosuggest_input'; import AutosuggestTextarea from '../../../components/autosuggest_textarea'; import { Button } from '../../../components/button'; @@ -72,9 +74,8 @@ class ComposeForm extends ImmutablePureComponent { autoFocus: PropTypes.bool, withoutNavigation: PropTypes.bool, anyMedia: PropTypes.bool, + missingAltText: PropTypes.bool, media: ImmutablePropTypes.list, - mediaDescriptionConfirmation: PropTypes.bool, - onMediaDescriptionConfirm: PropTypes.func.isRequired, isInReply: PropTypes.bool, singleColumn: PropTypes.bool, lang: PropTypes.string, @@ -131,17 +132,11 @@ class ComposeForm extends ImmutablePureComponent { return; } + this.props.onSubmit(missingAltTextModal && this.props.missingAltText, overridePrivacy); + if (e) { e.preventDefault(); } - - // Submit unless there are media with missing descriptions - if (this.props.mediaDescriptionConfirmation && this.props.media && this.props.media.some(item => !item.get('description'))) { - const firstWithoutDescription = this.props.media.find(item => !item.get('description')); - this.props.onMediaDescriptionConfirm(firstWithoutDescription.get('id'), overridePrivacy); - } else { - this.props.onSubmit(overridePrivacy); - } }; handleSecondarySubmit = (e) => { diff --git a/app/javascript/flavours/glitch/features/compose/containers/compose_form_container.js b/app/javascript/flavours/glitch/features/compose/containers/compose_form_container.js index 227e793869..4a2f247900 100644 --- a/app/javascript/flavours/glitch/features/compose/containers/compose_form_container.js +++ b/app/javascript/flavours/glitch/features/compose/containers/compose_form_container.js @@ -1,9 +1,7 @@ -import { defineMessages, injectIntl } from 'react-intl'; +import { injectIntl } from 'react-intl'; import { connect } from 'react-redux'; -import { privacyPreference } from 'flavours/glitch/utils/privacy_preference'; - import { changeCompose, submitCompose, @@ -13,27 +11,11 @@ import { changeComposeSpoilerText, insertEmojiCompose, uploadCompose, -} from '../../../actions/compose'; -import { changeLocalSetting } from '../../../actions/local_settings'; -import { - openModal, -} from '../../../actions/modal'; -import ComposeForm from '../components/compose_form'; +} from 'flavours/glitch/actions/compose'; +import { openModal } from 'flavours/glitch/actions/modal'; +import { privacyPreference } from 'flavours/glitch/utils/privacy_preference'; -const messages = defineMessages({ - missingDescriptionMessage: { - id: 'confirmations.missing_media_description.message', - defaultMessage: 'At least one media attachment is lacking a description. Consider describing all media attachments for the visually impaired before sending your toot.', - }, - missingDescriptionConfirm: { - id: 'confirmations.missing_media_description.confirm', - defaultMessage: 'Send anyway', - }, - missingDescriptionEdit: { - id: 'confirmations.missing_media_description.edit', - defaultMessage: 'Edit media', - }, -}); +import ComposeForm from '../components/compose_form'; const sideArmPrivacy = state => { const inReplyTo = state.getIn(['compose', 'in_reply_to']); @@ -68,22 +50,29 @@ const mapStateToProps = state => ({ isChangingUpload: state.getIn(['compose', 'is_changing_upload']), isUploading: state.getIn(['compose', 'is_uploading']), anyMedia: state.getIn(['compose', 'media_attachments']).size > 0, + missingAltText: state.getIn(['compose', 'media_attachments']).some(media => ['image', 'gifv'].includes(media.get('type')) && (media.get('description') ?? '').length === 0), isInReply: state.getIn(['compose', 'in_reply_to']) !== null, lang: state.getIn(['compose', 'language']), sideArm: sideArmPrivacy(state), media: state.getIn(['compose', 'media_attachments']), - mediaDescriptionConfirmation: state.getIn(['local_settings', 'confirm_missing_media_description']), maxChars: state.getIn(['server', 'server', 'configuration', 'statuses', 'max_characters'], 500), }); -const mapDispatchToProps = (dispatch, { intl }) => ({ +const mapDispatchToProps = (dispatch) => ({ onChange (text) { dispatch(changeCompose(text)); }, - onSubmit (overridePrivacy = null) { - dispatch(submitCompose(overridePrivacy)); + onSubmit (missingAltText, overridePrivacy = null) { + if (missingAltText) { + dispatch(openModal({ + modalType: 'CONFIRM_MISSING_ALT_TEXT', + modalProps: { overridePrivacy }, + })); + } else { + dispatch(submitCompose(overridePrivacy)); + } }, onClearSuggestions () { @@ -110,25 +99,6 @@ const mapDispatchToProps = (dispatch, { intl }) => ({ dispatch(insertEmojiCompose(position, data, needsSpace)); }, - onMediaDescriptionConfirm (mediaId, overridePrivacy = null) { - dispatch(openModal({ - modalType: 'CONFIRM', - modalProps: { - message: intl.formatMessage(messages.missingDescriptionMessage), - confirm: intl.formatMessage(messages.missingDescriptionConfirm), - onConfirm: () => { - dispatch(submitCompose(overridePrivacy)); - }, - secondary: intl.formatMessage(messages.missingDescriptionEdit), - onSecondary: () => dispatch(openModal({ - modalType: 'FOCAL_POINT', - modalProps: { id: mediaId }, - })), - onDoNotAsk: () => dispatch(changeLocalSetting(['confirm_missing_media_description'], false)), - }, - })); - }, - }); export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(ComposeForm)); diff --git a/app/javascript/flavours/glitch/features/local_settings/page/index.jsx b/app/javascript/flavours/glitch/features/local_settings/page/index.jsx index 05c2599b4d..c2a6dcc1a7 100644 --- a/app/javascript/flavours/glitch/features/local_settings/page/index.jsx +++ b/app/javascript/flavours/glitch/features/local_settings/page/index.jsx @@ -200,14 +200,6 @@ class LocalSettingsPage extends PureComponent { - - -
- {secondary && ( - <> - - -
- - )} - + {secondary && ( + <> +
+ + + )} + {/* eslint-disable-next-line jsx-a11y/no-autofocus -- we are in a modal and thus autofocusing is justified */}