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 &&