mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-27 01:25:52 -05:00
Merge pull request #2336 from paulkaplan/exit-single-comment-view
Allow user to exit "single comment mode" and see all comments.
This commit is contained in:
Paul Kaplan
GitHub
commit
af301ba450
4 changed files with 57 additions and 17 deletions
|
|
@ -88,7 +88,8 @@
|
|||
"general.report": "Report",
|
||||
"general.notAvailableHeadline": "Whoops! Our server is Scratch'ing its head",
|
||||
"general.notAvailableSubtitle": "We couldn't find the page you're looking for. Check to make sure you've typed the url correctly.",
|
||||
|
||||
"general.seeAllComments": "See all comments",
|
||||
|
||||
"general.all": "All",
|
||||
"general.animations": "Animations",
|
||||
"general.art": "Art",
|
||||
|
|
|
|||
|
|
@ -91,6 +91,11 @@ module.exports.previewReducer = (state, action) => {
|
|||
item !== action.studioId
|
||||
))
|
||||
});
|
||||
case 'RESET_COMMENTS':
|
||||
return Object.assign({}, state, {
|
||||
comments: [],
|
||||
replies: {}
|
||||
});
|
||||
case 'SET_COMMENTS':
|
||||
return Object.assign({}, state, {
|
||||
comments: [...state.comments, ...action.items] // TODO: consider a different way of doing this?
|
||||
|
|
@ -312,6 +317,10 @@ module.exports.setMoreCommentsToLoad = moreCommentsToLoad => ({
|
|||
moreCommentsToLoad: moreCommentsToLoad
|
||||
});
|
||||
|
||||
module.exports.resetComments = () => ({
|
||||
type: 'RESET_COMMENTS'
|
||||
});
|
||||
|
||||
module.exports.getProjectInfo = (id, token) => (dispatch => {
|
||||
const opts = {
|
||||
uri: `/projects/${id}`
|
||||
|
|
|
|||
|
|
@ -79,6 +79,7 @@ const PreviewPresentation = ({
|
|||
onReportComment,
|
||||
onReportSubmit,
|
||||
onRestoreComment,
|
||||
onSeeAllComments,
|
||||
onSeeInside,
|
||||
onShare,
|
||||
onToggleComments,
|
||||
|
|
@ -376,23 +377,26 @@ const PreviewPresentation = ({
|
|||
) : null}
|
||||
</FlexRow>
|
||||
|
||||
<FlexRow className="comments-root-reply">
|
||||
{projectInfo.comments_allowed ? (
|
||||
isLoggedIn ? (
|
||||
<ComposeComment
|
||||
projectId={projectId}
|
||||
onAddComment={onAddComment}
|
||||
/>
|
||||
{/* Do not show the top-level comment form in single comment mode */}
|
||||
{!singleCommentId && (
|
||||
<FlexRow className="comments-root-reply">
|
||||
{projectInfo.comments_allowed ? (
|
||||
isLoggedIn ? (
|
||||
<ComposeComment
|
||||
projectId={projectId}
|
||||
onAddComment={onAddComment}
|
||||
/>
|
||||
) : (
|
||||
/* TODO add box for signing in to leave a comment */
|
||||
null
|
||||
)
|
||||
) : (
|
||||
/* TODO add box for signing in to leave a comment */
|
||||
null
|
||||
)
|
||||
) : (
|
||||
<div className="comments-turned-off">
|
||||
<FormattedMessage id="project.comments.turnedOff" />
|
||||
</div>
|
||||
)}
|
||||
</FlexRow>
|
||||
<div className="comments-turned-off">
|
||||
<FormattedMessage id="project.comments.turnedOff" />
|
||||
</div>
|
||||
)}
|
||||
</FlexRow>
|
||||
)}
|
||||
|
||||
<FlexRow className="comments-list">
|
||||
{comments.map(comment => (
|
||||
|
|
@ -426,6 +430,14 @@ const PreviewPresentation = ({
|
|||
<FormattedMessage id="general.loadMore" />
|
||||
</Button>
|
||||
}
|
||||
{!!singleCommentId &&
|
||||
<Button
|
||||
className="button load-more-button"
|
||||
onClick={onSeeAllComments}
|
||||
>
|
||||
<FormattedMessage id="general.seeAllComments" />
|
||||
</Button>
|
||||
}
|
||||
</FlexRow>
|
||||
</div>
|
||||
<FlexRow className="column">
|
||||
|
|
@ -478,6 +490,7 @@ PreviewPresentation.propTypes = {
|
|||
onReportComment: PropTypes.func.isRequired,
|
||||
onReportSubmit: PropTypes.func.isRequired,
|
||||
onRestoreComment: PropTypes.func,
|
||||
onSeeAllComments: PropTypes.func,
|
||||
onSeeInside: PropTypes.func,
|
||||
onShare: PropTypes.func,
|
||||
onToggleComments: PropTypes.func,
|
||||
|
|
|
|||
|
|
@ -52,6 +52,7 @@ class Preview extends React.Component {
|
|||
'handleAddToStudioClick',
|
||||
'handleAddToStudioClose',
|
||||
'handleRemix',
|
||||
'handleSeeAllComments',
|
||||
'handleSeeInside',
|
||||
'handleShare',
|
||||
'handleUpdateProjectId',
|
||||
|
|
@ -377,6 +378,16 @@ class Preview extends React.Component {
|
|||
if (callback) callback();
|
||||
});
|
||||
}
|
||||
handleSeeAllComments () {
|
||||
// Remove hash from URL
|
||||
history.pushState('', document.title, window.location.pathname + window.location.search);
|
||||
this.setState({singleCommentId: null});
|
||||
this.props.handleSeeAllComments(
|
||||
this.props.projectInfo.id,
|
||||
this.props.isAdmin,
|
||||
this.props.user.token
|
||||
);
|
||||
}
|
||||
initCounts (favorites, loves) {
|
||||
this.setState({
|
||||
favoriteCount: favorites,
|
||||
|
|
@ -461,6 +472,7 @@ class Preview extends React.Component {
|
|||
onReportComment={this.handleReportComment}
|
||||
onReportSubmit={this.handleReportSubmit}
|
||||
onRestoreComment={this.handleRestoreComment}
|
||||
onSeeAllComments={this.handleSeeAllComments}
|
||||
onSeeInside={this.handleSeeInside}
|
||||
onShare={this.handleShare}
|
||||
onToggleComments={this.handleToggleComments}
|
||||
|
|
@ -546,6 +558,7 @@ Preview.propTypes = {
|
|||
handleOpenRegistration: PropTypes.func,
|
||||
handleReportComment: PropTypes.func,
|
||||
handleRestoreComment: PropTypes.func,
|
||||
handleSeeAllComments: PropTypes.func,
|
||||
handleToggleLoginOpen: PropTypes.func,
|
||||
isAdmin: PropTypes.bool,
|
||||
isEditable: PropTypes.bool,
|
||||
|
|
@ -684,6 +697,10 @@ const mapDispatchToProps = dispatch => ({
|
|||
event.preventDefault();
|
||||
dispatch(navigationActions.toggleLoginOpen());
|
||||
},
|
||||
handleSeeAllComments: (id, isAdmin, token) => {
|
||||
dispatch(previewActions.resetComments());
|
||||
dispatch(previewActions.getTopLevelComments(id, 0, isAdmin, token));
|
||||
},
|
||||
getOriginalInfo: id => {
|
||||
dispatch(previewActions.getOriginalInfo(id));
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in a new issue