diff --git a/src/redux/studio-comment-actions.js b/src/redux/studio-comment-actions.js index b3513dd01..961881621 100644 --- a/src/redux/studio-comment-actions.js +++ b/src/redux/studio-comment-actions.js @@ -3,7 +3,7 @@ const eachLimit = require('async/eachLimit'); const api = require('../lib/api'); const log = require('../lib/log'); -const COMMENT_LIMIT = 20; +const COMMENT_LIMIT = 25; const { addNewComment, diff --git a/src/views/studio/studio-comments.jsx b/src/views/studio/studio-comments.jsx index 22cda114c..5fa0120cd 100644 --- a/src/views/studio/studio-comments.jsx +++ b/src/views/studio/studio-comments.jsx @@ -41,11 +41,27 @@ const StudioComments = ({ handleRestoreComment, handleResetComments, handleReportComment, - handleLoadMoreReplies + handleLoadMoreReplies, + handleLoadSingleComment }) => { + const commentHashPrefix = '#comments-'; + const [singleCommentId, setSingleCommentId] = useState( + window.location.hash.indexOf(commentHashPrefix) !== -1 && + parseInt(window.location.hash.replace(commentHashPrefix, ''), 10)); + useEffect(() => { + if (singleCommentId) { + handleLoadSingleComment(singleCommentId); + return; + } if (comments.length === 0 && hasFetchedSession) handleLoadMoreComments(); - }, [comments.length === 0, hasFetchedSession]); + }, [comments.length === 0, hasFetchedSession, singleCommentId]); + + const handleSeeAllComments = () => { + setSingleCommentId(false); + history.pushState('', document.title, window.location.pathname + window.location.search); + handleResetComments(); + }; // The comments you see depend on your admin status // so reset them if isAdmin changes. @@ -95,6 +111,7 @@ const StudioComments = ({ canRestore={canRestoreComment} content={comment.content} datetimeCreated={comment.datetime_created} + highlightedCommentId={singleCommentId} id={comment.id} key={comment.id} moreRepliesToLoad={comment.moreRepliesToLoad} @@ -113,6 +130,15 @@ const StudioComments = ({ onLoadMoreReplies={handleLoadMoreReplies} /> ))} + {!!singleCommentId && + + } {moreCommentsToLoad &&