diff --git a/src/views/studio/studio-comments.jsx b/src/views/studio/studio-comments.jsx index 949d1cc2d..3c235a2e2 100644 --- a/src/views/studio/studio-comments.jsx +++ b/src/views/studio/studio-comments.jsx @@ -44,11 +44,29 @@ 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 (comments.length === 0 && hasFetchedSession) handleLoadMoreComments(); - }, [comments.length === 0, hasFetchedSession]); + if (comments.length === 0 && hasFetchedSession) { + if (singleCommentId) { + handleLoadSingleComment(singleCommentId); + } else { + handleLoadMoreComments(); + } + } + }, [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. @@ -98,6 +116,8 @@ const StudioComments = ({ canRestore={canRestoreComment} content={comment.content} datetimeCreated={comment.datetime_created} + defaultExpanded={singleCommentId} + highlightedCommentId={singleCommentId} id={comment.id} key={comment.id} moreRepliesToLoad={comment.moreRepliesToLoad} @@ -116,6 +136,15 @@ const StudioComments = ({ onLoadMoreReplies={handleLoadMoreReplies} /> ))} + {!!singleCommentId && + + } {moreCommentsToLoad &&