Show different modal message when muted in the past

src/l10n.json

@@ -327,8 +327,6 @@
     "comments.isBad": "Hmm...the bad word detector thinks there is a problem with your comment. Please change it and remember to be respectful.",
     "comments.hasChatSite": "Uh oh! The comment contains a link to a website with unmoderated chat. For safety reasons, please do not link to these sites!",
     "comments.isSpam": "Hmm, seems like you've posted the same comment a bunch of times. Please don't spam.",
-    "comments.isMuted": "Hmm, the filterbot is pretty sure your recent comments weren't ok for Scratch, so your account has been muted for the rest of the day. :/",
-    "comments.isUnconstructive": "Hmm, the filterbot thinks your comment may be mean or disrespectful. Remember, most projects on Scratch are made by people who are just learning how to program.",
     "comments.isDisallowed": "Hmm, it looks like comments have been turned off for this page. :/",
     "comments.isIPMuted": "Sorry, the Scratch Team had to prevent your network from sharing comments or projects because it was used to break our community guidelines too many times. You can still share comments and projects from another network. If you'd like to appeal this block, you can contact appeals@scratch.mit.edu and reference Case Number {appealId}.",
     "comments.isTooLong": "That comment is too long! Please find a way to shorten your text.",

src/views/preview/comment/compose-comment.jsx

@@ -224,42 +224,43 @@ class ComposeComment extends React.Component {
             MuteModal.steps.MUTE_INFO : MuteModal.steps.COMMENT_ISSUE;
     }
 
