diff options
author | Eugen Rochko <eugen@zeonfederated.com> | 2017-02-26 01:23:44 +0100 |
---|---|---|
committer | Eugen Rochko <eugen@zeonfederated.com> | 2017-02-26 01:23:44 +0100 |
commit | 2c5068727997d4b223e74e765df75d9773b954f7 (patch) | |
tree | 7d60793db17c146438e3eeff5ff8026e673d5891 /app/assets/javascripts/components/features/compose/containers | |
parent | 3e9d794ea50986db5647b4e05a408bf0208bbfa1 (diff) |
Improve compose form performance, upgrade JS dependencies. LightingBox
now allows to cycle through multiple images
Diffstat (limited to 'app/assets/javascripts/components/features/compose/containers')
4 files changed, 63 insertions, 21 deletions
diff --git a/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx b/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx index bff273c15..53129af6e 100644 --- a/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx +++ b/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx @@ -1,26 +1,29 @@ import { connect } from 'react-redux'; import ComposeForm from '../components/compose_form'; +import { createSelector } from 'reselect'; import { changeCompose, submitCompose, clearComposeSuggestions, fetchComposeSuggestions, selectComposeSuggestion, - changeComposeSensitivity, - changeComposeSpoilerness, changeComposeSpoilerText, - changeComposeVisibility, - changeComposeListability } from '../../../actions/compose'; +const getMentionedUsernames = createSelector(state => state.getIn(['compose', 'text']), text => text.match(/(?:^|[^\/\w])@([a-z0-9_]+@[a-z0-9\.\-]+)/ig)); + +const getMentionedDomains = createSelector(getMentionedUsernames, mentionedUsernamesWithDomains => { + return mentionedUsernamesWithDomains !== null ? [...new Set(mentionedUsernamesWithDomains.map(item => item.split('@')[2]))] : []; +}); + const mapStateToProps = (state, props) => { - const mentionedUsernamesWithDomains = state.getIn(['compose', 'text']).match(/(?:^|[^\/\w])@([a-z0-9_]+@[a-z0-9\.\-]+)/ig); + const mentionedUsernames = getMentionedUsernames(state); + const mentionedUsernamesWithDomains = getMentionedDomains(state); return { text: state.getIn(['compose', 'text']), suggestion_token: state.getIn(['compose', 'suggestion_token']), suggestions: state.getIn(['compose', 'suggestions']), - sensitive: state.getIn(['compose', 'sensitive']), spoiler: state.getIn(['compose', 'spoiler']), spoiler_text: state.getIn(['compose', 'spoiler_text']), unlisted: state.getIn(['compose', 'unlisted'], ), @@ -30,10 +33,9 @@ const mapStateToProps = (state, props) => { preselectDate: state.getIn(['compose', 'preselectDate']), is_submitting: state.getIn(['compose', 'is_submitting']), is_uploading: state.getIn(['compose', 'is_uploading']), - media_count: state.getIn(['compose', 'media_attachments']).size, me: state.getIn(['compose', 'me']), - needsPrivacyWarning: state.getIn(['compose', 'private']) && mentionedUsernamesWithDomains !== null, - mentionedDomains: mentionedUsernamesWithDomains !== null ? [...new Set(mentionedUsernamesWithDomains.map(item => item.split('@')[2]))] : [] + needsPrivacyWarning: state.getIn(['compose', 'private']) && mentionedUsernames !== null, + mentionedDomains: mentionedUsernamesWithDomains }; }; @@ -59,22 +61,10 @@ const mapDispatchToProps = (dispatch) => ({ dispatch(selectComposeSuggestion(position, token, accountId)); }, - onChangeSensitivity (checked) { - dispatch(changeComposeSensitivity(checked)); - }, - - onChangeSpoilerness (checked) { - dispatch(changeComposeSpoilerness(checked)); - }, - onChangeSpoilerText (checked) { dispatch(changeComposeSpoilerText(checked)); }, - onChangeVisibility (checked) { - dispatch(changeComposeVisibility(checked)); - }, - }); export default connect(mapStateToProps, mapDispatchToProps)(ComposeForm); diff --git a/app/assets/javascripts/components/features/compose/containers/private_toggle_container.jsx b/app/assets/javascripts/components/features/compose/containers/private_toggle_container.jsx new file mode 100644 index 000000000..ee3596902 --- /dev/null +++ b/app/assets/javascripts/components/features/compose/containers/private_toggle_container.jsx @@ -0,0 +1,17 @@ +import { connect } from 'react-redux'; +import PrivateToggle from '../components/private_toggle'; +import { changeComposeVisibility } from '../../../actions/compose'; + +const mapStateToProps = state => ({ + isPrivate: state.getIn(['compose', 'private']) +}); + +const mapDispatchToProps = dispatch => ({ + + onChange (e) { + dispatch(changeComposeVisibility(e.target.checked)); + } + +}); + +export default connect(mapStateToProps, mapDispatchToProps)(PrivateToggle); diff --git a/app/assets/javascripts/components/features/compose/containers/sensitive_toggle_container.jsx b/app/assets/javascripts/components/features/compose/containers/sensitive_toggle_container.jsx new file mode 100644 index 000000000..97b3361ba --- /dev/null +++ b/app/assets/javascripts/components/features/compose/containers/sensitive_toggle_container.jsx @@ -0,0 +1,18 @@ +import { connect } from 'react-redux'; +import SensitiveToggle from '../components/sensitive_toggle'; +import { changeComposeSensitivity } from '../../../actions/compose'; + +const mapStateToProps = state => ({ + hasMedia: state.getIn(['compose', 'media_attachments']).size > 0, + isSensitive: state.getIn(['compose', 'sensitive']) +}); + +const mapDispatchToProps = dispatch => ({ + + onChange (e) { + dispatch(changeComposeSensitivity(e.target.checked)); + } + +}); + +export default connect(mapStateToProps, mapDispatchToProps)(SensitiveToggle); diff --git a/app/assets/javascripts/components/features/compose/containers/spoiler_toggle_container.jsx b/app/assets/javascripts/components/features/compose/containers/spoiler_toggle_container.jsx new file mode 100644 index 000000000..0bd4df759 --- /dev/null +++ b/app/assets/javascripts/components/features/compose/containers/spoiler_toggle_container.jsx @@ -0,0 +1,17 @@ +import { connect } from 'react-redux'; +import SpoilerToggle from '../components/spoiler_toggle'; +import { changeComposeSpoilerness } from '../../../actions/compose'; + +const mapStateToProps = state => ({ + isSpoiler: state.getIn(['compose', 'spoiler']) +}); + +const mapDispatchToProps = dispatch => ({ + + onChange (e) { + dispatch(changeComposeSpoilerness(e.target.checked)); + } + +}); + +export default connect(mapStateToProps, mapDispatchToProps)(SpoilerToggle); |