import { Component, linkEvent } from 'inferno'; import { Link } from 'inferno-router'; import { Community, CommunityUser, FollowCommunityForm, CommunityForm as CommunityFormI, UserView, } from '../interfaces'; import { WebSocketService, UserService } from '../services'; import { mdToHtml, getUnixTime, pictshareAvatarThumbnail } from '../utils'; import { CommunityForm } from './community-form'; import { i18n } from '../i18next'; import { T } from 'inferno-i18next'; interface SidebarProps { community: Community; moderators: Array; admins: Array; } interface SidebarState { showEdit: boolean; showRemoveDialog: boolean; removeReason: string; removeExpires: string; } export class Sidebar extends Component { private emptyState: SidebarState = { showEdit: false, showRemoveDialog: false, removeReason: null, removeExpires: null, }; constructor(props: any, context: any) { super(props, context); this.state = this.emptyState; this.handleEditCommunity = this.handleEditCommunity.bind(this); this.handleEditCancel = this.handleEditCancel.bind(this); } render() { return (
{!this.state.showEdit ? ( this.sidebar() ) : ( )}
); } sidebar() { let community = this.props.community; return (
{community.title} {community.removed && ( # )} {community.deleted && ( # )}
/c/{community.name}
    {this.canMod && ( <>
  • #
  • {this.amCreator && (
  • {!community.deleted ? i18n.t('delete') : i18n.t('restore')}
  • )} )} {this.canAdmin && (
  • {!this.props.community.removed ? ( # ) : ( # )}
  • )}
{this.state.showRemoveDialog && (
{/* TODO hold off on expires for now */} {/*
*/} {/* */} {/* */} {/*
*/}
)}
  • {community.category_name}
  • #
  • #
  • #
  • #
  • {i18n.t('mods')}:
  • {this.props.moderators.map(mod => (
  • {mod.avatar && ( )} {mod.user_name}
  • ))}
#
{community.subscribed ? ( ) : ( )}
{community.description && (
)}
); } handleEditClick(i: Sidebar) { i.state.showEdit = true; i.setState(i.state); } handleEditCommunity() { this.state.showEdit = false; this.setState(this.state); } handleEditCancel() { this.state.showEdit = false; this.setState(this.state); } handleDeleteClick(i: Sidebar) { event.preventDefault(); let deleteForm: CommunityFormI = { name: i.props.community.name, title: i.props.community.title, category_id: i.props.community.category_id, edit_id: i.props.community.id, deleted: !i.props.community.deleted, nsfw: i.props.community.nsfw, auth: null, }; WebSocketService.Instance.editCommunity(deleteForm); } handleUnsubscribe(communityId: number) { let form: FollowCommunityForm = { community_id: communityId, follow: false, }; WebSocketService.Instance.followCommunity(form); } handleSubscribe(communityId: number) { let form: FollowCommunityForm = { community_id: communityId, follow: true, }; WebSocketService.Instance.followCommunity(form); } private get amCreator(): boolean { return this.props.community.creator_id == UserService.Instance.user.id; } get canMod(): boolean { return ( UserService.Instance.user && this.props.moderators .map(m => m.user_id) .includes(UserService.Instance.user.id) ); } get canAdmin(): boolean { return ( UserService.Instance.user && this.props.admins.map(a => a.id).includes(UserService.Instance.user.id) ); } handleModRemoveShow(i: Sidebar) { i.state.showRemoveDialog = true; i.setState(i.state); } handleModRemoveReasonChange(i: Sidebar, event: any) { i.state.removeReason = event.target.value; i.setState(i.state); } handleModRemoveExpiresChange(i: Sidebar, event: any) { console.log(event.target.value); i.state.removeExpires = event.target.value; i.setState(i.state); } handleModRemoveSubmit(i: Sidebar) { event.preventDefault(); let deleteForm: CommunityFormI = { name: i.props.community.name, title: i.props.community.title, category_id: i.props.community.category_id, edit_id: i.props.community.id, removed: !i.props.community.removed, reason: i.state.removeReason, expires: getUnixTime(i.state.removeExpires), nsfw: i.props.community.nsfw, auth: null, }; WebSocketService.Instance.editCommunity(deleteForm); i.state.showRemoveDialog = false; i.setState(i.state); } }