src/shared/components/create-community.tsx

   1 import { Component } from 'inferno';
   2 import { Helmet } from 'inferno-helmet';
   3 import { Subscription } from 'rxjs';
   4 import { retryWhen, delay, take } from 'rxjs/operators';
   5 import { CommunityForm } from './community-form';
   6 import {
   7   Community,
   8   UserOperation,
   9   WebSocketJsonResponse,
  10   GetSiteResponse,
  11   Site,
  12 } from 'lemmy-js-client';
  13 import { toast, wsJsonToRes } from '../utils';
  14 import { WebSocketService, UserService } from '../services';
  15 import { i18n } from '../i18next';
  16
  17 interface CreateCommunityState {
  18   site: Site;
  19 }
  20
  21 export class CreateCommunity extends Component<any, CreateCommunityState> {
  22   private subscription: Subscription;
  23   private emptyState: CreateCommunityState = {
  24     site: {
  25       id: undefined,
  26       name: undefined,
  27       creator_id: undefined,
  28       published: undefined,
  29       creator_name: undefined,
  30       number_of_users: undefined,
  31       number_of_posts: undefined,
  32       number_of_comments: undefined,
  33       number_of_communities: undefined,
  34       enable_downvotes: undefined,
  35       open_registration: undefined,
  36       enable_nsfw: undefined,
  37     },
  38   };
  39   constructor(props: any, context: any) {
  40     super(props, context);
  41     this.handleCommunityCreate = this.handleCommunityCreate.bind(this);
  42     this.state = this.emptyState;
  43
  44     if (!UserService.Instance.user) {
  45       toast(i18n.t('not_logged_in'), 'danger');
  46       this.context.router.history.push(`/login`);
  47     }
  48
  49     this.subscription = WebSocketService.Instance.subject
  50       .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
  51       .subscribe(
  52         msg => this.parseMessage(msg),
  53         err => console.error(err),
  54         () => console.log('complete')
  55       );
  56
  57     WebSocketService.Instance.getSite();
  58   }
  59
  60   componentWillUnmount() {
  61     this.subscription.unsubscribe();
  62   }
  63
  64   get documentTitle(): string {
  65     if (this.state.site.name) {
  66       return `${i18n.t('create_community')} - ${this.state.site.name}`;
  67     } else {
  68       return 'Lemmy';
  69     }
  70   }
  71
  72   render() {
  73     return (
  74       <div class="container">
  75         <Helmet title={this.documentTitle} />
  76         <div class="row">
  77           <div class="col-12 col-lg-6 offset-lg-3 mb-4">
  78             <h5>{i18n.t('create_community')}</h5>
  79             <CommunityForm
  80               onCreate={this.handleCommunityCreate}
  81               enableNsfw={this.state.site.enable_nsfw}
  82             />
  83           </div>
  84         </div>
  85       </div>
  86     );
  87   }
  88
  89   handleCommunityCreate(community: Community) {
  90     this.props.history.push(`/c/${community.name}`);
  91   }
  92
  93   parseMessage(msg: WebSocketJsonResponse) {
  94     console.log(msg);
  95     let res = wsJsonToRes(msg);
  96     if (msg.error) {
  97       // Toast errors are already handled by community-form
  98       return;
  99     } else if (res.op == UserOperation.GetSite) {
 100       let data = res.data as GetSiteResponse;
 101       this.state.site = data.site;
 102       this.setState(this.state);
 103     }
 104   }
 105 }