tanner/qotnews
1
0
Fork 1
Code Issues Pull Requests Releases Wiki Activity

add + expander in place of collapser.

Browse Source
This commit is contained in:
Jason Schwarzenberger 2020-11-04 12:43:15 +13:00
parent d718d05a04
commit 892a99eca6
1 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
webclient/src/Comments.js
View File

@ -72,7 +72,7 @@ class Article extends React.Component {
} }
displayComment(story, c, level) { displayComment(story, c, level) {
const cid = c.author+c.date; const cid = c.author + c.date;
const collapsed = this.state.collapsed.includes(cid); const collapsed = this.state.collapsed.includes(cid);
const expanded = this.state.expanded.includes(cid); const expanded = this.state.expanded.includes(cid);
@ -85,18 +85,21 @@ class Article extends React.Component {
<div className='info'> <div className='info'>
<p> <p>
{c.author === story.author ? '[OP]' : ''} {c.author || '[Deleted]'} {c.author === story.author ? '[OP]' : ''} {c.author || '[Deleted]'}
{' '} | <HashLink to={'#'+cid} id={cid}>{moment.unix(c.date).fromNow()}</HashLink> {' '} | <HashLink to={'#' + cid} id={cid}>{moment.unix(c.date).fromNow()}</HashLink>
{hidden || hasChildren && {hasChildren && (
hidden ?
<span className='collapser pointer' onClick={() => this.collapseComment(cid)}>–</span> <span className='collapser pointer' onClick={() => this.collapseComment(cid)}>–</span>
} :
<span className='collapser expander pointer' onClick={() => this.expandComment(cid)}>+</span>
)}
</p> </p>
</div> </div>
<div className={collapsed ? 'text hidden' : 'text'} dangerouslySetInnerHTML={{ __html: c.text }} /> <div className={collapsed ? 'text hidden' : 'text'} dangerouslySetInnerHTML={{ __html: c.text }} />
{hidden && hasChildren ? {hidden && hasChildren ?
<div className='comment lined info pointer' onClick={() => this.expandComment(cid)}>[show {this.countComments(c)-1} more]</div> <div className='comment lined info pointer' onClick={() => this.expandComment(cid)}>[show {this.countComments(c) - 1} more]</div>
: :
c.comments.map(i => this.displayComment(story, i, level + 1)) c.comments.map(i => this.displayComment(story, i, level + 1))
} }