diff options
-rw-r--r-- | webapp/components/post_view/post_body/post_body.jsx | 1 | ||||
-rw-r--r-- | webapp/components/post_view/post_info/post_info.jsx | 18 | ||||
-rw-r--r-- | webapp/components/post_view/post_message_view/post_message_view.jsx | 15 | ||||
-rw-r--r-- | webapp/components/rhs_comment.jsx | 11 | ||||
-rwxr-xr-x | webapp/i18n/en.json | 2 | ||||
-rw-r--r-- | webapp/sass/layout/_post.scss | 6 |
6 files changed, 51 insertions, 2 deletions
diff --git a/webapp/components/post_view/post_body/post_body.jsx b/webapp/components/post_view/post_body/post_body.jsx index 4c0e00c47..2f8f86d82 100644 --- a/webapp/components/post_view/post_body/post_body.jsx +++ b/webapp/components/post_view/post_body/post_body.jsx @@ -162,6 +162,7 @@ export default class PostBody extends React.PureComponent { <PostMessageView lastPostCount={this.props.lastPostCount} post={this.props.post} + compactDisplay={this.props.compactDisplay} /> </div> ); diff --git a/webapp/components/post_view/post_info/post_info.jsx b/webapp/components/post_view/post_info/post_info.jsx index 6eaef0e0b..71f73b631 100644 --- a/webapp/components/post_view/post_info/post_info.jsx +++ b/webapp/components/post_view/post_info/post_info.jsx @@ -55,6 +55,11 @@ export default class PostInfo extends React.PureComponent { lastPostCount: PropTypes.number, /** + * Set to render in compact view + */ + compactDisplay: PropTypes.bool, + + /** * Function to get the post list HTML element */ getPostList: PropTypes.func.isRequired, @@ -208,6 +213,18 @@ export default class PostInfo extends React.PureComponent { } } + let visibleMessage; + if (isEphemeral && !this.props.compactDisplay) { + visibleMessage = ( + <span className='post__visibility'> + <FormattedMessage + id='post_info.message.visible' + defaultMessage='(Only visible to you)' + /> + </span> + ); + } + let pinnedBadge; if (post.is_pinned) { pinnedBadge = ( @@ -237,6 +254,7 @@ export default class PostInfo extends React.PureComponent { isFlagged={this.props.isFlagged} isEphemeral={isEphemeral} /> + {visibleMessage} </div> {options} </div> diff --git a/webapp/components/post_view/post_message_view/post_message_view.jsx b/webapp/components/post_view/post_message_view/post_message_view.jsx index 76037741f..1c6035df9 100644 --- a/webapp/components/post_view/post_message_view/post_message_view.jsx +++ b/webapp/components/post_view/post_message_view/post_message_view.jsx @@ -61,7 +61,12 @@ export default class PostMessageView extends React.PureComponent { /* * Post identifiers for selenium tests */ - lastPostCount: PropTypes.number + lastPostCount: PropTypes.number, + + /** + * Set to render post body compactly + */ + compactDisplay: PropTypes.bool }; static defaultProps = { @@ -167,7 +172,13 @@ export default class PostMessageView extends React.PureComponent { postId = Utils.createSafeId('lastPostMessageText' + this.props.lastPostCount); } - const htmlFormattedText = TextFormatting.formatText(this.props.post.message, options); + let message = this.props.post.message; + const isEphemeral = Utils.isPostEphemeral(this.props.post); + if (this.props.compactDisplay && isEphemeral) { + const visibleMessage = Utils.localizeMessage('post_info.message.visible.compact', ' (Only visible to you)'); + message = message.concat(visibleMessage); + } + const htmlFormattedText = TextFormatting.formatText(message, options); const postMessageComponent = this.postMessageHtmlToComponent(htmlFormattedText); return ( diff --git a/webapp/components/rhs_comment.jsx b/webapp/components/rhs_comment.jsx index 6592c487d..3813fe5a0 100644 --- a/webapp/components/rhs_comment.jsx +++ b/webapp/components/rhs_comment.jsx @@ -226,6 +226,7 @@ export default class RhsComment extends React.Component { /> ); + let visibleMessage; if (post.props && post.props.from_webhook) { if (post.props.override_username && global.window.mm_config.EnablePostUsernameOverride === 'true') { userProfile = ( @@ -259,6 +260,15 @@ export default class RhsComment extends React.Component { disablePopover={true} /> ); + + visibleMessage = ( + <span className='post__visibility'> + <FormattedMessage + id='post_info.message.visible' + defaultMessage='(Only visible to you)' + /> + </span> + ); } let failedPostOptions; @@ -430,6 +440,7 @@ export default class RhsComment extends React.Component { isFlagged={this.props.isFlagged} isEphemeral={isEphemeral} /> + {visibleMessage} </div> {options} </div> diff --git a/webapp/i18n/en.json b/webapp/i18n/en.json index 34c6207b5..1ba02cfff 100755 --- a/webapp/i18n/en.json +++ b/webapp/i18n/en.json @@ -1903,6 +1903,8 @@ "post_delete.okay": "Okay", "post_delete.someone": "Someone deleted the message on which you tried to post a comment.", "post_focus_view.beginning": "Beginning of Channel Archives", + "post_info.message.visible": "(Only visible to you)", + "post_info.message.visible.compact": " (Only visible to you)", "post_info.del": "Delete", "post_info.edit": "Edit", "post_info.mobile.flag": "Flag", diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss index b227d818c..272d22479 100644 --- a/webapp/sass/layout/_post.scss +++ b/webapp/sass/layout/_post.scss @@ -1383,6 +1383,12 @@ } } + .post__visibility { + @include opacity(.6); + font-size: .9em; + padding: 8px; + } + .post__time { @include opacity(.6); font-size: .9em; |