1 import { Component } from 'inferno';
2 import { Subscription } from 'rxjs';
3 import { CommunityForm } from './community-form';
4 import { HtmlTags } from './html-tags';
9 ListCategoriesResponse,
11 } from 'lemmy-js-client';
21 import { WebSocketService, UserService } from '../services';
22 import { i18n } from '../i18next';
23 import { InitialFetchRequest } from 'shared/interfaces';
25 interface CreateCommunityState {
27 categories: Category[];
31 export class CreateCommunity extends Component<any, CreateCommunityState> {
32 private isoData = setIsoData(this.context);
33 private subscription: Subscription;
34 private emptyState: CreateCommunityState = {
35 site_view: this.isoData.site_res.site_view,
39 constructor(props: any, context: any) {
40 super(props, context);
41 this.handleCommunityCreate = this.handleCommunityCreate.bind(this);
42 this.state = this.emptyState;
44 this.parseMessage = this.parseMessage.bind(this);
45 this.subscription = wsSubscribe(this.parseMessage);
47 if (!UserService.Instance.user && isBrowser()) {
48 toast(i18n.t('not_logged_in'), 'danger');
49 this.context.router.history.push(`/login`);
52 // Only fetch the data if coming from another route
53 if (this.isoData.path == this.context.router.route.match.url) {
54 this.state.categories = this.isoData.routeData[0].categories;
55 this.state.loading = false;
57 WebSocketService.Instance.send(wsClient.listCategories());
61 componentWillUnmount() {
63 this.subscription.unsubscribe();
67 get documentTitle(): string {
68 return `${i18n.t('create_community')} - ${this.state.site_view.site.name}`;
73 <div class="container">
75 title={this.documentTitle}
76 path={this.context.router.route.match.url}
78 {this.state.loading ? (
80 <svg class="icon icon-spinner spin">
81 <use xlinkHref="#icon-spinner"></use>
86 <div class="col-12 col-lg-6 offset-lg-3 mb-4">
87 <h5>{i18n.t('create_community')}</h5>
89 categories={this.state.categories}
90 onCreate={this.handleCommunityCreate}
91 enableNsfw={this.state.site_view.site.enable_nsfw}
100 handleCommunityCreate(cv: CommunityView) {
101 this.props.history.push(`/c/${cv.community.name}`);
104 static fetchInitialData(req: InitialFetchRequest): Promise<any>[] {
105 return [req.client.listCategories()];
108 parseMessage(msg: any) {
109 let op = wsUserOp(msg);
111 // Toast errors are already handled by community-form
113 } else if (op == UserOperation.ListCategories) {
114 let data = wsJsonToRes<ListCategoriesResponse>(msg).data;
115 this.state.categories = data.categories;
116 this.state.loading = false;
117 this.setState(this.state);