diff --git a/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js b/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js index 0ae6fc2e4..13a09e1ed 100644 --- a/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js +++ b/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js @@ -166,7 +166,7 @@ class ModerationQueue extends React.Component { const {comments: prevComments} = this.props; const {comments: nextComments} = next; - if (!prevComments && nextComments) { + if (!prevComments && nextComments || !prevComments.length && nextComments.length) { this.setState(resetCursors); return; } @@ -227,11 +227,11 @@ class ModerationQueue extends React.Component { reflowList = throttle((index) => { if (index >= 0) { this.cache.clear(index); - this.listRef.recomputeRowHeights(index); + this.listRef && this.listRef.recomputeRowHeights(index); } else { this.cache.clearAll(); - this.listRef.recomputeRowHeights(); + this.listRef && this.listRef.recomputeRowHeights(); } }, 500); @@ -243,6 +243,7 @@ class ModerationQueue extends React.Component { const view = this.state.view; const rowCount = view.length + 1; if (index === rowCount - 1) { + const hasMore = this.props.comments.length < this.props.commentCount; return (
- + />}
); @@ -336,7 +338,6 @@ class ModerationQueue extends React.Component { } const view = this.state.view; - const hasMore = this.props.comments.length < this.props.commentCount; return (
@@ -358,7 +359,7 @@ class ModerationQueue extends React.Component { scrollTop={scrollTop} isScrolling={isScrolling} onScroll={onChildScroll} - rowCount={hasMore ? view.length + 1 : view.length} + rowCount={view.length + 1} deferredMeasurementCache={this.cache} rowRenderer={this.rowRenderer} rowHeight={this.cache.rowHeight} diff --git a/client/coral-admin/src/routes/Moderation/graphql.js b/client/coral-admin/src/routes/Moderation/graphql.js index 8ee728a5e..e99bb4a7e 100644 --- a/client/coral-admin/src/routes/Moderation/graphql.js +++ b/client/coral-admin/src/routes/Moderation/graphql.js @@ -59,6 +59,11 @@ function addCommentToQueue(root, queue, comment, sortOrder) { return update(root, changes); } +export function sortComments(nodes, sortOrder) { + const sortAlgo = sortOrder === 'ASC' ? ascending : descending; + return nodes.sort(sortAlgo); +} + /** * getCommentQueues determines in which queues a comment should be placed. */ @@ -83,6 +88,14 @@ function getCommentQueues(comment, queueConfig) { return queues; } +function isVisible(id) { + return !!document.getElementById(`comment_${id}`); +} + +function isEndOfListVisible(root, queue) { + return root[queue].nodes.length === 0 || !!document.getElementById('end-of-comment-list'); +} + /** * Assimilate comment changes into current store. * @param {Object} root current state of the store @@ -111,22 +124,18 @@ export function handleCommentChange(root, comment, sortOrder, notify, queueConfi if (nextQueues.indexOf(queue) >= 0) { if (!queueHasComment(next, queue, comment.id)) { next = addCommentToQueue(next, queue, comment, sortOrder); - if (notify && activeQueue === queue && shouldCommentBeAdded(next, queue, comment, sortOrder)) { + if (notify && activeQueue === queue && isEndOfListVisible(root, queue)) { showNotificationOnce(); } } } else if(queueHasComment(next, queue, comment.id)){ next = removeCommentFromQueue(next, queue, comment.id); - if (notify && activeQueue === queue) { + if (notify && isVisible(comment.id)) { showNotificationOnce(); } } - if ( - notify - && queueHasComment(next, queue, comment.id) - && activeQueue === queue - ) { + if (notify && isVisible(comment.id)) { showNotificationOnce(); } });