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