import { Component, linkEvent } from 'inferno'; import { Subscription } from 'rxjs'; import { retryWhen, delay, take } from 'rxjs/operators'; import { CommunityForm as CommunityFormI, UserOperation, Category, ListCategoriesResponse, CommunityResponse, GetSiteResponse, WebSocketJsonResponse, } from '../interfaces'; import { WebSocketService } from '../services'; import { wsJsonToRes, capitalizeFirstLetter, toast, randomStr, setupTribute, } from '../utils'; import Tribute from 'tributejs/src/Tribute.js'; import autosize from 'autosize'; import { i18n } from '../i18next'; import { T } from 'inferno-i18next'; import { Community } from '../interfaces'; interface CommunityFormProps { community?: Community; // If a community is given, that means this is an edit onCancel?(): any; onCreate?(community: Community): any; onEdit?(community: Community): any; } interface CommunityFormState { communityForm: CommunityFormI; categories: Array; loading: boolean; enable_nsfw: boolean; } export class CommunityForm extends Component< CommunityFormProps, CommunityFormState > { private id = `community-form-${randomStr()}`; private tribute: Tribute; private subscription: Subscription; private emptyState: CommunityFormState = { communityForm: { name: null, title: null, category_id: null, nsfw: false, }, categories: [], loading: false, enable_nsfw: null, }; constructor(props: any, context: any) { super(props, context); this.tribute = setupTribute(); this.state = this.emptyState; if (this.props.community) { this.state.communityForm = { name: this.props.community.name, title: this.props.community.title, category_id: this.props.community.category_id, description: this.props.community.description, edit_id: this.props.community.id, nsfw: this.props.community.nsfw, auth: null, }; } this.subscription = WebSocketService.Instance.subject .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10)))) .subscribe( msg => this.parseMessage(msg), err => console.error(err), () => console.log('complete') ); WebSocketService.Instance.listCategories(); WebSocketService.Instance.getSite(); } componentDidMount() { var textarea: any = document.getElementById(this.id); autosize(textarea); this.tribute.attach(textarea); textarea.addEventListener('tribute-replaced', () => { this.state.communityForm.description = textarea.value; this.setState(this.state); autosize.update(textarea); }); } componentWillUnmount() { this.subscription.unsubscribe(); } render() { return (