import { Component, linkEvent } from 'inferno'; import { Link } from 'inferno-router'; import { CommentNode as CommentNodeI, CommentLikeForm, CommentForm as CommentFormI, BanFromCommunityForm, CommunityUser, AddModToCommunityForm } from '../interfaces'; import { WebSocketService, UserService } from '../services'; import { mdToHtml, getUnixTime } from '../utils'; import { MomentTime } from './moment-time'; import { CommentForm } from './comment-form'; import { CommentNodes } from './comment-nodes'; interface CommentNodeState { showReply: boolean; showEdit: boolean; showRemoveDialog: boolean; removeReason: string; showBanDialog: boolean; banReason: string; banExpires: string; } interface CommentNodeProps { node: CommentNodeI; noIndent?: boolean; viewOnly?: boolean; locked?: boolean; moderators: Array; } export class CommentNode extends Component { private emptyState: CommentNodeState = { showReply: false, showEdit: false, showRemoveDialog: false, removeReason: null, showBanDialog: false, banReason: null, banExpires: null, } constructor(props: any, context: any) { super(props, context); this.state = this.emptyState; this.handleReplyCancel = this.handleReplyCancel.bind(this); this.handleCommentLike = this.handleCommentLike.bind(this); this.handleCommentDisLike = this.handleCommentDisLike.bind(this); } render() { let node = this.props.node; return (
{node.comment.score}
  • {node.comment.creator_name}
  • ( +{node.comment.upvotes} | -{node.comment.downvotes} )
{this.state.showEdit && } {!this.state.showEdit &&
    {!this.props.viewOnly &&
  • reply
  • {this.myComment && <>
  • edit
  • delete
  • } {this.canMod && <>
  • {!this.props.node.comment.removed ? remove : restore }
  • {!this.isMod && <>
  • {!this.props.node.comment.banned ? ban : unban }
  • } {!this.props.node.comment.banned &&
  • {`${this.isMod ? 'remove' : 'appoint'} as mod`}
  • } }
    }
  • link
}
{this.state.showRemoveDialog &&
} {this.state.showBanDialog &&
} {this.state.showReply && } {this.props.node.children && }
) } get myComment(): boolean { return UserService.Instance.loggedIn && this.props.node.comment.creator_id == UserService.Instance.user.id; } get canMod(): boolean { // You can do moderator actions only on the mods added after you. if (UserService.Instance.loggedIn) { let modIds = this.props.moderators.map(m => m.user_id); let yourIndex = modIds.findIndex(id => id == UserService.Instance.user.id); if (yourIndex == -1) { return false; } else { console.log(modIds); modIds = modIds.slice(0, yourIndex+1); // +1 cause you cant mod yourself console.log(modIds); return !modIds.includes(this.props.node.comment.creator_id); } } else { return false; } } get isMod(): boolean { return this.props.moderators.map(m => m.user_id).includes(this.props.node.comment.creator_id); } handleReplyClick(i: CommentNode) { i.state.showReply = true; i.setState(i.state); } handleEditClick(i: CommentNode) { i.state.showEdit = true; i.setState(i.state); } handleDeleteClick(i: CommentNode) { let deleteForm: CommentFormI = { content: "*deleted*", edit_id: i.props.node.comment.id, creator_id: i.props.node.comment.creator_id, post_id: i.props.node.comment.post_id, parent_id: i.props.node.comment.parent_id, auth: null }; WebSocketService.Instance.editComment(deleteForm); } handleReplyCancel() { this.state.showReply = false; this.state.showEdit = false; this.setState(this.state); } handleCommentLike(i: CommentNodeI) { let form: CommentLikeForm = { comment_id: i.comment.id, post_id: i.comment.post_id, score: (i.comment.my_vote == 1) ? 0 : 1 }; WebSocketService.Instance.likeComment(form); } handleCommentDisLike(i: CommentNodeI) { let form: CommentLikeForm = { comment_id: i.comment.id, post_id: i.comment.post_id, score: (i.comment.my_vote == -1) ? 0 : -1 }; WebSocketService.Instance.likeComment(form); } handleModRemoveShow(i: CommentNode) { i.state.showRemoveDialog = true; i.setState(i.state); } handleModRemoveReasonChange(i: CommentNode, event: any) { i.state.removeReason = event.target.value; i.setState(i.state); } handleModRemoveSubmit(i: CommentNode) { let form: CommentFormI = { content: i.props.node.comment.content, edit_id: i.props.node.comment.id, creator_id: i.props.node.comment.creator_id, post_id: i.props.node.comment.post_id, parent_id: i.props.node.comment.parent_id, removed: !i.props.node.comment.removed, reason: i.state.removeReason, auth: null }; WebSocketService.Instance.editComment(form); i.state.showRemoveDialog = false; i.setState(i.state); } handleModBanShow(i: CommentNode) { i.state.showBanDialog = true; i.setState(i.state); } handleModBanReasonChange(i: CommentNode, event: any) { i.state.banReason = event.target.value; i.setState(i.state); } handleModBanExpiresChange(i: CommentNode, event: any) { i.state.banExpires = event.target.value; i.setState(i.state); } handleModBanSubmit(i: CommentNode) { let form: BanFromCommunityForm = { user_id: i.props.node.comment.creator_id, community_id: i.props.node.comment.community_id, ban: !i.props.node.comment.banned, reason: i.state.banReason, expires: getUnixTime(i.state.banExpires), }; WebSocketService.Instance.banFromCommunity(form); i.state.showBanDialog = false; i.setState(i.state); } handleAddModToCommunity(i: CommentNode) { let form: AddModToCommunityForm = { user_id: i.props.node.comment.creator_id, community_id: i.props.node.comment.community_id, added: !i.isMod, }; WebSocketService.Instance.addModToCommunity(form); i.setState(i.state); } }