myAuthRequired,
setIsoData,
} from "@utils/app";
+import { randomStr } from "@utils/helpers";
import { RouteDataResponse } from "@utils/types";
+import classNames from "classnames";
import { Component, linkEvent } from "inferno";
import {
ApproveRegistrationApplication,
RegistrationApplicationView,
} from "lemmy-js-client";
import { fetchLimit } from "../../config";
-import { i18n } from "../../i18next";
import { InitialFetchRequest } from "../../interfaces";
-import { UserService } from "../../services";
-import { FirstLoadService } from "../../services/FirstLoadService";
+import { FirstLoadService, I18NextService, UserService } from "../../services";
import { HttpService, RequestState } from "../../services/HttpService";
import { setupTippy } from "../../tippy";
import { HtmlTags } from "../common/html-tags";
get documentTitle(): string {
const mui = UserService.Instance.myUserInfo;
return mui
- ? `@${mui.local_user_view.person.name} ${i18n.t(
+ ? `@${mui.local_user_view.person.name} ${I18NextService.i18n.t(
"registration_applications"
)} - ${this.state.siteRes.site_view.site.name}`
: "";
title={this.documentTitle}
path={this.context.router.route.match.url}
/>
- <h5 className="mb-2">{i18n.t("registration_applications")}</h5>
+ <h1 className="h4 mb-4">
+ {I18NextService.i18n.t("registration_applications")}
+ </h1>
{this.selects()}
{this.applicationList(apps)}
<Paginator
}
unreadOrAllRadios() {
+ const radioId = randomStr();
+
return (
- <div className="btn-group btn-group-toggle flex-wrap mb-2">
+ <div className="btn-group btn-group-toggle flex-wrap mb-2" role="group">
+ <input
+ id={`${radioId}-unread`}
+ type="radio"
+ className="btn-check"
+ value={UnreadOrAll.Unread}
+ checked={this.state.unreadOrAll === UnreadOrAll.Unread}
+ onChange={linkEvent(this, this.handleUnreadOrAllChange)}
+ />
<label
- className={`btn btn-outline-secondary pointer
- ${this.state.unreadOrAll == UnreadOrAll.Unread && "active"}
- `}
+ htmlFor={`${radioId}-unread`}
+ className={classNames("btn btn-outline-secondary pointer", {
+ active: this.state.unreadOrAll === UnreadOrAll.Unread,
+ })}
>
- <input
- type="radio"
- className="btn-check"
- value={UnreadOrAll.Unread}
- checked={this.state.unreadOrAll == UnreadOrAll.Unread}
- onChange={linkEvent(this, this.handleUnreadOrAllChange)}
- />
- {i18n.t("unread")}
+ {I18NextService.i18n.t("unread")}
</label>
+
+ <input
+ id={`${radioId}-all`}
+ type="radio"
+ className="btn-check"
+ value={UnreadOrAll.All}
+ checked={this.state.unreadOrAll === UnreadOrAll.All}
+ onChange={linkEvent(this, this.handleUnreadOrAllChange)}
+ />
<label
- className={`btn btn-outline-secondary pointer
- ${this.state.unreadOrAll == UnreadOrAll.All && "active"}
- `}
+ htmlFor={`${radioId}-all`}
+ className={classNames("btn btn-outline-secondary pointer", {
+ active: this.state.unreadOrAll === UnreadOrAll.All,
+ })}
>
- <input
- type="radio"
- className="btn-check"
- value={UnreadOrAll.All}
- checked={this.state.unreadOrAll == UnreadOrAll.All}
- onChange={linkEvent(this, this.handleUnreadOrAllChange)}
- />
- {i18n.t("all")}
+ {I18NextService.i18n.t("all")}
</label>
</div>
);