diff --git a/client/blocks/comment-detail/comment-detail-edit.jsx b/client/blocks/comment-detail/comment-detail-edit.jsx index f52c5e2008cb7..6f2e2f57777d0 100644 --- a/client/blocks/comment-detail/comment-detail-edit.jsx +++ b/client/blocks/comment-detail/comment-detail-edit.jsx @@ -50,7 +50,8 @@ export class CommentDetailEdit extends Component { setCommentContentValue = event => this.setState( { commentContent: event.target.value } ); editCommentAndCloseEditMode = () => { - this.props.editComment( this.props.commentId, this.props.postId, this.state ); + const { authorDisplayName, authorUrl, commentContent } = this.props; + this.props.editComment( this.props.commentId, this.props.postId, this.state, { authorDisplayName, authorUrl, commentContent } ); this.props.closeEditMode(); }; diff --git a/client/my-sites/comments/comment-list/index.jsx b/client/my-sites/comments/comment-list/index.jsx index 413c60a504ed0..6f2080a3ba3e4 100644 --- a/client/my-sites/comments/comment-list/index.jsx +++ b/client/my-sites/comments/comment-list/index.jsx @@ -92,13 +92,11 @@ export class CommentList extends Component { this.props.deleteComment( commentId, postId ); } - editComment = ( commentId, postId, commentData ) => { + editComment = ( commentId, postId, commentData, undoCommentData, showNotice = true ) => { this.props.editComment( commentId, postId, commentData ); - this.props.successNotice( this.props.translate( 'Comment updated.' ), { - duration: 5000, - id: `comment-notice-${ commentId }`, - isPersistent: true, - } ); + if ( showNotice ) { + this.showEditNotice( commentId, postId, undoCommentData ); + } } getComments = () => uniq( [ ...this.state.persistedComments, ...this.props.comments ] ).sort( ( a, b ) => b - a ); @@ -235,6 +233,25 @@ export class CommentList extends Component { } } + showEditNotice = ( commentId, postId, undoCommentData ) => { + const { translate } = this.props; + + const message = translate( 'Your comment has been updated.' ); + + const noticeOptions = { + button: translate( 'Undo' ), + duration: 5000, + id: `comment-notice-${ commentId }`, + isPersistent: true, + onClick: () => { + this.editComment( commentId, postId, undoCommentData, false ); + this.props.removeNotice( `comment-notice-${ commentId }` ); + }, + }; + + this.props.successNotice( message, noticeOptions ); + }; + showBulkNotice = newStatus => { const { translate } = this.props;