wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-07-11 15:17:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

Don't create callback in render

Browse Source
This commit is contained in:
Chi Vinh Le
2017-07-19 00:48:33 +07:00
parent cd1735e1d6
commit f051ee1d58
1 changed files with 44 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/talk-plugin-featured-comments/client/components/FeaturedComment.js
+44 -36
View File
@@ -6,44 +6,52 @@ import {timeago} from 'coral-framework/services/i18n';
import {Slot} from 'plugin-api/beta/client/components';
import {Icon} from 'plugin-api/beta/client/components/ui';
const FeaturedComment = ({comment, asset, viewComment}) => {
return (
<div className={cn(styles.featuredComment, `${name}__featured-comment`)}>
class FeaturedComment extends React.Component {
<blockquote className={cn(styles.quote, `${name}__featured-comment__comment-body`)}>
{comment.body}
</blockquote>
viewComment = () => {
this.props.viewComment(this.props.comment.id);
}
<div className={cn(`${name}__featured-comment__username-box`)}>
<strong className={cn(styles.username, `${name}__featured-comment__username`)}>
{comment.user.username}
</strong>
<span className={cn(styles.timeago, `${name}__featured-comment__timeago`)}>
,{' '}{timeago(comment.created_at)}
</span>
render() {
const {comment, asset} = this.props;
return (
<div className={cn(styles.featuredComment, `${name}__featured-comment`)}>
<blockquote className={cn(styles.quote, `${name}__featured-comment__comment-body`)}>
{comment.body}
</blockquote>
<div className={cn(`${name}__featured-comment__username-box`)}>
<strong className={cn(styles.username, `${name}__featured-comment__username`)}>
{comment.user.username}
</strong>
<span className={cn(styles.timeago, `${name}__featured-comment__timeago`)}>
,{' '}{timeago(comment.created_at)}
</span>
</div>
<footer className={cn(styles.footer, `${name}__featured-comment__footer`)}>
<div className={cn(styles.reactionsContainer, `${name}__featured-comment__reactions`)}>
<Slot
fill="commentReactions"
comment={comment}
commentId={comment.id}
asset={asset}
inline
/>
</div>
<div className={cn(styles.actionsContainer, `${name}__featured-comment__actions`)}>
<a className={cn(styles.goTo, `${name}__featured-comment__go-to`)}
onClick={this.viewComment}>
<Icon name="forum" className={styles.repliesIcon} /> {comment.replyCount} |
Go to conversation<Icon name="keyboard_arrow_right" className={styles.goToIcon} />
</a>
</div>
</footer>
</div>
<footer className={cn(styles.footer, `${name}__featured-comment__footer`)}>
<div className={cn(styles.reactionsContainer, `${name}__featured-comment__reactions`)}>
<Slot
fill="commentReactions"
comment={comment}
commentId={comment.id}
asset={asset}
inline
/>
</div>
<div className={cn(styles.actionsContainer, `${name}__featured-comment__actions`)}>
<a className={cn(styles.goTo, `${name}__featured-comment__go-to`)}
onClick={() => viewComment(comment.id)} >
<Icon name="forum" className={styles.repliesIcon} /> {comment.replyCount} |
Go to conversation<Icon name="keyboard_arrow_right" className={styles.goToIcon} />
</a>
</div>
</footer>
</div>
);
};
);
}
}
export default FeaturedComment;