ui/src/components/create-private-message.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 { PrivateMessageForm } from './private-message-form';
   6 import { WebSocketService, UserService } from '../services';
   7 import {
   8   UserOperation,
   9   WebSocketJsonResponse,
  10   GetSiteResponse,
  11   Site,
  12   PrivateMessageFormParams,
  13 } from 'lemmy-js-client';
  14 import { toast, wsJsonToRes } from '../utils';
  15 import { i18n } from '../i18next';
  16
  17 interface CreatePrivateMessageState {
  18   site: Site;
  19 }
  20
  21 export class CreatePrivateMessage extends Component<
  22   any,
  23   CreatePrivateMessageState
  24 > {
  25   private subscription: Subscription;
  26   private emptyState: CreatePrivateMessageState = {
  27     site: undefined,
  28   };
  29   constructor(props: any, context: any) {
  30     super(props, context);
  31     this.state = this.emptyState;
  32     this.handlePrivateMessageCreate = this.handlePrivateMessageCreate.bind(
  33       this
  34     );
  35
  36     if (!UserService.Instance.user) {
  37       toast(i18n.t('not_logged_in'), 'danger');
  38       this.context.router.history.push(`/login`);
  39     }
  40
  41     this.subscription = WebSocketService.Instance.subject
  42       .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
  43       .subscribe(
  44         msg => this.parseMessage(msg),
  45         err => console.error(err),
  46         () => console.log('complete')
  47       );
  48
  49     WebSocketService.Instance.getSite();
  50   }
  51
  52   componentWillUnmount() {
  53     this.subscription.unsubscribe();
  54   }
  55
  56   get documentTitle(): string {
  57     if (this.state.site) {
  58       return `${i18n.t('create_private_message')} - ${this.state.site.name}`;
  59     } else {
  60       return 'Lemmy';
  61     }
  62   }
  63
  64   render() {
  65     return (
  66       <div class="container">
  67         <Helmet title={this.documentTitle} />
  68         <div class="row">
  69           <div class="col-12 col-lg-6 offset-lg-3 mb-4">
  70             <h5>{i18n.t('create_private_message')}</h5>
  71             <PrivateMessageForm
  72               onCreate={this.handlePrivateMessageCreate}
  73               params={this.params}
  74             />
  75           </div>
  76         </div>
  77       </div>
  78     );
  79   }
  80
  81   get params(): PrivateMessageFormParams {
  82     let urlParams = new URLSearchParams(this.props.location.search);
  83     let params: PrivateMessageFormParams = {
  84       recipient_id: Number(urlParams.get('recipient_id')),
  85     };
  86
  87     return params;
  88   }
  89
  90   handlePrivateMessageCreate() {
  91     toast(i18n.t('message_sent'));
  92
  93     // Navigate to the front
  94     this.props.history.push(`/`);
  95   }
  96
  97   parseMessage(msg: WebSocketJsonResponse) {
  98     console.log(msg);
  99     let res = wsJsonToRes(msg);
 100     if (msg.error) {
 101       toast(i18n.t(msg.error), 'danger');
 102       return;
 103     } else if (res.op == UserOperation.GetSite) {
 104       let data = res.data as GetSiteResponse;
 105       this.state.site = data.site;
 106       this.setState(this.state);
 107     }
 108   }
 109 }