1 import { Component, InfernoNode, linkEvent } from "inferno";
2 import { T } from "inferno-i18next-dess";
4 ApproveRegistrationApplication,
5 RegistrationApplicationView,
6 } from "lemmy-js-client";
7 import { i18n } from "../../i18next";
8 import { mdToHtml, myAuthRequired } from "../../utils";
9 import { PersonListing } from "../person/person-listing";
10 import { Spinner } from "./icon";
11 import { MarkdownTextArea } from "./markdown-textarea";
12 import { MomentTime } from "./moment-time";
14 interface RegistrationApplicationProps {
15 application: RegistrationApplicationView;
16 onApproveApplication(form: ApproveRegistrationApplication): void;
19 interface RegistrationApplicationState {
21 denyExpanded: boolean;
22 approveLoading: boolean;
26 export class RegistrationApplication extends Component<
27 RegistrationApplicationProps,
28 RegistrationApplicationState
30 state: RegistrationApplicationState = {
31 denyReason: this.props.application.registration_application.deny_reason,
33 approveLoading: false,
37 constructor(props: any, context: any) {
38 super(props, context);
39 this.handleDenyReasonChange = this.handleDenyReasonChange.bind(this);
41 componentWillReceiveProps(
43 { children?: InfernoNode } & RegistrationApplicationProps
46 if (this.props != nextProps) {
49 approveLoading: false,
56 const a = this.props.application;
57 const ra = this.props.application.registration_application;
58 const accepted = a.creator_local_user.accepted_application;
61 <div className="registration-application">
63 {i18n.t("applicant")}: <PersonListing person={a.creator} />
66 {i18n.t("created")}: <MomentTime showAgo published={ra.published} />
68 <div>{i18n.t("answer")}:</div>
69 <div className="md-div" dangerouslySetInnerHTML={mdToHtml(ra.answer)} />
74 <T i18nKey="approved_by">
76 <PersonListing person={a.admin} />
80 <T i18nKey="denied_by">
82 <PersonListing person={a.admin} />
86 {i18n.t("deny_reason")}:{" "}
88 className="md-div d-inline-flex"
89 dangerouslySetInnerHTML={mdToHtml(ra.deny_reason)}
98 {this.state.denyExpanded && (
99 <div className="mb-3 row">
100 <label className="col-sm-2 col-form-label">
101 {i18n.t("deny_reason")}
103 <div className="col-sm-10">
105 initialContent={this.state.denyReason}
106 onContentChange={this.handleDenyReasonChange}
107 hideNavigationWarnings
114 {(!ra.admin_id || (ra.admin_id && !accepted)) && (
116 className="btn btn-secondary me-2 my-2"
117 onClick={linkEvent(this, this.handleApprove)}
118 aria-label={i18n.t("approve")}
120 {this.state.approveLoading ? <Spinner /> : i18n.t("approve")}
123 {(!ra.admin_id || (ra.admin_id && accepted)) && (
125 className="btn btn-secondary me-2"
126 onClick={linkEvent(this, this.handleDeny)}
127 aria-label={i18n.t("deny")}
129 {this.state.denyLoading ? <Spinner /> : i18n.t("deny")}
136 handleApprove(i: RegistrationApplication) {
137 i.setState({ denyExpanded: false, approveLoading: true });
138 i.props.onApproveApplication({
139 id: i.props.application.registration_application.id,
141 auth: myAuthRequired(),
145 handleDeny(i: RegistrationApplication) {
146 if (i.state.denyExpanded) {
147 i.setState({ denyExpanded: false, denyLoading: true });
148 i.props.onApproveApplication({
149 id: i.props.application.registration_application.id,
151 deny_reason: i.state.denyReason,
152 auth: myAuthRequired(),
155 i.setState({ denyExpanded: true });
159 handleDenyReasonChange(val: string) {
160 this.setState({ denyReason: val });