diff options
author | Surinna Curtis <ekiru.0@gmail.com> | 2017-07-12 00:50:50 -0500 |
---|---|---|
committer | kibigo! <marrus-sh@users.noreply.github.com> | 2017-07-12 02:14:17 -0700 |
commit | e53fbb4a09ef0b53236840352f3a800b76b2f961 (patch) | |
tree | 0484e75c0b8e4e29638138dcf703773e177274e3 | |
parent | 79d898ae0ad8c0e66bd63ec3e0904e9e5e7894e8 (diff) |
local-only/compose advanced options tweaks.
Squashed commit of the following: commit b9877e37f72fdd8134936e1014033b07cb6c3671 Author: Surinna Curtis <ekiru.0@gmail.com> Date: Wed Jul 12 00:50:10 2017 -0500 account for the eye in the chars left count for local-only toots commit 56ebfa96542e16daa1986cc45e07974801ee12dc Author: Surinna Curtis <ekiru.0@gmail.com> Date: Wed Jul 12 00:21:02 2017 -0500 factor out an AdvancedOptionsToggle to avoid unnecessary re-renders commit 04cec44ab8744e4e0f52da488c9ec24b1b1422ef Author: Surinna Curtis <ekiru.0@gmail.com> Date: Wed Jul 12 00:20:24 2017 -0500 s/changeComposeAdvancedOption/toggleComposeAdvancedOption/g commit af5815dee750d1aa8b797a9305e5ab3ce6774e3f Author: Surinna Curtis <ekiru.0@gmail.com> Date: Tue Jul 11 23:55:19 2017 -0500 clicking anywhere on the whole advanced option toggles
5 files changed, 160 insertions, 18 deletions
diff --git a/app/javascript/glitch/components/compose/advanced_options.js b/app/javascript/glitch/components/compose/advanced_options.js index 0e72bd053..0d22f2546 100644 --- a/app/javascript/glitch/components/compose/advanced_options.js +++ b/app/javascript/glitch/components/compose/advanced_options.js @@ -19,6 +19,35 @@ const iconStyle = { lineHeight: '27px', }; +class AdvancedOptionToggle extends React.PureComponent { + static PropTypes = { + onChange: PropTypes.func.isRequired, + active: PropTypes.bool.isRequired, + key: PropTypes.string.isRequired, + shortText: PropTypes.string.isRequired, + longText: PropTypes.string.isRequired, + } + + onToggle = () => { + this.props.onChange(this.props.name); + } + + render() { + const { active, shortText, longText } = this.props; + return ( + <div role='button' className='advanced-options-dropdown__option' onClick={this.onToggle}> + <div className='advanced-options-dropdown__option__toggle'> + <Toggle checked={active} onChange={this.onToggle} /> + </div> + <div className='advanced-options-dropdown__option__content'> + <strong>{shortText}</strong> + {longText} + </div> + </div> + ); + } +} + @injectIntl export default class ComposeAdvancedOptions extends React.PureComponent { @@ -60,10 +89,6 @@ export default class ComposeAdvancedOptions extends React.PureComponent { this.props.onChange(option); } - toggleHandler(option) { - return () => this.props.onChange(option); - } - setRef = (c) => { this.node = c; } @@ -78,17 +103,15 @@ export default class ComposeAdvancedOptions extends React.PureComponent { const anyEnabled = values.some((enabled) => enabled); const optionElems = options.map((option) => { - const active = values.get(option.key); return ( - <div role='button' className='advanced-options-dropdown__option' key={option.key} > - <div className='advanced-options-dropdown__option__toggle'> - <Toggle checked={active} onChange={this.toggleHandler(option.key)} /> - </div> - <div className='advanced-options-dropdown__option__content'> - <strong>{intl.formatMessage(option.shortText)}</strong> - {intl.formatMessage(option.longText)} - </div> - </div> + <AdvancedOptionToggle + onChange={this.props.onChange} + active={values.get(option.key)} + key={option.key} + name={option.key} + shortText={intl.formatMessage(option.shortText)} + longText={intl.formatMessage(option.longText)} + /> ); }); diff --git a/app/javascript/glitch/containers/compose/advanced_options.js b/app/javascript/glitch/containers/compose/advanced_options.js index f8b7354ff..92b989052 100644 --- a/app/javascript/glitch/containers/compose/advanced_options.js +++ b/app/javascript/glitch/containers/compose/advanced_options.js @@ -2,7 +2,7 @@ import { connect } from 'react-redux'; // Mastodon imports // -import { changeComposeAdvancedOption } from '../../../mastodon/actions/compose'; +import { toggleComposeAdvancedOption } from '../../../mastodon/actions/compose'; // Our imports // import ComposeAdvancedOptions from '../../components/compose/advanced_options'; @@ -14,7 +14,7 @@ const mapStateToProps = state => ({ const mapDispatchToProps = dispatch => ({ onChange (option) { - dispatch(changeComposeAdvancedOption(option)); + dispatch(toggleComposeAdvancedOption(option)); }, }); diff --git a/app/javascript/mastodon/actions/compose.js b/app/javascript/mastodon/actions/compose.js index f00b213f0..bce836b45 100644 --- a/app/javascript/mastodon/actions/compose.js +++ b/app/javascript/mastodon/actions/compose.js @@ -248,7 +248,7 @@ export function unmountCompose() { }; }; -export function changeComposeAdvancedOption(option) { +export function toggleComposeAdvancedOption(option) { return { type: COMPOSE_ADVANCED_OPTIONS_CHANGE, option: option, diff --git a/app/javascript/mastodon/features/compose/components/compose_form.js b/app/javascript/mastodon/features/compose/components/compose_form.js index 313635443..4b14f8c81 100644 --- a/app/javascript/mastodon/features/compose/components/compose_form.js +++ b/app/javascript/mastodon/features/compose/components/compose_form.js @@ -147,7 +147,8 @@ export default class ComposeForm extends ImmutablePureComponent { render () { const { intl, onPaste, showSearch } = this.props; const disabled = this.props.is_submitting; - const text = [this.props.spoiler_text, this.props.text].join(''); + const maybeEye = this.props.advanced_options.get('do_not_federate') ? ' 👁️' : ''; + const text = [this.props.spoiler_text, this.props.text, maybeEye].join(''); let publishText = ''; diff --git a/app/javascript/mastodon/features/ui/util/async-components.js b/app/javascript/mastodon/features/ui/util/async-components.js new file mode 100644 index 000000000..8c9b1bd97 --- /dev/null +++ b/app/javascript/mastodon/features/ui/util/async-components.js @@ -0,0 +1,118 @@ +export function EmojiPicker () { + return import(/* webpackChunkName: "emojione_picker" */'emojione-picker'); +} + +export function Compose () { + return import(/* webpackChunkName: "features/compose" */'../../compose'); +} + +export function Notifications () { + return import(/* webpackChunkName: "features/notifications" */'../../notifications'); +} + +export function HomeTimeline () { + return import(/* webpackChunkName: "features/home_timeline" */'../../home_timeline'); +} + +export function PublicTimeline () { + return import(/* webpackChunkName: "features/public_timeline" */'../../public_timeline'); +} + +export function CommunityTimeline () { + return import(/* webpackChunkName: "features/community_timeline" */'../../community_timeline'); +} + +export function HashtagTimeline () { + return import(/* webpackChunkName: "features/hashtag_timeline" */'../../hashtag_timeline'); +} + +export function Status () { + return import(/* webpackChunkName: "features/status" */'../../status'); +} + +export function GettingStarted () { + return import(/* webpackChunkName: "features/getting_started" */'../../getting_started'); +} + +export function AccountTimeline () { + return import(/* webpackChunkName: "features/account_timeline" */'../../account_timeline'); +} + +export function AccountGallery () { + return import(/* webpackChunkName: "features/account_gallery" */'../../account_gallery'); +} + +export function Followers () { + return import(/* webpackChunkName: "features/followers" */'../../followers'); +} + +export function Following () { + return import(/* webpackChunkName: "features/following" */'../../following'); +} + +export function Reblogs () { + return import(/* webpackChunkName: "features/reblogs" */'../../reblogs'); +} + +export function Favourites () { + return import(/* webpackChunkName: "features/favourites" */'../../favourites'); +} + +export function FollowRequests () { + return import(/* webpackChunkName: "features/follow_requests" */'../../follow_requests'); +} + +export function GenericNotFound () { + return import(/* webpackChunkName: "features/generic_not_found" */'../../generic_not_found'); +} + +export function FavouritedStatuses () { + return import(/* webpackChunkName: "features/favourited_statuses" */'../../favourited_statuses'); +} + +export function Blocks () { + return import(/* webpackChunkName: "features/blocks" */'../../blocks'); +} + +export function Mutes () { + return import(/* webpackChunkName: "features/mutes" */'../../mutes'); +} + +export function MediaModal () { + return import(/* webpackChunkName: "modals/media_modal" */'../components/media_modal'); +} + +export function OnboardingModal () { + return import(/* webpackChunkName: "modals/onboarding_modal" */'../components/onboarding_modal'); +} + +export function VideoModal () { + return import(/* webpackChunkName: "modals/video_modal" */'../components/video_modal'); +} + +export function BoostModal () { + return import(/* webpackChunkName: "modals/boost_modal" */'../components/boost_modal'); +} + +export function ConfirmationModal () { + return import(/* webpackChunkName: "modals/confirmation_modal" */'../components/confirmation_modal'); +} + +export function ReportModal () { + return import(/* webpackChunkName: "modals/report_modal" */'../components/report_modal'); +} + +export function SettingsModal () { + return import(/* webpackChunkName: "modals/settings_modal" */'../../../../glitch/containers/settings'); +} + +// THESE AREN'T USED BY US; SEE `glitch/components/status` AND `mastodon/features/status`. // +// HOWEVER, IF MASTODON EVER CHANGES DETAILED STATUSES SO THAT THEY NEED THEM, WE'LL NEED TO UPDATE THE URLS OR SOMETHING LOL. // + +export function MediaGallery () { + return import(/* webpackChunkName: "status/MediaGallery" */'../../../components/media_gallery'); +} + +export function VideoPlayer () { + return import(/* webpackChunkName: "status/VideoPlayer" */'../../../components/video_player'); +} |