Add OptionsContainer
This commit is contained in:
parent
ef17da32f9
commit
bf8b0394b7
3 changed files with 59 additions and 63 deletions
|
@ -5,7 +5,7 @@ import { defineMessages, injectIntl } from 'react-intl';
|
||||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||||
|
|
||||||
// Components.
|
// Components.
|
||||||
import Options from './options';
|
import OptionsContainer from '../containers/options_container';
|
||||||
import ComposerPublisher from '../../composer/publisher';
|
import ComposerPublisher from '../../composer/publisher';
|
||||||
import TextareaIcons from './textarea_icons';
|
import TextareaIcons from './textarea_icons';
|
||||||
import UploadFormContainer from '../containers/upload_form_container';
|
import UploadFormContainer from '../containers/upload_form_container';
|
||||||
|
@ -39,7 +39,6 @@ class ComposeForm extends ImmutablePureComponent {
|
||||||
intl: PropTypes.object.isRequired,
|
intl: PropTypes.object.isRequired,
|
||||||
|
|
||||||
// State props.
|
// State props.
|
||||||
acceptContentTypes: PropTypes.string,
|
|
||||||
advancedOptions: ImmutablePropTypes.map,
|
advancedOptions: ImmutablePropTypes.map,
|
||||||
amUnlocked: PropTypes.bool,
|
amUnlocked: PropTypes.bool,
|
||||||
focusDate: PropTypes.instanceOf(Date),
|
focusDate: PropTypes.instanceOf(Date),
|
||||||
|
@ -51,7 +50,6 @@ class ComposeForm extends ImmutablePureComponent {
|
||||||
media: ImmutablePropTypes.list,
|
media: ImmutablePropTypes.list,
|
||||||
preselectDate: PropTypes.instanceOf(Date),
|
preselectDate: PropTypes.instanceOf(Date),
|
||||||
privacy: PropTypes.string,
|
privacy: PropTypes.string,
|
||||||
resetFileKey: PropTypes.number,
|
|
||||||
sideArm: PropTypes.string,
|
sideArm: PropTypes.string,
|
||||||
sensitive: PropTypes.bool,
|
sensitive: PropTypes.bool,
|
||||||
showSearch: PropTypes.bool,
|
showSearch: PropTypes.bool,
|
||||||
|
@ -66,19 +64,14 @@ class ComposeForm extends ImmutablePureComponent {
|
||||||
preselectOnReply: PropTypes.bool,
|
preselectOnReply: PropTypes.bool,
|
||||||
|
|
||||||
// Dispatch props.
|
// Dispatch props.
|
||||||
onChangeAdvancedOption: PropTypes.func,
|
|
||||||
onChangeSensitivity: PropTypes.func,
|
|
||||||
onChangeSpoilerText: PropTypes.func,
|
onChangeSpoilerText: PropTypes.func,
|
||||||
onChangeSpoilerness: PropTypes.func,
|
onChangeSpoilerness: PropTypes.func,
|
||||||
onChangeText: PropTypes.func,
|
onChangeText: PropTypes.func,
|
||||||
onChangeVisibility: PropTypes.func,
|
onChangeVisibility: PropTypes.func,
|
||||||
onClearSuggestions: PropTypes.func,
|
onClearSuggestions: PropTypes.func,
|
||||||
onCloseModal: PropTypes.func,
|
|
||||||
onFetchSuggestions: PropTypes.func,
|
onFetchSuggestions: PropTypes.func,
|
||||||
onInsertEmoji: PropTypes.func,
|
onInsertEmoji: PropTypes.func,
|
||||||
onMount: PropTypes.func,
|
onMount: PropTypes.func,
|
||||||
onOpenActionsModal: PropTypes.func,
|
|
||||||
onOpenDoodleModal: PropTypes.func,
|
|
||||||
onSelectSuggestion: PropTypes.func,
|
onSelectSuggestion: PropTypes.func,
|
||||||
onSubmit: PropTypes.func,
|
onSubmit: PropTypes.func,
|
||||||
onUnmount: PropTypes.func,
|
onUnmount: PropTypes.func,
|
||||||
|
@ -285,7 +278,6 @@ class ComposeForm extends ImmutablePureComponent {
|
||||||
handleRefTextarea,
|
handleRefTextarea,
|
||||||
} = this;
|
} = this;
|
||||||
const {
|
const {
|
||||||
acceptContentTypes,
|
|
||||||
advancedOptions,
|
advancedOptions,
|
||||||
amUnlocked,
|
amUnlocked,
|
||||||
anyMedia,
|
anyMedia,
|
||||||
|
@ -295,21 +287,13 @@ class ComposeForm extends ImmutablePureComponent {
|
||||||
isUploading,
|
isUploading,
|
||||||
layout,
|
layout,
|
||||||
media,
|
media,
|
||||||
poll,
|
|
||||||
onChangeAdvancedOption,
|
|
||||||
onChangeSensitivity,
|
|
||||||
onChangeSpoilerness,
|
onChangeSpoilerness,
|
||||||
onChangeText,
|
onChangeText,
|
||||||
onChangeVisibility,
|
onChangeVisibility,
|
||||||
onTogglePoll,
|
|
||||||
onClearSuggestions,
|
onClearSuggestions,
|
||||||
onCloseModal,
|
|
||||||
onFetchSuggestions,
|
onFetchSuggestions,
|
||||||
onOpenActionsModal,
|
|
||||||
onOpenDoodleModal,
|
|
||||||
onUpload,
|
onUpload,
|
||||||
privacy,
|
privacy,
|
||||||
resetFileKey,
|
|
||||||
sensitive,
|
sensitive,
|
||||||
showSearch,
|
showSearch,
|
||||||
sideArm,
|
sideArm,
|
||||||
|
@ -372,27 +356,13 @@ class ComposeForm extends ImmutablePureComponent {
|
||||||
<PollFormContainer />
|
<PollFormContainer />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Options
|
<OptionsContainer
|
||||||
acceptContentTypes={acceptContentTypes}
|
|
||||||
advancedOptions={advancedOptions}
|
advancedOptions={advancedOptions}
|
||||||
disabled={isSubmitting}
|
disabled={isSubmitting}
|
||||||
allowMedia={!poll && (media ? media.size < 4 && !media.some(
|
|
||||||
item => item.get('type') === 'video'
|
|
||||||
) : true)}
|
|
||||||
hasMedia={media && !!media.size}
|
|
||||||
allowPoll={!(media && !!media.size)}
|
|
||||||
hasPoll={!!poll}
|
|
||||||
onChangeAdvancedOption={onChangeAdvancedOption}
|
|
||||||
onChangeSensitivity={onChangeSensitivity}
|
|
||||||
onChangeVisibility={onChangeVisibility}
|
onChangeVisibility={onChangeVisibility}
|
||||||
onTogglePoll={onTogglePoll}
|
|
||||||
onDoodleOpen={onOpenDoodleModal}
|
|
||||||
onModalClose={onCloseModal}
|
|
||||||
onModalOpen={onOpenActionsModal}
|
|
||||||
onToggleSpoiler={spoilersAlwaysOn ? null : onChangeSpoilerness}
|
onToggleSpoiler={spoilersAlwaysOn ? null : onChangeSpoilerness}
|
||||||
onUpload={onUpload}
|
onUpload={onUpload}
|
||||||
privacy={privacy}
|
privacy={privacy}
|
||||||
resetFileKey={resetFileKey}
|
|
||||||
sensitive={sensitive || (spoilersAlwaysOn && spoilerText && spoilerText.length > 0)}
|
sensitive={sensitive || (spoilersAlwaysOn && spoilerText && spoilerText.length > 0)}
|
||||||
spoiler={spoilersAlwaysOn ? (spoilerText && spoilerText.length > 0) : spoiler}
|
spoiler={spoilersAlwaysOn ? (spoilerText && spoilerText.length > 0) : spoiler}
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -2,8 +2,6 @@ import { connect } from 'react-redux';
|
||||||
import ComposeForm from '../components/compose_form';
|
import ComposeForm from '../components/compose_form';
|
||||||
import {
|
import {
|
||||||
changeCompose,
|
changeCompose,
|
||||||
changeComposeAdvancedOption,
|
|
||||||
changeComposeSensitivity,
|
|
||||||
changeComposeSpoilerText,
|
changeComposeSpoilerText,
|
||||||
changeComposeSpoilerness,
|
changeComposeSpoilerness,
|
||||||
changeComposeVisibility,
|
changeComposeVisibility,
|
||||||
|
@ -17,11 +15,9 @@ import {
|
||||||
uploadCompose,
|
uploadCompose,
|
||||||
} from 'flavours/glitch/actions/compose';
|
} from 'flavours/glitch/actions/compose';
|
||||||
import {
|
import {
|
||||||
closeModal,
|
|
||||||
openModal,
|
openModal,
|
||||||
} from 'flavours/glitch/actions/modal';
|
} from 'flavours/glitch/actions/modal';
|
||||||
import { changeLocalSetting } from 'flavours/glitch/actions/local_settings';
|
import { changeLocalSetting } from 'flavours/glitch/actions/local_settings';
|
||||||
import { addPoll, removePoll } from 'flavours/glitch/actions/compose';
|
|
||||||
|
|
||||||
import { privacyPreference } from 'flavours/glitch/util/privacy_preference';
|
import { privacyPreference } from 'flavours/glitch/util/privacy_preference';
|
||||||
import { me } from 'flavours/glitch/util/initial_state';
|
import { me } from 'flavours/glitch/util/initial_state';
|
||||||
|
@ -52,7 +48,6 @@ function mapStateToProps (state) {
|
||||||
}
|
}
|
||||||
sideArmPrivacy = sideArmPrivacy || sideArmBasePrivacy;
|
sideArmPrivacy = sideArmPrivacy || sideArmBasePrivacy;
|
||||||
return {
|
return {
|
||||||
acceptContentTypes: state.getIn(['media_attachments', 'accept_content_types']).toArray().join(','),
|
|
||||||
advancedOptions: state.getIn(['compose', 'advanced_options']),
|
advancedOptions: state.getIn(['compose', 'advanced_options']),
|
||||||
amUnlocked: !state.getIn(['accounts', me, 'locked']),
|
amUnlocked: !state.getIn(['accounts', me, 'locked']),
|
||||||
focusDate: state.getIn(['compose', 'focusDate']),
|
focusDate: state.getIn(['compose', 'focusDate']),
|
||||||
|
@ -64,7 +59,6 @@ function mapStateToProps (state) {
|
||||||
media: state.getIn(['compose', 'media_attachments']),
|
media: state.getIn(['compose', 'media_attachments']),
|
||||||
preselectDate: state.getIn(['compose', 'preselectDate']),
|
preselectDate: state.getIn(['compose', 'preselectDate']),
|
||||||
privacy: state.getIn(['compose', 'privacy']),
|
privacy: state.getIn(['compose', 'privacy']),
|
||||||
resetFileKey: state.getIn(['compose', 'resetFileKey']),
|
|
||||||
sideArm: sideArmPrivacy,
|
sideArm: sideArmPrivacy,
|
||||||
sensitive: state.getIn(['compose', 'sensitive']),
|
sensitive: state.getIn(['compose', 'sensitive']),
|
||||||
showSearch: state.getIn(['search', 'submitted']) && !state.getIn(['search', 'hidden']),
|
showSearch: state.getIn(['search', 'submitted']) && !state.getIn(['search', 'hidden']),
|
||||||
|
@ -74,7 +68,6 @@ function mapStateToProps (state) {
|
||||||
suggestions: state.getIn(['compose', 'suggestions']),
|
suggestions: state.getIn(['compose', 'suggestions']),
|
||||||
text: state.getIn(['compose', 'text']),
|
text: state.getIn(['compose', 'text']),
|
||||||
anyMedia: state.getIn(['compose', 'media_attachments']).size > 0,
|
anyMedia: state.getIn(['compose', 'media_attachments']).size > 0,
|
||||||
poll: state.getIn(['compose', 'poll']),
|
|
||||||
spoilersAlwaysOn: spoilersAlwaysOn,
|
spoilersAlwaysOn: spoilersAlwaysOn,
|
||||||
mediaDescriptionConfirmation: state.getIn(['local_settings', 'confirm_missing_media_description']),
|
mediaDescriptionConfirmation: state.getIn(['local_settings', 'confirm_missing_media_description']),
|
||||||
preselectOnReply: state.getIn(['local_settings', 'preselect_on_reply']),
|
preselectOnReply: state.getIn(['local_settings', 'preselect_on_reply']),
|
||||||
|
@ -83,12 +76,6 @@ function mapStateToProps (state) {
|
||||||
|
|
||||||
// Dispatch mapping.
|
// Dispatch mapping.
|
||||||
const mapDispatchToProps = (dispatch, { intl }) => ({
|
const mapDispatchToProps = (dispatch, { intl }) => ({
|
||||||
onChangeAdvancedOption(option, value) {
|
|
||||||
dispatch(changeComposeAdvancedOption(option, value));
|
|
||||||
},
|
|
||||||
onChangeSensitivity() {
|
|
||||||
dispatch(changeComposeSensitivity());
|
|
||||||
},
|
|
||||||
onChangeSpoilerText(text) {
|
onChangeSpoilerText(text) {
|
||||||
dispatch(changeComposeSpoilerText(text));
|
dispatch(changeComposeSpoilerText(text));
|
||||||
},
|
},
|
||||||
|
@ -101,21 +88,9 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
|
||||||
onChangeVisibility(value) {
|
onChangeVisibility(value) {
|
||||||
dispatch(changeComposeVisibility(value));
|
dispatch(changeComposeVisibility(value));
|
||||||
},
|
},
|
||||||
onTogglePoll() {
|
|
||||||
dispatch((_, getState) => {
|
|
||||||
if (getState().getIn(['compose', 'poll'])) {
|
|
||||||
dispatch(removePoll());
|
|
||||||
} else {
|
|
||||||
dispatch(addPoll());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
onClearSuggestions() {
|
onClearSuggestions() {
|
||||||
dispatch(clearComposeSuggestions());
|
dispatch(clearComposeSuggestions());
|
||||||
},
|
},
|
||||||
onCloseModal() {
|
|
||||||
dispatch(closeModal());
|
|
||||||
},
|
|
||||||
onFetchSuggestions(token) {
|
onFetchSuggestions(token) {
|
||||||
dispatch(fetchComposeSuggestions(token));
|
dispatch(fetchComposeSuggestions(token));
|
||||||
},
|
},
|
||||||
|
@ -125,12 +100,6 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
|
||||||
onMount() {
|
onMount() {
|
||||||
dispatch(mountCompose());
|
dispatch(mountCompose());
|
||||||
},
|
},
|
||||||
onOpenActionsModal(props) {
|
|
||||||
dispatch(openModal('ACTIONS', props));
|
|
||||||
},
|
|
||||||
onOpenDoodleModal() {
|
|
||||||
dispatch(openModal('DOODLE', { noEsc: true }));
|
|
||||||
},
|
|
||||||
onSelectSuggestion(position, token, suggestion) {
|
onSelectSuggestion(position, token, suggestion) {
|
||||||
dispatch(selectComposeSuggestion(position, token, suggestion));
|
dispatch(selectComposeSuggestion(position, token, suggestion));
|
||||||
},
|
},
|
||||||
|
|
|
@ -0,0 +1,57 @@
|
||||||
|
import { connect } from 'react-redux';
|
||||||
|
import Options from '../components/options';
|
||||||
|
import {
|
||||||
|
changeComposeAdvancedOption,
|
||||||
|
changeComposeSensitivity,
|
||||||
|
} from 'flavours/glitch/actions/compose';
|
||||||
|
import { addPoll, removePoll } from 'flavours/glitch/actions/compose';
|
||||||
|
import { closeModal, openModal } from 'flavours/glitch/actions/modal';
|
||||||
|
|
||||||
|
function mapStateToProps (state) {
|
||||||
|
const spoilersAlwaysOn = state.getIn(['local_settings', 'always_show_spoilers_field']);
|
||||||
|
const poll = state.getIn(['compose', 'poll']);
|
||||||
|
const media = state.getIn(['compose', 'media_attachments']);
|
||||||
|
return {
|
||||||
|
acceptContentTypes: state.getIn(['media_attachments', 'accept_content_types']).toArray().join(','),
|
||||||
|
resetFileKey: state.getIn(['compose', 'resetFileKey']),
|
||||||
|
hasPoll: !!poll,
|
||||||
|
allowMedia: !poll && (media ? media.size < 4 && !media.some(item => item.get('type') === 'video') : true),
|
||||||
|
hasMedia: media && !!media.size,
|
||||||
|
allowPoll: !(media && !!media.size),
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
const mapDispatchToProps = (dispatch) => ({
|
||||||
|
|
||||||
|
onChangeAdvancedOption(option, value) {
|
||||||
|
dispatch(changeComposeAdvancedOption(option, value));
|
||||||
|
},
|
||||||
|
|
||||||
|
onChangeSensitivity() {
|
||||||
|
dispatch(changeComposeSensitivity());
|
||||||
|
},
|
||||||
|
|
||||||
|
onTogglePoll() {
|
||||||
|
dispatch((_, getState) => {
|
||||||
|
if (getState().getIn(['compose', 'poll'])) {
|
||||||
|
dispatch(removePoll());
|
||||||
|
} else {
|
||||||
|
dispatch(addPoll());
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
onDoodleOpen() {
|
||||||
|
dispatch(openModal('DOODLE', { noEsc: true }));
|
||||||
|
},
|
||||||
|
|
||||||
|
onModalClose() {
|
||||||
|
dispatch(closeModal());
|
||||||
|
},
|
||||||
|
|
||||||
|
onModalOpen(props) {
|
||||||
|
dispatch(openModal('ACTIONS', props));
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
export default connect(mapStateToProps, mapDispatchToProps)(Options);
|
Loading…
Reference in a new issue