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 166c5fdcedb14089373db51d84a1395715683f91..9edc01ed769f67520feaea20b6a9b1fcfc3cb2d0 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 = <ReplyIndicator status={this.props.in_reply_to} onCancel={this.props.onCancelReply} />;
}
- let reply_to_other = !!this.props.in_reply_to && (this.props.in_reply_to.getIn(['account', 'id']) !== this.props.me);
+ if (needsPrivacyWarning) {
+ privacyWarning = (
+ <div className='compose-form__warning'>
+ <FormattedMessage
+ id='compose_form.privacy_disclaimer'
+ defaultMessage='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?'
+ values={{ domains: <strong>{mentionedDomains.join(', ')}</strong>, domainsCount: mentionedDomains.length }}
+ />
+ </div>
+ );
+ }
if (this.props.private) {
publishText = <span><i className='fa fa-lock' /> {intl.formatMessage(messages.publish)}</span>;
@@ -142,6 +157,7 @@ const ComposeForm = React.createClass({
</div>
</Collapsable>
+ {privacyWarning}
{replyArea}
<AutosuggestTextarea
@@ -173,13 +189,6 @@ const ComposeForm = React.createClass({
<Toggle checked={this.props.private} onChange={this.handleChangeVisibility} />
<span className='compose-form__label__text'><FormattedMessage id='compose_form.private' defaultMessage='Mark as private' /></span>
</label>
-
- <Motion defaultStyle={{ opacity: 0, height: 0 }}, style={{ opacity: spring((this.props.private || reply_to_other) ? 0 : 100), height: spring((this.props.private || reply_to_other) ? 0 : 39.5) }}>
- <label className='compose-form__label' style={{ height: `${height}px`, overflow: 'hidden', opacity: opacity / 100 }}>
- <span className='compose-form__label__text'><FormattedMessage id='compose_form.privacy_disclaimer' defaultMessage='Warning: Private posts are not encrypted, and could be read or boosted by instances or people who do not respect post privacy. This is not true privacy. Do not post senstive information.' /></span>
- </label>
- }
- </Motion>
<Collapsable isVisible={!(this.props.private || reply_to_other)} fullHeight={39.5}>
<label className='compose-form__label'>
diff --git a/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx b/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx
index c027875cdc75346c95a9b8420ec577807888750b..2671ea618b0900275a821a0e9749158247b827db 100644
--- a/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx
+++ b/app/assets/javascripts/components/features/compose/containers/compose_form_container.jsx
@@ -19,6 +19,8 @@ const makeMapStateToProps = () => {
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 d1357227e52cf96c35b4d17e747b9bf328515cb1..95962fd7381483be2708588a4dfe37f944c427e4 100644
--- a/app/assets/javascripts/components/locales/en.jsx
+++ b/app/assets/javascripts/components/locales/en.jsx
@@ -41,7 +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": "Warning: Private posts are not encrypted, and could be read or boosted by instances or people who do not respect post privacy. This is not true privacy. Do not post senstive information."
+ "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 f0948b0f39a9186add61e723cdfb8999211e77bd..247ea3132e92d799ede1e796d4c7ccb80b77a4d5 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;