-
Notifications
You must be signed in to change notification settings - Fork 22
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
- Display a clear message when content is flagged as SPAM because the user was blocked in a Tipline. - Implement the logic in a new component: ContentWarningMessage. - Add unit tests for the new component - Clean up some warnings in existing unit tests. - Clean up eslint-disable react/sort-prop-types in the component Reference: CV2-5142
- Loading branch information
1 parent
70058cd
commit 18b67cd
Showing
8 changed files
with
176 additions
and
72 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
37 changes: 37 additions & 0 deletions
37
localization/react-intl/src/app/components/layout/ContentWarningMessage.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| [ | ||
| { | ||
| "id": "contentScreen.adult", | ||
| "description": "Content warning type: Adult", | ||
| "defaultMessage": "Adult" | ||
| }, | ||
| { | ||
| "id": "contentScreen.medical", | ||
| "description": "Content warning type: Medical", | ||
| "defaultMessage": "Medical" | ||
| }, | ||
| { | ||
| "id": "contentScreen.spam", | ||
| "description": "Content warning type: Spam", | ||
| "defaultMessage": "Spam" | ||
| }, | ||
| { | ||
| "id": "contentScreen.violence", | ||
| "description": "Content warning type: Violence", | ||
| "defaultMessage": "Violence" | ||
| }, | ||
| { | ||
| "id": "contentScreen.warningByAutomationRule", | ||
| "description": "Content warning displayed over sensitive content detected by an automation rule", | ||
| "defaultMessage": "An automation rule has detected this content as sensitive" | ||
| }, | ||
| { | ||
| "id": "contentScreen.warningBySmoochBot", | ||
| "description": "Content warning displayed over sensitive content flagged as SPAM by Smooch Bot", | ||
| "defaultMessage": "This content has been flagged as <strong>SPAM</strong> because the user was blocked due to sending excessive messages." | ||
| }, | ||
| { | ||
| "id": "contentScreen.warning", | ||
| "description": "Content warning displayed over sensitive content detected by a specific user", | ||
| "defaultMessage": "<strong>{user_name}</strong> has detected this content as <strong>{warning_category}</strong>" | ||
| } | ||
| ] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,84 @@ | ||
| import React from 'react'; | ||
| import { FormattedHTMLMessage, defineMessages, injectIntl, intlShape } from 'react-intl'; | ||
| import PropTypes from 'prop-types'; | ||
|
|
||
| const messages = defineMessages({ | ||
| adult: { | ||
| id: 'contentScreen.adult', | ||
| defaultMessage: 'Adult', | ||
| description: 'Content warning type: Adult', | ||
| }, | ||
| medical: { | ||
| id: 'contentScreen.medical', | ||
| defaultMessage: 'Medical', | ||
| description: 'Content warning type: Medical', | ||
| }, | ||
| spam: { | ||
| id: 'contentScreen.spam', | ||
| defaultMessage: 'Spam', | ||
| description: 'Content warning type: Spam', | ||
| }, | ||
| violence: { | ||
| id: 'contentScreen.violence', | ||
| defaultMessage: 'Violence', | ||
| description: 'Content warning type: Violence', | ||
| }, | ||
| }); | ||
|
|
||
| const ContentWarningMessage = ({ | ||
| intl, | ||
| warningCategory, | ||
| warningCreator, | ||
| }) => { | ||
| let message; | ||
| if (warningCreator === 'Alegre') { | ||
| message = ( | ||
| <FormattedHTMLMessage | ||
| defaultMessage="An automation rule has detected this content as sensitive" | ||
| description="Content warning displayed over sensitive content detected by an automation rule" | ||
| id="contentScreen.warningByAutomationRule" | ||
| tagName="p" | ||
| /> | ||
| ); | ||
| } else if (warningCreator === 'Smooch Bot' || !warningCreator) { | ||
| message = ( | ||
| <FormattedHTMLMessage | ||
| defaultMessage="This content has been flagged as <strong>SPAM</strong> because the user was blocked due to sending excessive messages." | ||
| description="Content warning displayed over sensitive content flagged as SPAM by Smooch Bot" | ||
| id="contentScreen.warningBySmoochBot" | ||
| tagName="p" | ||
| /> | ||
| ); | ||
| } else { | ||
| message = ( | ||
| <FormattedHTMLMessage | ||
| defaultMessage="<strong>{user_name}</strong> has detected this content as <strong>{warning_category}</strong>" | ||
| description="Content warning displayed over sensitive content detected by a specific user" | ||
| id="contentScreen.warning" | ||
| tagName="p" | ||
| values={{ | ||
| user_name: warningCreator, | ||
| warning_category: ( | ||
| (messages[warningCategory] && intl.formatMessage(messages[warningCategory])) || | ||
| warningCategory | ||
| ), | ||
| }} | ||
| /> | ||
| ); | ||
| } | ||
|
|
||
| return message; | ||
| }; | ||
|
|
||
| ContentWarningMessage.propTypes = { | ||
| intl: intlShape.isRequired, | ||
| warningCategory: PropTypes.string, | ||
| warningCreator: PropTypes.string, | ||
| }; | ||
|
|
||
| ContentWarningMessage.defaultProps = { | ||
| warningCreator: '', | ||
| warningCategory: '', | ||
| }; | ||
|
|
||
| export default injectIntl(ContentWarningMessage); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| import React from 'react'; | ||
| import ContentWarningMessage from './ContentWarningMessage'; | ||
| import { mountWithIntl } from '../../../../test/unit/helpers/intl-test'; | ||
|
|
||
| describe('ContentWarningMessage', () => { | ||
| it('should render message for content detected by automated rule', () => { | ||
| const wrapper = mountWithIntl(<ContentWarningMessage | ||
| intl={{}} | ||
| warningCategory="adult" | ||
| warningCreator="Alegre" | ||
| />); | ||
| expect(wrapper.text()).toMatch(/An automation rule has detected this content as sensitive/); | ||
| }); | ||
|
|
||
| it('should render message for content flagged as SPAM by Smooch Bot', () => { | ||
| const wrapper = mountWithIntl(<ContentWarningMessage | ||
| intl={{}} | ||
| warningCategory="spam" | ||
| warningCreator="Smooch Bot" | ||
| />); | ||
| expect(wrapper.text()).toMatch(/This content has been flagged as SPAM because the user was blocked due to sending excessive messages/); | ||
| }); | ||
|
|
||
| it('should render message for content flagged as SPAM with no warning creator', () => { | ||
| const wrapper = mountWithIntl(<ContentWarningMessage | ||
| intl={{}} | ||
| warningCategory="spam" | ||
| warningCreator="" | ||
| />); | ||
| expect(wrapper.text()).toMatch(/This content has been flagged as SPAM because the user was blocked due to sending excessive messages/); | ||
| }); | ||
|
|
||
| it('should render message for content detected by a specific user', () => { | ||
| const wrapper = mountWithIntl(<ContentWarningMessage | ||
| intl={{}} | ||
| warningCategory="violence" | ||
| warningCreator="test user" | ||
| />); | ||
| expect(wrapper.text()).toMatch(/test user has detected this content as Violence/); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters