import { Component, linkEvent } from 'inferno'; import { Link } from 'inferno-router'; import { CommentNode as CommentNodeI, CommentLikeForm, CommentForm as CommentFormI, SaveCommentForm, BanFromCommunityForm, BanUserForm, CommunityUser, UserView, AddModToCommunityForm, AddAdminForm } from '../interfaces'; import { WebSocketService, UserService } from '../services'; import { mdToHtml, getUnixTime, canMod, isMod } from '../utils'; import * as moment from 'moment'; import { MomentTime } from './moment-time'; import { CommentForm } from './comment-form'; import { CommentNodes } from './comment-nodes'; enum BanType {Community, Site}; interface CommentNodeState { showReply: boolean; showEdit: boolean; showRemoveDialog: boolean; removeReason: string; showBanDialog: boolean; banReason: string; banExpires: string; banType: BanType; } interface CommentNodeProps { node: CommentNodeI; noIndent?: boolean; viewOnly?: boolean; locked?: boolean; markable?: boolean; moderators: Array; admins: Array; } export class CommentNode extends Component { private emptyState: CommentNodeState = { showReply: false, showEdit: false, showRemoveDialog: false, removeReason: null, showBanDialog: false, banReason: null, banExpires: null, banType: BanType.Community } 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}
  • {this.isMod &&
  • mod
  • } {this.isAdmin &&
  • admin
  • }
  • ( +{node.comment.upvotes} | -{node.comment.downvotes} )
{this.state.showEdit && } {!this.state.showEdit &&
    {UserService.Instance.user && !this.props.viewOnly && <>
  • reply
  • {node.comment.saved ? 'unsave' : 'save'}
  • {this.myComment && <>
  • edit
  • delete
  • } {/* Admins and mods can remove comments */} {this.canMod &&
  • {!this.props.node.comment.removed ? remove : restore }
  • } {/* Mods can ban from community, and appoint as mods to community */} {this.canMod && <> {!this.isMod &&
  • {!this.props.node.comment.banned_from_community ? ban : unban }
  • } {!this.props.node.comment.banned_from_community &&
  • {`${this.isMod ? 'remove' : 'appoint'} as mod`}
  • } } {/* Admins can ban from all, and appoint other admins */} {this.canAdmin && <> {!this.isAdmin &&
  • {!this.props.node.comment.banned ? ban from site : unban from site }
  • } {!this.props.node.comment.banned &&
  • {`${this.isAdmin ? 'remove' : 'appoint'} as admin`}
  • } } }
  • link
  • {this.props.markable &&
  • {`mark as ${node.comment.read ? 'unread' : 'read'}`}
  • }
}
{this.state.showRemoveDialog &&
} {this.state.showBanDialog &&
{/* TODO hold off on expires until later */} {/*
*/} {/* */} {/* */} {/*
*/}
} {this.state.showReply && } {this.props.node.children && }
) } get myComment(): boolean { return UserService.Instance.user && this.props.node.comment.creator_id == UserService.Instance.user.id; } get isMod(): boolean { return this.props.moderators && isMod(this.props.moderators.map(m => m.user_id), this.props.node.comment.creator_id); } get isAdmin(): boolean { return this.props.admins && isMod(this.props.admins.map(a => a.id), this.props.node.comment.creator_id); } get canMod(): boolean { if (this.props.admins && this.props.moderators) { let adminsThenMods = this.props.admins.map(a => a.id) .concat(this.props.moderators.map(m => m.user_id)); return canMod(UserService.Instance.user, adminsThenMods, this.props.node.comment.creator_id); } else { return false; } } get canAdmin(): boolean { return this.props.admins && canMod(UserService.Instance.user, this.props.admins.map(a => a.id), 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); } handleSaveCommentClick(i: CommentNode) { let saved = (i.props.node.comment.saved == undefined) ? true : !i.props.node.comment.saved; let form: SaveCommentForm = { comment_id: i.props.node.comment.id, save: saved }; WebSocketService.Instance.saveComment(form); } 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) { event.preventDefault(); 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); } handleMarkRead(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, read: !i.props.node.comment.read, auth: null }; WebSocketService.Instance.editComment(form); } handleModBanFromCommunityShow(i: CommentNode) { i.state.showBanDialog = true; i.state.banType = BanType.Community; i.setState(i.state); } handleModBanShow(i: CommentNode) { i.state.showBanDialog = true; i.state.banType = BanType.Site; 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); } handleModBanFromCommunitySubmit(i: CommentNode) { i.state.banType = BanType.Community; i.setState(i.state); i.handleModBanBothSubmit(i); } handleModBanSubmit(i: CommentNode) { i.state.banType = BanType.Site; i.setState(i.state); i.handleModBanBothSubmit(i); } handleModBanBothSubmit(i: CommentNode) { event.preventDefault(); console.log(BanType[i.state.banType]); console.log(i.props.node.comment.banned); if (i.state.banType == BanType.Community) { 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_from_community, reason: i.state.banReason, expires: getUnixTime(i.state.banExpires), }; WebSocketService.Instance.banFromCommunity(form); } else { let form: BanUserForm = { user_id: i.props.node.comment.creator_id, ban: !i.props.node.comment.banned, reason: i.state.banReason, expires: getUnixTime(i.state.banExpires), }; WebSocketService.Instance.banUser(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); } handleAddAdmin(i: CommentNode) { let form: AddAdminForm = { user_id: i.props.node.comment.creator_id, added: !i.isAdmin, }; WebSocketService.Instance.addAdmin(form); i.setState(i.state); } get isCommentNew(): boolean { let now = moment.utc().subtract(10, 'minutes'); let then = moment.utc(this.props.node.comment.published); return now.isBefore(then); } }