mirror of
https://github.com/mastodon/mastodon.git
synced 2024-08-20 21:08:15 -07:00
Disable sensitive button when with content warnings (#4460)
This commit is contained in:
parent
e1fcad34a9
commit
bb85043f46
3 changed files with 19 additions and 8 deletions
|
@ -15,6 +15,7 @@ const messages = defineMessages({
|
||||||
const mapStateToProps = state => ({
|
const mapStateToProps = state => ({
|
||||||
visible: state.getIn(['compose', 'media_attachments']).size > 0,
|
visible: state.getIn(['compose', 'media_attachments']).size > 0,
|
||||||
active: state.getIn(['compose', 'sensitive']),
|
active: state.getIn(['compose', 'sensitive']),
|
||||||
|
disabled: state.getIn(['compose', 'spoiler']),
|
||||||
});
|
});
|
||||||
|
|
||||||
const mapDispatchToProps = dispatch => ({
|
const mapDispatchToProps = dispatch => ({
|
||||||
|
@ -30,12 +31,13 @@ class SensitiveButton extends React.PureComponent {
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
visible: PropTypes.bool,
|
visible: PropTypes.bool,
|
||||||
active: PropTypes.bool,
|
active: PropTypes.bool,
|
||||||
|
disabled: PropTypes.bool,
|
||||||
onClick: PropTypes.func.isRequired,
|
onClick: PropTypes.func.isRequired,
|
||||||
intl: PropTypes.object.isRequired,
|
intl: PropTypes.object.isRequired,
|
||||||
};
|
};
|
||||||
|
|
||||||
render () {
|
render () {
|
||||||
const { visible, active, onClick, intl } = this.props;
|
const { visible, active, disabled, onClick, intl } = this.props;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Motion defaultStyle={{ scale: 0.87 }} style={{ scale: spring(visible ? 1 : 0.87, { stiffness: 200, damping: 3 }) }}>
|
<Motion defaultStyle={{ scale: 0.87 }} style={{ scale: spring(visible ? 1 : 0.87, { stiffness: 200, damping: 3 }) }}>
|
||||||
|
@ -53,6 +55,7 @@ class SensitiveButton extends React.PureComponent {
|
||||||
onClick={onClick}
|
onClick={onClick}
|
||||||
size={18}
|
size={18}
|
||||||
active={active}
|
active={active}
|
||||||
|
disabled={disabled}
|
||||||
style={{ lineHeight: null, height: null }}
|
style={{ lineHeight: null, height: null }}
|
||||||
inverted
|
inverted
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -152,9 +152,13 @@ export default function compose(state = initialState, action) {
|
||||||
.set('mounted', false)
|
.set('mounted', false)
|
||||||
.set('is_composing', false);
|
.set('is_composing', false);
|
||||||
case COMPOSE_SENSITIVITY_CHANGE:
|
case COMPOSE_SENSITIVITY_CHANGE:
|
||||||
return state
|
return state.withMutations(map => {
|
||||||
.set('sensitive', !state.get('sensitive'))
|
if (!state.get('spoiler')) {
|
||||||
.set('idempotencyKey', uuid());
|
map.set('sensitive', !state.get('sensitive'));
|
||||||
|
}
|
||||||
|
|
||||||
|
map.set('idempotencyKey', uuid());
|
||||||
|
});
|
||||||
case COMPOSE_SPOILERNESS_CHANGE:
|
case COMPOSE_SPOILERNESS_CHANGE:
|
||||||
return state.withMutations(map => {
|
return state.withMutations(map => {
|
||||||
map.set('spoiler_text', '');
|
map.set('spoiler_text', '');
|
||||||
|
|
|
@ -148,13 +148,17 @@
|
||||||
color: $ui-base-lighter-color;
|
color: $ui-base-lighter-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.active {
|
|
||||||
color: $ui-highlight-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.disabled {
|
&.disabled {
|
||||||
color: $ui-primary-color;
|
color: $ui-primary-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
color: $ui-highlight-color;
|
||||||
|
|
||||||
|
&.disabled {
|
||||||
|
color: lighten($ui-highlight-color, 13%);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.overlayed {
|
&.overlayed {
|
||||||
|
|
Loading…
Reference in a new issue