import { Component, linkEvent } from "inferno";
import { Prompt } from "inferno-router";
import { Subscription } from "rxjs";
import {
EditCommunity,
CreateCommunity,
UserOperation,
Category,
CommunityResponse,
CommunityView,
} from "lemmy-js-client";
import { WebSocketService } from "../services";
import {
wsJsonToRes,
capitalizeFirstLetter,
toast,
randomStr,
wsSubscribe,
wsUserOp,
wsClient,
authField,
} from "../utils";
import { i18n } from "../i18next";
import { MarkdownTextArea } from "./markdown-textarea";
import { ImageUploadForm } from "./image-upload-form";
import { Icon, Spinner } from "./icon";
interface CommunityFormProps {
community_view?: CommunityView; // If a community is given, that means this is an edit
categories: Category[];
onCancel?(): any;
onCreate?(community: CommunityView): any;
onEdit?(community: CommunityView): any;
enableNsfw: boolean;
}
interface CommunityFormState {
communityForm: CreateCommunity;
loading: boolean;
}
export class CommunityForm extends Component<
CommunityFormProps,
CommunityFormState
> {
private id = `community-form-${randomStr()}`;
private subscription: Subscription;
private emptyState: CommunityFormState = {
communityForm: {
name: null,
title: null,
category_id: this.props.categories[0].id,
nsfw: false,
icon: null,
banner: null,
auth: authField(false),
},
loading: false,
};
constructor(props: any, context: any) {
super(props, context);
this.state = this.emptyState;
this.handleCommunityDescriptionChange = this.handleCommunityDescriptionChange.bind(
this
);
this.handleIconUpload = this.handleIconUpload.bind(this);
this.handleIconRemove = this.handleIconRemove.bind(this);
this.handleBannerUpload = this.handleBannerUpload.bind(this);
this.handleBannerRemove = this.handleBannerRemove.bind(this);
let cv = this.props.community_view;
if (cv) {
this.state.communityForm = {
name: cv.community.name,
title: cv.community.title,
category_id: cv.category.id,
description: cv.community.description,
nsfw: cv.community.nsfw,
icon: cv.community.icon,
banner: cv.community.banner,
auth: authField(),
};
}
this.parseMessage = this.parseMessage.bind(this);
this.subscription = wsSubscribe(this.parseMessage);
}
// TODO this should be checked out
componentDidUpdate() {
if (
!this.state.loading &&
(this.state.communityForm.name ||
this.state.communityForm.title ||
this.state.communityForm.description)
) {
window.onbeforeunload = () => true;
} else {
window.onbeforeunload = undefined;
}
}
componentWillUnmount() {
this.subscription.unsubscribe();
window.onbeforeunload = null;
}
render() {
return (
<>