Set buttons to be disabled (and not just look disabled) when the user was just...

Set buttons to be disabled (and not just look disabled) when the user was just muted. They were clickable before.

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

@@ -299,7 +299,10 @@ class ComposeComment extends React.Component {
                                 <FlexRow className="compose-bottom-row">
                                     <Button
                                         className="compose-post"
-                                        disabled={this.state.status === ComposeStatus.SUBMITTING}
+                                        disabled={
+                                            this.state.status === ComposeStatus.SUBMITTING ||
+                                            this.state.status === ComposeStatus.REJECTED_MUTE
+                                        }
                                         onClick={this.handlePost}
                                     >
                                         {this.state.status === ComposeStatus.SUBMITTING ? (
@@ -310,6 +313,7 @@ class ComposeComment extends React.Component {
                                     </Button>
                                     <Button
                                         className="compose-cancel"
+                                        disabled={this.state.status === ComposeStatus.REJECTED_MUTE}
                                         onClick={this.handleCancel}
                                     >
                                         <FormattedMessage id="comments.cancel" />

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

@@ -59,6 +59,10 @@ describe('Compose Comment test', () => {
         expect(component.find('FlexRow.compose-error-row').exists()).toEqual(false);
         expect(component.find('MuteModal').exists()).toEqual(false);
         expect(component.find('CommentingStatus').exists()).toEqual(false);
+        // Buttons start enabled
+        expect(component.find('Button.compose-post').props().disabled).toBe(false);
+        expect(component.find('Button.compose-cancel').props().disabled).toBe(false);
+
     });
 
     test('Error messages shows when comment rejected ', () => {
@@ -67,6 +71,9 @@ describe('Compose Comment test', () => {
         commentInstance.setState({error: 'isFlood'});
         component.update();
         expect(component.find('FlexRow.compose-error-row').exists()).toEqual(true);
+        // Buttons stay enabled when comment rejected for non-mute reasons
+        expect(component.find('Button.compose-post').props().disabled).toBe(false);
+        expect(component.find('Button.compose-cancel').props().disabled).toBe(false);
     });
 
     test('No error message shows when comment rejected because user muted ', () => {
@@ -142,6 +149,8 @@ describe('Compose Comment test', () => {
         // Compose box exists but is disabled
         expect(component.find('InplaceInput.compose-input').exists()).toEqual(true);
         expect(component.find('InplaceInput.compose-input').props().disabled).toBe(true);
+        expect(component.find('Button.compose-post').props().disabled).toBe(true);
+        expect(component.find('Button.compose-cancel').props().disabled).toBe(true);
         global.Date.now = realDateNow;
     });
     test('Comment Error does not show for mutes', () => {
@@ -170,6 +179,8 @@ describe('Compose Comment test', () => {
         expect(component.find('FlexRow.compose-comment').exists()).toEqual(true);
         expect(component.find('InplaceInput.compose-input').exists()).toEqual(true);
         expect(component.find('InplaceInput.compose-input').props().disabled).toBe(false);
+        expect(component.find('Button.compose-post').props().disabled).toBe(false);
+        expect(component.find('Button.compose-cancel').props().disabled).toBe(false);
     });
 
     test('Mute Modal shows when muteOpen is true ', () => {