)}
+
+ {!mediaIds.isEmpty() && }
);
}
diff --git a/app/javascript/flavours/glitch/features/compose/containers/options_container.js b/app/javascript/flavours/glitch/features/compose/containers/options_container.js
index e846cfbd5f..2ac7ab8d8d 100644
--- a/app/javascript/flavours/glitch/features/compose/containers/options_container.js
+++ b/app/javascript/flavours/glitch/features/compose/containers/options_container.js
@@ -2,7 +2,6 @@ import { connect } from 'react-redux';
import Options from '../components/options';
import {
changeComposeAdvancedOption,
- changeComposeSensitivity,
} from 'flavours/glitch/actions/compose';
import { addPoll, removePoll } from 'flavours/glitch/actions/compose';
import { closeModal, openModal } from 'flavours/glitch/actions/modal';
@@ -27,10 +26,6 @@ const mapDispatchToProps = (dispatch) => ({
dispatch(changeComposeAdvancedOption(option, value));
},
- onChangeSensitivity() {
- dispatch(changeComposeSensitivity());
- },
-
onTogglePoll() {
dispatch((_, getState) => {
if (getState().getIn(['compose', 'poll'])) {
diff --git a/app/javascript/flavours/glitch/features/compose/containers/sensitive_button_container.js b/app/javascript/flavours/glitch/features/compose/containers/sensitive_button_container.js
new file mode 100644
index 0000000000..8f163979f8
--- /dev/null
+++ b/app/javascript/flavours/glitch/features/compose/containers/sensitive_button_container.js
@@ -0,0 +1,54 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import { changeComposeSensitivity } from 'flavours/glitch/actions/compose';
+import { injectIntl, defineMessages, FormattedMessage } from 'react-intl';
+import Icon from 'flavours/glitch/components/icon';
+
+const messages = defineMessages({
+ marked: { id: 'compose_form.sensitive.marked', defaultMessage: 'Media is marked as sensitive' },
+ unmarked: { id: 'compose_form.sensitive.unmarked', defaultMessage: 'Media is not marked as sensitive' },
+});
+
+const mapStateToProps = state => {
+ const spoilersAlwaysOn = state.getIn(['local_settings', 'always_show_spoilers_field']);
+ const spoilerText = state.getIn(['compose', 'spoiler_text']);
+ return {
+ active: state.getIn(['compose', 'sensitive']) || (spoilersAlwaysOn && spoilerText && spoilerText.length > 0),
+ disabled: state.getIn(['compose', 'spoiler']),
+ };
+};
+
+const mapDispatchToProps = dispatch => ({
+
+ onClick () {
+ dispatch(changeComposeSensitivity());
+ },
+
+});
+
+class SensitiveButton extends React.PureComponent {
+
+ static propTypes = {
+ active: PropTypes.bool,
+ disabled: PropTypes.bool,
+ onClick: PropTypes.func.isRequired,
+ intl: PropTypes.object.isRequired,
+ };
+
+ render () {
+ const { active, disabled, onClick, intl } = this.props;
+
+ return (
+
+
+
+ );
+ }
+
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(injectIntl(SensitiveButton));
diff --git a/app/javascript/flavours/glitch/features/video/index.js b/app/javascript/flavours/glitch/features/video/index.js
index 3814858024..8291ff3c81 100644
--- a/app/javascript/flavours/glitch/features/video/index.js
+++ b/app/javascript/flavours/glitch/features/video/index.js
@@ -500,7 +500,7 @@ export default class Video extends React.PureComponent {
- {!onCloseVideo && }
+ {!onCloseVideo && }
{(!fullscreen && onOpenVideo) && }
{onCloseVideo && }
diff --git a/app/javascript/flavours/glitch/styles/components/composer.scss b/app/javascript/flavours/glitch/styles/components/composer.scss
index e5eb6e64fe..81c700737e 100644
--- a/app/javascript/flavours/glitch/styles/components/composer.scss
+++ b/app/javascript/flavours/glitch/styles/components/composer.scss
@@ -57,6 +57,11 @@
}
}
+.compose-form__sensitive-button {
+ padding: 10px;
+ padding-top: 0;
+}
+
.composer--reply {
margin: 0 0 10px;
border-radius: 4px;