src/shared/components/person/verify-email.tsx

   1 import { Component } from "inferno";
   2 import { GetSiteResponse, VerifyEmailResponse } from "lemmy-js-client";
   3 import { i18n } from "../../i18next";
   4 import { HttpService, RequestState } from "../../services/HttpService";
   5 import { setIsoData, toast } from "../../utils";
   6 import { HtmlTags } from "../common/html-tags";
   7 import { Spinner } from "../common/icon";
   8
   9 interface State {
  10   verifyRes: RequestState<VerifyEmailResponse>;
  11   siteRes: GetSiteResponse;
  12 }
  13
  14 export class VerifyEmail extends Component<any, State> {
  15   private isoData = setIsoData(this.context);
  16
  17   state: State = {
  18     verifyRes: { state: "empty" },
  19     siteRes: this.isoData.site_res,
  20   };
  21
  22   constructor(props: any, context: any) {
  23     super(props, context);
  24   }
  25
  26   async verify() {
  27     this.setState({
  28       verifyRes: { state: "loading" },
  29     });
  30
  31     this.setState({
  32       verifyRes: await HttpService.client.verifyEmail({
  33         token: this.props.match.params.token,
  34       }),
  35     });
  36
  37     if (this.state.verifyRes.state == "success") {
  38       toast(i18n.t("email_verified"));
  39       this.props.history.push("/login");
  40     }
  41   }
  42
  43   async componentDidMount() {
  44     await this.verify();
  45   }
  46
  47   get documentTitle(): string {
  48     return `${i18n.t("verify_email")} - ${
  49       this.state.siteRes.site_view.site.name
  50     }`;
  51   }
  52
  53   render() {
  54     return (
  55       <div className="container-lg">
  56         <HtmlTags
  57           title={this.documentTitle}
  58           path={this.context.router.route.match.url}
  59         />
  60         <div className="row">
  61           <div className="col-12 col-lg-6 offset-lg-3 mb-4">
  62             <h5>{i18n.t("verify_email")}</h5>
  63             {this.state.verifyRes.state == "loading" && (
  64               <h5>
  65                 <Spinner large />
  66               </h5>
  67             )}
  68           </div>
  69         </div>
  70       </div>
  71     );
  72   }
  73 }