better property names for collapsed threads

This commit is contained in:
data 2019-07-14 14:46:22 +02:00
parent 2ae7ad948f
commit e212b52f9b
3 changed files with 9 additions and 10 deletions

View File

@ -24,9 +24,11 @@ const ExpandedComment = props => {
fontVariant: 'small-caps',
display: props.displayCollapse || 'none',
}}
onClick={() => props.toggleCollapse(props.id, !props.collapsed)}
onClick={() =>
props.toggleCollapse(props.id, !props.collapsedThread)
}
>
{props.collapsed ? 'expand' : 'collapse'}
{props.collapsedThread ? 'expand' : 'collapse'}
</a>
) : (
''

View File

@ -3,7 +3,7 @@ import ExpandedComment from './ExpandedComment'
import CollapsedComment from './CollapsedComment'
const SingleComment = props => {
if (props.hidden) return <CollapsedComment {...props} />
if (props.collapsed) return <CollapsedComment {...props} />
return <ExpandedComment {...props} />
}

View File

@ -23,13 +23,12 @@ class ThreadList extends React.Component {
toggleCollapse(id, collapsed) {
const otherComments = this.props.comments.filter(c => c.id !== id)
var parent = this.props.comments.find(c => c.id === id)
//console.log('toggling', parent)
parent['collapsed'] = collapsed
parent['collapsedThread'] = collapsed
if (!collapsed) {
// when parent was a reply in a previously collapsed thread
// and is to be expanded it will be marked hidden
// and needs to be unhidden
parent['hidden'] = false
parent['collapsed'] = false
}
this.setState({ comments: otherComments.concat(parent) })
parent.replies.map(comment => this.toggleReplies(comment.id, collapsed))
@ -37,11 +36,9 @@ class ThreadList extends React.Component {
toggleReplies(id, collapsed) {
const otherComments = this.props.comments.filter(c => c.id !== id)
var comment = this.props.comments.find(c => c.id === id)
comment['hidden'] = collapsed
comment['collapsed'] = collapsed
this.setState({ comments: otherComments.concat(comment) })
if (comment.replies) {
comment.replies.map(c => this.toggleReplies(c.id, collapsed))
}
comment.replies.map(c => this.toggleReplies(c.id, collapsed))
}
handleChange(e) {