Make secondary toot button work nicer with file attachments & revert to the original behavior if it's disabled

lolsob-rspec
Ondřej Hruška 2017-09-23 23:38:24 +02:00
parent b65e03fd0f
commit 3b79104d29
3 changed files with 29 additions and 17 deletions

View File

@ -58,6 +58,7 @@ export default class ComposeForm extends ImmutablePureComponent {
onPickEmoji: PropTypes.func.isRequired, onPickEmoji: PropTypes.func.isRequired,
showSearch: PropTypes.bool, showSearch: PropTypes.bool,
settings : ImmutablePropTypes.map.isRequired, settings : ImmutablePropTypes.map.isRequired,
filesAttached : PropTypes.bool,
}; };
static defaultProps = { static defaultProps = {
@ -159,13 +160,14 @@ export default class ComposeForm extends ImmutablePureComponent {
} }
render () { render () {
const { intl, onPaste, showSearch } = this.props; const { intl, onPaste, showSearch, filesAttached } = this.props;
const disabled = this.props.is_submitting; const disabled = this.props.is_submitting;
const maybeEye = (this.props.advanced_options && this.props.advanced_options.do_not_federate) ? ' 👁️' : ''; const maybeEye = (this.props.advanced_options && this.props.advanced_options.do_not_federate) ? ' 👁️' : '';
const text = [this.props.spoiler_text, countableText(this.props.text), maybeEye].join(''); const text = [this.props.spoiler_text, countableText(this.props.text), maybeEye].join('');
const sideArmVisibility = this.props.settings.get('side_arm'); const secondaryVisibility = this.props.settings.get('side_arm');
let showSideArm = sideArmVisibility !== 'none'; const isWideView = this.props.settings.get('stretch');
let showSideArm = secondaryVisibility !== 'none';
let publishText = ''; let publishText = '';
@ -177,25 +179,35 @@ export default class ComposeForm extends ImmutablePureComponent {
direct: 'envelope', direct: 'envelope',
}; };
if (showSideArm) {
publishText = ( publishText = (
<span> <span>
{ {
(this.props.settings.get('stretch') || !showSideArm) ?
<i <i
className={`fa fa-${privacyIcons[this.props.privacy]}`} className={`fa fa-${privacyIcons[this.props.privacy]}`}
style={{ paddingRight: '5px' }} style={{
/> : paddingRight: (filesAttached || !isWideView) ? '0' : '5px',
'' }}
/>
}{
(filesAttached || !isWideView) ? '' :
intl.formatMessage(messages.publish)
} }
{intl.formatMessage(messages.publish)}
</span> </span>
); );
} else {
if (this.props.privacy === 'private' || this.props.privacy === 'direct') {
publishText = <span className='compose-form__publish-private'><i className='fa fa-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);
}
}
// side-arm // side-arm
let publishText2 = ( let publishText2 = (
<i <i
className={`fa fa-${privacyIcons[sideArmVisibility]}`} className={`fa fa-${privacyIcons[secondaryVisibility]}`}
aria-label={`${intl.formatMessage(messages.publish)}: ${intl.formatMessage({ id: `privacy.${sideArmVisibility}.short` })}`} aria-label={`${intl.formatMessage(messages.publish)}: ${intl.formatMessage({ id: `privacy.${secondaryVisibility}.short` })}`}
/> />
); );

View File

@ -26,6 +26,7 @@ const mapStateToProps = state => ({
me: state.getIn(['compose', 'me']), me: state.getIn(['compose', 'me']),
showSearch: state.getIn(['search', 'submitted']) && !state.getIn(['search', 'hidden']), showSearch: state.getIn(['search', 'submitted']) && !state.getIn(['search', 'hidden']),
settings: state.get('local_settings'), settings: state.get('local_settings'),
filesAttached: state.getIn(['compose', 'media_attachments']).size > 0,
}); });
const mapDispatchToProps = (dispatch) => ({ const mapDispatchToProps = (dispatch) => ({

View File

@ -433,7 +433,6 @@
padding: 0 !important; padding: 0 !important;
width: 4em; width: 4em;
text-align: center; text-align: center;
opacity: .8;
margin-right: 2px; margin-right: 2px;
} }