-    getMuteMessageInfo () {
+    getMuteMessageInfo (justMuted) {
         // return the ids for the messages that are shown for this mute type
         // If mute modals have more than one unique "step" we could pass an array of steps
         const messageInfo = {
             pii: {
                 name: 'pii',
-                commentType: 'comment.type.pii',
-                commentTypePast: 'comment.type.pii.past',
+                commentType: justMuted ? 'comment.type.pii' : 'comment.type.pii.past',
                 muteStepHeader: 'comment.pii.header',
                 muteStepContent: ['comment.pii.content1', 'comment.pii.content2', 'comment.pii.content3']
             },
             unconstructive: {
                 name: 'unconstructive',
-                commentType: 'comment.type.unconstructive',
-                commentTypePast: 'comment.type.unconstructive.past',
+                commentType: justMuted ? 'comment.type.unconstructive' : 'comment.type.unconstructive.past',
                 muteStepHeader: 'comment.unconstructive.header',
-                muteStepContent: ['comment.unconstructive.content1', 'comment.unconstructive.content2']
+                muteStepContent: [
+                    justMuted ? 'comment.unconstructive.content1' : 'comment.unconstructive.content1.past',
+                    'comment.unconstructive.content2'
+                ]
             },
             vulgarity: {
                 name: 'vulgarity',
-                commentType: 'comment.type.vulgarity',
-                commentTypePast: 'comment.type.vulgarity.past',
+                commentType: justMuted ? 'comment.type.vulgarity' : 'comment.type.vulgarity.past',
                 muteStepHeader: 'comment.vulgarity.header',
-                muteStepContent: ['comment.vulgarity.content1', 'comment.vulgarity.content2']
+                muteStepContent: [
+                    justMuted ? 'comment.vulgarity.content1' : 'comment.vulgarity.content1.past',
+                    'comment.vulgarity.content2'
+                ]
             },
             spam: {
                 name: 'spam',
-                commentType: 'comment.type.spam',
-                commentTypePast: 'comment.type.spam.past',
+                commentType: justMuted ? 'comment.type.spam' : 'comment.type.spam.past',
                 muteStepHeader: 'comment.spam.header',
                 muteStepContent: ['comment.spam.content1', 'comment.spam.content2']
             },
             general: {
                 name: 'general',
-                commentType: 'comment.type.general',
-                commentTypePast: 'comment.type.general.past',
+                commentType: justMuted ? 'comment.type.general' : 'comment.type.general.past',
                 muteStepHeader: 'comment.general.header',
                 muteStepContent: ['comment.general.content1']
             }
@@ -291,11 +292,7 @@ class ComposeComment extends React.Component {
                         <CommentingStatus>
                             <p>
                                 <FormattedMessage
-                                    id={
-                                        this.state.status === ComposeStatus.REJECTED_MUTE ?
-                                            this.getMuteMessageInfo().commentType :
-                                            this.getMuteMessageInfo().commentTypePast
-                                    }
+                                    id={this.getMuteMessageInfo(this.state.status === ComposeStatus.REJECTED_MUTE).commentType}
                                 />
                             </p>
                             <p>
@@ -404,7 +401,7 @@ class ComposeComment extends React.Component {
                         useStandardSizes
                         className="mod-mute"
                         commentContent={this.state.message}
-                        muteModalMessages={this.getMuteMessageInfo()}
+                        muteModalMessages={this.getMuteMessageInfo(this.state.status === ComposeStatus.REJECTED_MUTE)}
                         shouldCloseOnOverlayClick={false}
                         showFeedback={
                             this.state.status === ComposeStatus.REJECTED_MUTE

src/views/preview/l10n.json

@@ -60,11 +60,13 @@
     "comment.type.unconstructive.past": "It appears that one of your recent comments was saying something that might have been hurtful.",
     "comment.unconstructive.header": "We encourage you to be supportive when commenting on other people’s projects",
     "comment.unconstructive.content1": "It appears that your comment was saying something that might have been hurtful.",
+    "comment.unconstructive.content1.past": "It appears that one of your recent comments was saying something that might have been hurtful.",
     "comment.unconstructive.content2": "If you think something could be better, you can say something you like about the project, and make a suggestion about how to improve it.",
     "comment.type.vulgarity": "Your most recent comment appeared to include a bad word.",
     "comment.type.vulgarity.past": "It appears that one of your recent comments contained a bad word.",
     "comment.vulgarity.header": "We encourage you to use language that’s appropriate for all ages.",
     "comment.vulgarity.content1": "It appears that your comment contains a bad word.",
+    "comment.vulgarity.content1.past": "It appears that one of your recent comments contained a bad word.",
     "comment.vulgarity.content2": "Scratch has users of all ages, so it’s important to use language that is appropriate for all Scratchers.",
     "comment.type.spam": "Your most recent comment appeared to contain advertising, text art, or a chain message.",
     "comment.type.spam.past": "It appears that one of your recent comments contained advertising, text art, or a chain message.",

test/unit/components/compose-comment.test.jsx

@@ -555,20 +555,46 @@ describe('Compose Comment test', () => {
         global.Date.now = realDateNow;
     });
 
-    test('getMuteMessageInfo: muteType set', () => {
+    test('getMuteMessageInfo: muteType set and just got muted', () => {
         const commentInstance = getComposeCommentWrapper({}).instance();
         commentInstance.setState({muteType: 'unconstructive'});
-        expect(commentInstance.getMuteMessageInfo().commentType).toBe('comment.type.unconstructive');
+        expect(commentInstance.getMuteMessageInfo(true).commentType).toBe('comment.type.unconstructive');
+        expect(commentInstance.getMuteMessageInfo(true).muteStepContent[0]).toBe('comment.unconstructive.content1');
     });
 
-    test('getMuteMessageInfo: muteType not set', () => {
+    test('getMuteMessageInfo: muteType set and already muted', () => {
         const commentInstance = getComposeCommentWrapper({}).instance();
-        expect(commentInstance.getMuteMessageInfo().commentType).toBe('comment.type.general');
+        commentInstance.setState({muteType: 'pii'});
+        expect(commentInstance.getMuteMessageInfo(false).commentType).toBe('comment.type.pii.past');
+        // PII has the same content1 regardless of whether you were just muted
+        expect(commentInstance.getMuteMessageInfo(false).muteStepContent[0]).toBe('comment.pii.content1');
+
+        commentInstance.setState({muteType: 'vulgarity'});
+        expect(commentInstance.getMuteMessageInfo(false).commentType).toBe('comment.type.vulgarity.past');
+        expect(commentInstance.getMuteMessageInfo(false).muteStepContent[0]).toBe('comment.vulgarity.content1.past');
+    });
+
+    test('getMuteMessageInfo: muteType not set and just got muted', () => {
+        const commentInstance = getComposeCommentWrapper({}).instance();
+        expect(commentInstance.getMuteMessageInfo(true).commentType).toBe('comment.type.general');
+        // general has the same content1 regardless of whether you were just muted
+        expect(commentInstance.getMuteMessageInfo(true).muteStepContent[0]).toBe('comment.general.content1');
+    });
+
+    test('getMuteMessageInfo: muteType not set and already muted', () => {
+        const commentInstance = getComposeCommentWrapper({}).instance();
+        expect(commentInstance.getMuteMessageInfo(false).commentType).toBe('comment.type.general.past');
+    });
+
+    test('getMuteMessageInfo: muteType set to something we don\'t have messages for and just got muted', () => {
+        const commentInstance = getComposeCommentWrapper({}).instance();
+        commentInstance.setState({muteType: 'spaghetti'});
+        expect(commentInstance.getMuteMessageInfo(true).commentType).toBe('comment.type.general');
     });
 
-    test('getMuteMessageInfo: muteType set to something we don\'t have messages for', () => {
+    test('getMuteMessageInfo: muteType set to something we don\'t have messages for and already muted', () => {
         const commentInstance = getComposeCommentWrapper({}).instance();
         commentInstance.setState({muteType: 'spaghetti'});
-        expect(commentInstance.getMuteMessageInfo().commentType).toBe('comment.type.general');
+        expect(commentInstance.getMuteMessageInfo(false).commentType).toBe('comment.type.general.past');
     });
 });