2 editRegistrationApplication,
6 import { isBrowser } from "@utils/browser";
7 import { RouteDataResponse } from "@utils/types";
8 import { Component, linkEvent } from "inferno";
10 ApproveRegistrationApplication,
12 ListRegistrationApplicationsResponse,
13 RegistrationApplicationView,
14 } from "lemmy-js-client";
15 import { fetchLimit } from "../../config";
16 import { InitialFetchRequest } from "../../interfaces";
17 import { FirstLoadService, I18NextService, UserService } from "../../services";
18 import { HttpService, RequestState } from "../../services/HttpService";
19 import { setupTippy } from "../../tippy";
20 import { HtmlTags } from "../common/html-tags";
21 import { Spinner } from "../common/icon";
22 import { Paginator } from "../common/paginator";
23 import { RegistrationApplication } from "../common/registration-application";
30 type RegistrationApplicationsData = RouteDataResponse<{
31 listRegistrationApplicationsResponse: ListRegistrationApplicationsResponse;
34 interface RegistrationApplicationsState {
35 appsRes: RequestState<ListRegistrationApplicationsResponse>;
36 siteRes: GetSiteResponse;
37 unreadOrAll: UnreadOrAll;
39 isIsomorphic: boolean;
42 export class RegistrationApplications extends Component<
44 RegistrationApplicationsState
46 private isoData = setIsoData<RegistrationApplicationsData>(this.context);
47 state: RegistrationApplicationsState = {
48 appsRes: { state: "empty" },
49 siteRes: this.isoData.site_res,
50 unreadOrAll: UnreadOrAll.Unread,
55 constructor(props: any, context: any) {
56 super(props, context);
58 this.handlePageChange = this.handlePageChange.bind(this);
59 this.handleApproveApplication = this.handleApproveApplication.bind(this);
61 // Only fetch the data if coming from another route
62 if (!isBrowser() || FirstLoadService.isFirstLoad) {
65 appsRes: this.isoData.routeData.listRegistrationApplicationsResponse,
71 async componentDidMount() {
72 if (!this.state.isIsomorphic) {
78 get documentTitle(): string {
79 const mui = UserService.Instance.myUserInfo;
81 ? `@${mui.local_user_view.person.name} ${I18NextService.i18n.t(
82 "registration_applications"
83 )} - ${this.state.siteRes.site_view.site.name}`
88 switch (this.state.appsRes.state) {
96 const apps = this.state.appsRes.data.registration_applications;
99 <div className="col-12">
101 title={this.documentTitle}
102 path={this.context.router.route.match.url}
104 <h5 className="mb-2">
105 {I18NextService.i18n.t("registration_applications")}
108 {this.applicationList(apps)}
110 page={this.state.page}
111 onChange={this.handlePageChange}
122 <div className="registration-applications container-lg">
128 unreadOrAllRadios() {
130 <div className="btn-group btn-group-toggle flex-wrap mb-2">
132 className={`btn btn-outline-secondary pointer
133 ${this.state.unreadOrAll == UnreadOrAll.Unread && "active"}
138 className="btn-check"
139 value={UnreadOrAll.Unread}
140 checked={this.state.unreadOrAll == UnreadOrAll.Unread}
141 onChange={linkEvent(this, this.handleUnreadOrAllChange)}
143 {I18NextService.i18n.t("unread")}
146 className={`btn btn-outline-secondary pointer
147 ${this.state.unreadOrAll == UnreadOrAll.All && "active"}
152 className="btn-check"
153 value={UnreadOrAll.All}
154 checked={this.state.unreadOrAll == UnreadOrAll.All}
155 onChange={linkEvent(this, this.handleUnreadOrAllChange)}
157 {I18NextService.i18n.t("all")}
165 <div className="mb-2">
166 <span className="me-3">{this.unreadOrAllRadios()}</span>
171 applicationList(apps: RegistrationApplicationView[]) {
177 <RegistrationApplication
178 key={ra.registration_application.id}
180 onApproveApplication={this.handleApproveApplication}
188 handleUnreadOrAllChange(i: RegistrationApplications, event: any) {
189 i.setState({ unreadOrAll: Number(event.target.value), page: 1 });
193 handlePageChange(page: number) {
194 this.setState({ page });
198 static async fetchInitialData({
201 }: InitialFetchRequest): Promise<RegistrationApplicationsData> {
203 listRegistrationApplicationsResponse: auth
204 ? await client.listRegistrationApplications({
208 auth: auth as string,
210 : { state: "empty" },
215 const unread_only = this.state.unreadOrAll == UnreadOrAll.Unread;
217 appsRes: { state: "loading" },
220 appsRes: await HttpService.client.listRegistrationApplications({
221 unread_only: unread_only,
222 page: this.state.page,
224 auth: myAuthRequired(),
229 async handleApproveApplication(form: ApproveRegistrationApplication) {
230 const approveRes = await HttpService.client.approveRegistrationApplication(
234 if (s.appsRes.state == "success" && approveRes.state == "success") {
235 s.appsRes.data.registration_applications = editRegistrationApplication(
236 approveRes.data.registration_application,
237 s.appsRes.data.registration_applications