revert it later
This commit is contained in:
slawiko
@@ -0,0 +1,113 @@
|
|||||||
|
import { Component } from 'preact';
|
||||||
|
|
||||||
|
export class CommentInfo extends Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
}
|
||||||
|
|
||||||
|
render(props) {
|
||||||
|
return (
|
||||||
|
<div className="comment__info">
|
||||||
|
{
|
||||||
|
mods.view !== 'user' && (
|
||||||
|
<img
|
||||||
|
className={b('comment__avatar', {}, { default: o.user.isDefaultPicture })}
|
||||||
|
src={o.user.isDefaultPicture ? require('./__avatar/comment__avatar.svg') : o.user.picture}
|
||||||
|
alt=""
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
{
|
||||||
|
mods.view !== 'user' && (
|
||||||
|
<span
|
||||||
|
className="comment__username"
|
||||||
|
title={o.user.id}
|
||||||
|
onClick={this.toggleUserInfoVisibility}
|
||||||
|
>{o.user.name}</span>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
{
|
||||||
|
isAdmin && mods.view !== 'user' && (
|
||||||
|
<span
|
||||||
|
onClick={() => this.toggleVerify(o.user.verified)}
|
||||||
|
aria-label="Toggle verification"
|
||||||
|
title={o.user.verified ? 'Verified user' : 'Unverified user'}
|
||||||
|
className={b('comment__verification', {}, { active: o.user.verified, clickable: true })}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
{
|
||||||
|
!isAdmin && !!o.user.verified && mods.view !== 'user' && (
|
||||||
|
<span
|
||||||
|
title="Verified user"
|
||||||
|
className={b('comment__verification', {}, { active: true })}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
<a href={`${o.locator.url}#${COMMENT_NODE_CLASSNAME_PREFIX}${o.id}`} className="comment__time">{o.time}</a>
|
||||||
|
|
||||||
|
{
|
||||||
|
mods.level > 0 && mods.view !== 'user' && (
|
||||||
|
<a
|
||||||
|
className="comment__link-to-parent"
|
||||||
|
href={`${o.locator.url}#${COMMENT_NODE_CLASSNAME_PREFIX}${o.pid}`}
|
||||||
|
aria-label="Go to parent comment"
|
||||||
|
title="Go to parent comment"
|
||||||
|
onClick={this.scrollToParent}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
{
|
||||||
|
isAdmin && userBlocked && mods.view !== 'user' && (
|
||||||
|
<span className="comment__status">Blocked</span>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
{
|
||||||
|
isAdmin && !userBlocked && deleted && (
|
||||||
|
<span className="comment__status">Deleted</span>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
{
|
||||||
|
!mods.disabled && mods.view !== 'user' && (
|
||||||
|
<span
|
||||||
|
className={b('comment__action', {}, { type: 'collapse', selected: mods.collapsed })}
|
||||||
|
tabIndex="0"
|
||||||
|
onClick={this.toggleCollapse}
|
||||||
|
>{mods.collapsed ? '+' : '−'}</span>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
<span className={b('comment__score', {}, { view: o.score.view })}>
|
||||||
|
<span
|
||||||
|
className={b('comment__vote', {}, { type: 'up', selected: scoreIncreased, disabled: isGuest || isCurrentUser })}
|
||||||
|
role="button"
|
||||||
|
aria-disabled={isGuest || isCurrentUser}
|
||||||
|
tabIndex="0"
|
||||||
|
onClick={isGuest || isCurrentUser ? null : this.increaseScore}
|
||||||
|
title={isGuest ? 'Only authorized users are allowed to vote' : (isCurrentUser ? 'You can\'t vote for your own comment' : null)}
|
||||||
|
>Vote up</span>
|
||||||
|
|
||||||
|
<span className="comment__score-value">
|
||||||
|
{o.score.sign}{o.score.value}
|
||||||
|
</span>
|
||||||
|
|
||||||
|
|
||||||
|
<span
|
||||||
|
className={b('comment__vote', {}, { type: 'down', selected: scoreDecreased, disabled: isGuest || isCurrentUser })}
|
||||||
|
role="button"
|
||||||
|
aria-disabled={isGuest || isCurrentUser ? 'true' : 'false'}
|
||||||
|
tabIndex="0"
|
||||||
|
onClick={isGuest || isCurrentUser ? null : this.decreaseScore}
|
||||||
|
title={isGuest ? 'Only authorized users are allowed to vote' : (isCurrentUser ? 'You can\'t vote for your own comment' : null)}
|
||||||
|
>Vote down</span>
|
||||||
|
</span>
|
||||||
|
</div>);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -353,108 +353,7 @@ export default class Comment extends Component {
|
|||||||
return (
|
return (
|
||||||
<article className={b('comment', props, defaultMods)} id={mods.disabled ? null : `${COMMENT_NODE_CLASSNAME_PREFIX}${o.id}`}>
|
<article className={b('comment', props, defaultMods)} id={mods.disabled ? null : `${COMMENT_NODE_CLASSNAME_PREFIX}${o.id}`}>
|
||||||
<div className="comment__body">
|
<div className="comment__body">
|
||||||
<div className="comment__info">
|
|
||||||
{
|
|
||||||
mods.view !== 'user' && (
|
|
||||||
<img
|
|
||||||
className={b('comment__avatar', {}, { default: o.user.isDefaultPicture })}
|
|
||||||
src={o.user.isDefaultPicture ? require('./__avatar/comment__avatar.svg') : o.user.picture}
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
{
|
|
||||||
mods.view !== 'user' && (
|
|
||||||
<span
|
|
||||||
className="comment__username"
|
|
||||||
title={o.user.id}
|
|
||||||
onClick={this.toggleUserInfoVisibility}
|
|
||||||
>{o.user.name}</span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
{
|
|
||||||
isAdmin && mods.view !== 'user' && (
|
|
||||||
<span
|
|
||||||
onClick={() => this.toggleVerify(o.user.verified)}
|
|
||||||
aria-label="Toggle verification"
|
|
||||||
title={o.user.verified ? 'Verified user' : 'Unverified user'}
|
|
||||||
className={b('comment__verification', {}, { active: o.user.verified, clickable: true })}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
{
|
|
||||||
!isAdmin && !!o.user.verified && mods.view !== 'user' && (
|
|
||||||
<span
|
|
||||||
title="Verified user"
|
|
||||||
className={b('comment__verification', {}, { active: true })}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
<a href={`${o.locator.url}#${COMMENT_NODE_CLASSNAME_PREFIX}${o.id}`} className="comment__time">{o.time}</a>
|
|
||||||
|
|
||||||
{
|
|
||||||
mods.level > 0 && mods.view !== 'user' && (
|
|
||||||
<a
|
|
||||||
className="comment__link-to-parent"
|
|
||||||
href={`${o.locator.url}#${COMMENT_NODE_CLASSNAME_PREFIX}${o.pid}`}
|
|
||||||
aria-label="Go to parent comment"
|
|
||||||
title="Go to parent comment"
|
|
||||||
onClick={this.scrollToParent}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
{
|
|
||||||
isAdmin && userBlocked && mods.view !== 'user' && (
|
|
||||||
<span className="comment__status">Blocked</span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
{
|
|
||||||
isAdmin && !userBlocked && deleted && (
|
|
||||||
<span className="comment__status">Deleted</span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
{
|
|
||||||
!mods.disabled && mods.view !== 'user' && (
|
|
||||||
<span
|
|
||||||
className={b('comment__action', {}, { type: 'collapse', selected: mods.collapsed })}
|
|
||||||
tabIndex="0"
|
|
||||||
onClick={this.toggleCollapse}
|
|
||||||
>{mods.collapsed ? '+' : '−'}</span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
<span className={b('comment__score', {}, { view: o.score.view })}>
|
|
||||||
<span
|
|
||||||
className={b('comment__vote', {}, { type: 'up', selected: scoreIncreased, disabled: isGuest || isCurrentUser })}
|
|
||||||
role="button"
|
|
||||||
aria-disabled={isGuest || isCurrentUser}
|
|
||||||
tabIndex="0"
|
|
||||||
onClick={isGuest || isCurrentUser ? null : this.increaseScore}
|
|
||||||
title={isGuest ? 'Only authorized users are allowed to vote' : (isCurrentUser ? 'You can\'t vote for your own comment' : null)}
|
|
||||||
>Vote up</span>
|
|
||||||
|
|
||||||
<span className="comment__score-value">
|
|
||||||
{o.score.sign}{o.score.value}
|
|
||||||
</span>
|
|
||||||
|
|
||||||
|
|
||||||
<span
|
|
||||||
className={b('comment__vote', {}, { type: 'down', selected: scoreDecreased, disabled: isGuest || isCurrentUser })}
|
|
||||||
role="button"
|
|
||||||
aria-disabled={isGuest || isCurrentUser ? 'true' : 'false'}
|
|
||||||
tabIndex="0"
|
|
||||||
onClick={isGuest || isCurrentUser ? null : this.decreaseScore}
|
|
||||||
title={isGuest ? 'Only authorized users are allowed to vote' : (isCurrentUser ? 'You can\'t vote for your own comment' : null)}
|
|
||||||
>Vote down</span>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
<div
|
||||||
className={b('comment__text', { mix: 'raw-content' })}
|
className={b('comment__text', { mix: 'raw-content' })}
|
||||||
|
|||||||
Reference in New Issue
Block a user