mastofe

commit: bb85043f4641adbb4c9589ccd2bd93c9cdd06ce8
parent: e1fcad34a9e3c3fd22b3bee66b82d85bd03629fb
Author: Yamagishi Kazutoshi <ykzts@desire.sh>
Date:   Mon, 31 Jul 2017 12:06:56 +0900

Disable sensitive button when with content warnings (#4460)


Diffstat:
M
app/javascript/mastodon/features/compose/containers/sensitive_button_container.js
5
++++-
M
app/javascript/mastodon/reducers/compose.js
10
+++++++---
M
app/javascript/styles/components.scss
10
+++++++---

3 files changed, 18 insertions(+), 7 deletions(-)
diff --git a/app/javascript/mastodon/features/compose/containers/sensitive_button_container.js b/app/javascript/mastodon/features/compose/containers/sensitive_button_container.js
@@ -15,6 +15,7 @@ const messages = defineMessages({
 const mapStateToProps = state => ({
   visible: state.getIn(['compose', 'media_attachments']).size > 0,
   active: state.getIn(['compose', 'sensitive']),
+  disabled: state.getIn(['compose', 'spoiler']),
 });
 
 const mapDispatchToProps = dispatch => ({
@@ -30,12 +31,13 @@ class SensitiveButton extends React.PureComponent {
   static propTypes = {
     visible: PropTypes.bool,
     active: PropTypes.bool,
+    disabled: PropTypes.bool,
     onClick: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,
   };
 
   render () {
-    const { visible, active, onClick, intl } = this.props;
+    const { visible, active, disabled, onClick, intl } = this.props;
 
     return (
       <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}
                 size={18}
                 active={active}
+                disabled={disabled}
                 style={{ lineHeight: null, height: null }}
                 inverted
               />
diff --git a/app/javascript/mastodon/reducers/compose.js b/app/javascript/mastodon/reducers/compose.js
@@ -152,9 +152,13 @@ export default function compose(state = initialState, action) {
       .set('mounted', false)
       .set('is_composing', false);
   case COMPOSE_SENSITIVITY_CHANGE:
-    return state
-      .set('sensitive', !state.get('sensitive'))
-      .set('idempotencyKey', uuid());
+    return state.withMutations(map => {
+      if (!state.get('spoiler')) {
+        map.set('sensitive', !state.get('sensitive'));
+      }
+
+      map.set('idempotencyKey', uuid());
+    });
   case COMPOSE_SPOILERNESS_CHANGE:
     return state.withMutations(map => {
       map.set('spoiler_text', '');
diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss
@@ -148,12 +148,16 @@
       color: $ui-base-lighter-color;
     }
 
+    &.disabled {
+      color: $ui-primary-color;
+    }
+
     &.active {
       color: $ui-highlight-color;
-    }
 
-    &.disabled {
-      color: $ui-primary-color;
+      &.disabled {
+        color: lighten($ui-highlight-color, 13%);
+      }
     }
   }