diff --git a/app/assets/javascripts/components/features/compose/components/compose_form.jsx b/app/assets/javascripts/components/features/compose/components/compose_form.jsx
index 273ebd83f3d..9edc01ed769 100644
--- a/app/assets/javascripts/components/features/compose/components/compose_form.jsx
+++ b/app/assets/javascripts/components/features/compose/components/compose_form.jsx
@@ -36,6 +36,8 @@ const ComposeForm = React.createClass({
in_reply_to: ImmutablePropTypes.map,
media_count: React.PropTypes.number,
me: React.PropTypes.number,
+ needsPrivacyWarning: React.PropTypes.bool,
+ mentionedDomains: React.PropTypes.array.isRequired,
onChange: React.PropTypes.func.isRequired,
onSubmit: React.PropTypes.func.isRequired,
onCancelReply: React.PropTypes.func.isRequired,
@@ -117,16 +119,29 @@ const ComposeForm = React.createClass({
},
render () {
- const { intl } = this.props;
- let replyArea = '';
- let publishText = '';
- const disabled = this.props.is_submitting || this.props.is_uploading;
+ const { intl, needsPrivacyWarning, mentionedDomains } = this.props;
+ const disabled = this.props.is_submitting || this.props.is_uploading;
+
+ let replyArea = '';
+ let publishText = '';
+ let privacyWarning = '';
+ let reply_to_other = !!this.props.in_reply_to && (this.props.in_reply_to.getIn(['account', 'id']) !== this.props.me);
if (this.props.in_reply_to) {
replyArea = ;
}
- let reply_to_other = !!this.props.in_reply_to && (this.props.in_reply_to.getIn(['account', 'id']) !== this.props.me);
+ if (needsPrivacyWarning) {
+ privacyWarning = (
+
+ {mentionedDomains.join(', ')}, domainsCount: mentionedDomains.length }}
+ />
+
+ );
+ }
if (this.props.private) {
publishText = {intl.formatMessage(messages.publish)};
@@ -142,6 +157,7 @@ const ComposeForm = React.createClass({
+ {privacyWarning}
{replyArea}
{
const getStatus = makeGetStatus();
const mapStateToProps = function (state, props) {
+ const mentionedUsernamesWithDomains = state.getIn(['compose', 'text']).match(/(?:^|[^\/\w])@([a-z0-9_]+@[a-z0-9\.\-]+)/ig);
+
return {
text: state.getIn(['compose', 'text']),
suggestion_token: state.getIn(['compose', 'suggestion_token']),
@@ -34,6 +36,8 @@ const makeMapStateToProps = () => {
in_reply_to: getStatus(state, state.getIn(['compose', 'in_reply_to'])),
media_count: state.getIn(['compose', 'media_attachments']).size,
me: state.getIn(['compose', 'me']),
+ needsPrivacyWarning: state.getIn(['compose', 'private']) && mentionedUsernamesWithDomains !== null,
+ mentionedDomains: mentionedUsernamesWithDomains !== null ? [...new Set(mentionedUsernamesWithDomains.map(item => item.split('@')[2]))] : []
};
};
diff --git a/app/assets/javascripts/components/locales/en.jsx b/app/assets/javascripts/components/locales/en.jsx
index ac1c1a7d53e..95962fd7381 100644
--- a/app/assets/javascripts/components/locales/en.jsx
+++ b/app/assets/javascripts/components/locales/en.jsx
@@ -41,6 +41,7 @@ const en = {
"compose_form.sensitive": "Mark media as sensitive",
"compose_form.spoiler": "Hide text behind warning",
"compose_form.private": "Mark as private",
+ "compose_form.privacy_disclaimer": "Your private status will be delivered to mentioned users on {domains}. Do you trust {domainsCount, plural, one {that server} other {those servers}} to not leak your status?",
"compose_form.unlisted": "Do not display in public timeline",
"navigation_bar.edit_profile": "Edit profile",
"navigation_bar.preferences": "Preferences",
diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss
index f0948b0f39a..247ea3132e9 100644
--- a/app/assets/stylesheets/components.scss
+++ b/app/assets/stylesheets/components.scss
@@ -78,6 +78,21 @@
color: $color1;
}
+.compose-form__warning {
+ color: $color2;
+ margin-bottom: 15px;
+ border: 1px solid $color3;
+ padding: 8px 10px;
+ border-radius: 4px;
+ font-size: 12px;
+ font-weight: 400;
+
+ strong {
+ color: $color5;
+ font-weight: 500;
+ }
+}
+
.compose-form__label {
display: block;
line-height: 24px;