scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-23 15:47:53 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Continued work

Browse source
This commit is contained in:
seotts 2021-03-18 16:15:11 -04:00
parent 23da1e2781
commit 94eb3dc6de
2 changed files with 44 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/views/preview/comment/compose-comment.jsx
View file

@ -49,7 +49,7 @@ class ComposeComment extends React.Component {
this.props.muteStatus.muteExpiresAt * 1000 : 0; // convert to ms
this.state = {
message: '',
status: muteExpiresAtMs > 0 ? ComposeStatus.COMPOSE_DISALLOWED : ComposeStatus.EDITING,
status: muteExpiresAtMs > Date.now() ? ComposeStatus.COMPOSE_DISALLOWED : ComposeStatus.EDITING,
error: null,
appealId: null,
muteOpen: muteExpiresAtMs > Date.now() && this.props.isReply,
@ -162,7 +162,7 @@ class ComposeComment extends React.Component {
// Cancel (i.e. complete) the reply action if the user clicked on the reply button while
// alreay muted. This "closes" the reply. If they just got muted, we want to leave it open
// so the blue CommentingStatus box shows.
if (this.props.isReply && this.state.status !== ComposeStatus.REJECTED_MUTE) {
if (this.props.isReply && this.state.status === ComposeStatus.COMPOSE_DISALLOWED) {
this.handleCancel();
}
}
@ -186,6 +186,11 @@ class ComposeComment extends React.Component {
return false;
}
// TODO: Check with Kathy, but we think you should always see the modal when you reply?
if (this.props.isReply) {
return true;
}
// If the user is already muted (for example, in a different tab),
// do not show modal because it would be confusing
if (!justMuted) {
@ -215,7 +220,7 @@ class ComposeComment extends React.Component {
// Decides which step of the mute modal to start on. If this was a reply button click,
// we show them the step that tells them how much time is left on their mute, otherwise
// they start at the beginning of the progression.
return this.props.isReply && this.state.status !== ComposeStatus.REJECTED_MUTE ?
return this.props.isReply && this.state.status === ComposeStatus.COMPOSE_DISALLOWED ?
MuteModal.steps.MUTE_INFO : MuteModal.steps.COMMENT_ISSUE;
}
@ -282,7 +287,15 @@ class ComposeComment extends React.Component {
{(this.isMuted() && !(this.props.isReply && this.state.status !== ComposeStatus.REJECTED_MUTE)) ? (
<FlexRow className="comment">
<CommentingStatus>
<p><FormattedMessage id={this.state.status === ComposeStatus.REJECTED_MUTE ? this.getMuteMessageInfo().commentType : this.getMuteMessageInfo().commentTypePast} /></p>
<p>
<FormattedMessage
id={
this.state.status === ComposeStatus.REJECTED_MUTE ?
this.getMuteMessageInfo().commentType :
this.getMuteMessageInfo().commentTypePast
}
/>
</p>
<p>
<FormattedMessage
id="comments.muted.duration"

35
test/unit/components/compose-comment.test.jsx
View file

@ -90,13 +90,14 @@ describe('Compose Comment test', () => {
expect(component.find('FlexRow.compose-error-row').exists()).toEqual(false);
});
test('Comment Status shows but compose box does not when mute expiration in the future ', () => {
test('Comment Status shows but compose box does not when you load the page and you are already muted', () => {
const realDateNow = Date.now.bind(global.Date);
global.Date.now = () => 0;
const component = getComposeCommentWrapper({});
const commentInstance = component.instance();
commentInstance.setState({muteExpiresAtMs: 100});
commentInstance.setState({muteExpiresAtMs: 100, status: 'COMPOSE_DISALLOWED'});
component.update();
// Compose box should be hidden if muted unless they got muted due to a comment they just posted.
expect(component.find('FlexRow.compose-comment').exists()).toEqual(false);
expect(component.find('MuteModal').exists()).toEqual(false);
@ -236,7 +237,7 @@ describe('Compose Comment test', () => {
const commentInstance = component.instance();
commentInstance.setState({
error: 'some error',
status: 'FLOOD'
status: 'REJECTED'
});
component.update();
expect(component.find('FlexRow.compose-error-row').exists()).toEqual(true);
@ -338,7 +339,7 @@ describe('Compose Comment test', () => {
expect(component.find('MuteModal').props().showFeedback).toBe(true);
commentInstance.setState({
status: 'REJECTED_MUTE',
status: 'COMPOSE_DISALLOWED',
error: 'isMute',
showWarning: true,
muteOpen: true
@ -392,7 +393,7 @@ describe('Compose Comment test', () => {
offenses: [offense]
};
const commentInstance = getComposeCommentWrapper({}).instance();
expect(commentInstance.shouldShowMuteModal(muteStatus)).toBe(true);
expect(commentInstance.shouldShowMuteModal(muteStatus, true)).toBe(true);
global.Date.now = realDateNow;
});
@ -413,7 +414,7 @@ describe('Compose Comment test', () => {
offenses: offenses
};
const commentInstance = getComposeCommentWrapper({}).instance();
expect(commentInstance.shouldShowMuteModal(muteStatus)).toBe(false);
expect(commentInstance.shouldShowMuteModal(muteStatus, true)).toBe(false);
global.Date.now = realDateNow;
});
@ -435,7 +436,25 @@ describe('Compose Comment test', () => {
showWarning: true
};
const commentInstance = getComposeCommentWrapper({}).instance();
expect(commentInstance.shouldShowMuteModal(muteStatus)).toBe(true);
expect(commentInstance.shouldShowMuteModal(muteStatus, true)).toBe(true);
global.Date.now = realDateNow;
});
test('shouldShowMuteModal is false when the user is already muted, even when only 1 recent offesnse ', () => {
const realDateNow = Date.now.bind(global.Date);
global.Date.now = () => 0;
// Since Date.now mocked to 0 above, we just need a small number to make
// it look like it was created < 2 minutes ago.
const offense = {
expiresAt: '1000',
createdAt: '-60' // ~1 ago min given shouldShowMuteModal's conversions,
};
const muteStatus = {
offenses: [offense]
};
const justMuted = false;
const commentInstance = getComposeCommentWrapper({}).instance();
expect(commentInstance.shouldShowMuteModal(muteStatus, justMuted)).toBe(false);
global.Date.now = realDateNow;
});
@ -455,7 +474,7 @@ describe('Compose Comment test', () => {
test('getMuteModalStartStep: A reply click when already muted ', () => {
const commentInstance = getComposeCommentWrapper({isReply: true}).instance();
commentInstance.setState({
status: 'EDITING'
status: 'COMPOSE_DISALLOWED'
});
expect(commentInstance.getMuteModalStartStep()).toBe(1);
});