import { Component, linkEvent } from 'inferno'; import { Link } from 'inferno-router'; import { WebSocketService, UserService } from '../services'; import { Post, CreatePostLikeForm, PostForm as PostFormI } from '../interfaces'; import { MomentTime } from './moment-time'; import { PostForm } from './post-form'; import { mdToHtml } from '../utils'; interface PostListingState { showEdit: boolean; showRemoveDialog: boolean; removeReason: string; iframeExpanded: boolean; } interface PostListingProps { post: Post; editable?: boolean; showCommunity?: boolean; showBody?: boolean; viewOnly?: boolean; } export class PostListing extends Component { private emptyState: PostListingState = { showEdit: false, showRemoveDialog: false, removeReason: null, iframeExpanded: false } constructor(props: any, context: any) { super(props, context); this.state = this.emptyState; this.handlePostLike = this.handlePostLike.bind(this); this.handlePostDisLike = this.handlePostDisLike.bind(this); this.handleEditPost = this.handleEditPost.bind(this); this.handleEditCancel = this.handleEditCancel.bind(this); } render() { return (
{!this.state.showEdit ? this.listing() : }
) } listing() { let post = this.props.post; return (
{post.score}
{post.url ?

{post.name} {post.removed && removed } {post.locked && locked }

{(new URL(post.url)).hostname} { !this.state.iframeExpanded ? + : -
}
:

{post.name} {post.removed && removed } {post.locked && locked }

}
  • by {post.creator_name} {this.props.showCommunity && to {post.community_name} }
  • ( +{post.upvotes} | -{post.downvotes} )
  • {post.number_of_comments} Comments
{this.props.editable &&
    {this.myPost &&
  • edit
  • delete
  • } {this.props.post.am_mod &&
  • {!this.props.post.removed ? remove : restore }
  • {this.props.post.locked ? 'unlock' : 'lock'}
  • }
} {this.state.showRemoveDialog &&
} {this.props.showBody && this.props.post.body &&
}
) } private get myPost(): boolean { return UserService.Instance.user && this.props.post.creator_id == UserService.Instance.user.id; } handlePostLike(i: PostListing) { let form: CreatePostLikeForm = { post_id: i.props.post.id, score: (i.props.post.my_vote == 1) ? 0 : 1 }; WebSocketService.Instance.likePost(form); } handlePostDisLike(i: PostListing) { let form: CreatePostLikeForm = { post_id: i.props.post.id, score: (i.props.post.my_vote == -1) ? 0 : -1 }; WebSocketService.Instance.likePost(form); } handleEditClick(i: PostListing) { i.state.showEdit = true; i.setState(i.state); } handleEditCancel() { this.state.showEdit = false; this.setState(this.state); } // The actual editing is done in the recieve for post handleEditPost() { this.state.showEdit = false; this.setState(this.state); } handleDeleteClick(i: PostListing) { let deleteForm: PostFormI = { body: '', community_id: i.props.post.community_id, name: "deleted", url: '', edit_id: i.props.post.id, creator_id: i.props.post.creator_id, auth: null }; WebSocketService.Instance.editPost(deleteForm); } handleModRemoveShow(i: PostListing) { i.state.showRemoveDialog = true; i.setState(i.state); } handleModRemoveReasonChange(i: PostListing, event: any) { i.state.removeReason = event.target.value; i.setState(i.state); } handleModRemoveSubmit(i: PostListing) { event.preventDefault(); let form: PostFormI = { name: i.props.post.name, community_id: i.props.post.community_id, edit_id: i.props.post.id, creator_id: i.props.post.creator_id, removed: !i.props.post.removed, reason: i.state.removeReason, auth: null, }; WebSocketService.Instance.editPost(form); i.state.showRemoveDialog = false; i.setState(i.state); } handleModLock(i: PostListing) { let form: PostFormI = { name: i.props.post.name, community_id: i.props.post.community_id, edit_id: i.props.post.id, creator_id: i.props.post.creator_id, locked: !i.props.post.locked, auth: null, }; WebSocketService.Instance.editPost(form); } handleIframeExpandClick(i: PostListing) { i.state.iframeExpanded = !i.state.iframeExpanded; i.setState(i.state); } }