mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-28 01:56:00 -05:00
Merge pull request #5626 from ericrosenbaum/studio-single-comment
Studio single comment view
This commit is contained in:
commit
588ee63204
2 changed files with 38 additions and 3 deletions
|
@ -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 &&
|
||||
<Button
|
||||
className="button load-more-button"
|
||||
// eslint-disable-next-line react/jsx-no-bind
|
||||
onClick={handleSeeAllComments}
|
||||
>
|
||||
<FormattedMessage id="general.seeAllComments" />
|
||||
</Button>
|
||||
}
|
||||
{moreCommentsToLoad &&
|
||||
<Button
|
||||
className="button load-more-button"
|
||||
|
@ -151,6 +180,7 @@ StudioComments.propTypes = {
|
|||
handleReportComment: PropTypes.func,
|
||||
handleResetComments: PropTypes.func,
|
||||
handleLoadMoreReplies: PropTypes.func,
|
||||
handleLoadSingleComment: PropTypes.func,
|
||||
postURI: PropTypes.string
|
||||
};
|
||||
|
||||
|
@ -178,6 +208,7 @@ export default connect(
|
|||
}),
|
||||
{
|
||||
handleLoadMoreComments: studioCommentActions.getTopLevelComments,
|
||||
handleLoadSingleComment: studioCommentActions.getCommentById,
|
||||
handleNewComment: studioCommentActions.addNewComment,
|
||||
handleDeleteComment: studioCommentActions.deleteComment,
|
||||
handleRestoreComment: studioCommentActions.restoreComment,
|
||||
|
|
|
@ -478,6 +478,10 @@ $radius: 8px;
|
|||
|
||||
.studio-compose-container {
|
||||
padding-top: 8px;
|
||||
|
||||
.load-more-button {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.studio-comments-not-allowed {
|
||||
|
|
Loading…
Reference in a new issue