1 import autosize from "autosize";
2 import { Component, linkEvent } from "inferno";
13 } from "lemmy-js-client";
14 import { Subscription } from "rxjs";
15 import { i18n } from "../../i18next";
16 import { InitialFetchRequest } from "../../interfaces";
17 import { WebSocketService } from "../../services";
20 capitalizeFirstLetter,
30 import { HtmlTags } from "../common/html-tags";
31 import { Spinner } from "../common/icon";
32 import { PersonListing } from "../person/person-listing";
33 import { SiteForm } from "./site-form";
35 interface AdminSettingsState {
36 siteRes: GetSiteResponse;
37 siteConfigRes: GetSiteConfigResponse;
38 siteConfigHjson: string;
40 banned: PersonViewSafe[];
41 siteConfigLoading: boolean;
42 leaveAdminTeamLoading: boolean;
45 export class AdminSettings extends Component<any, AdminSettingsState> {
46 private siteConfigTextAreaId = `site-config-${randomStr()}`;
47 private isoData = setIsoData(this.context);
48 private subscription: Subscription;
49 private emptyState: AdminSettingsState = {
50 siteRes: this.isoData.site_res,
51 siteConfigHjson: null,
57 siteConfigLoading: null,
58 leaveAdminTeamLoading: null,
61 constructor(props: any, context: any) {
62 super(props, context);
64 this.state = this.emptyState;
66 this.parseMessage = this.parseMessage.bind(this);
67 this.subscription = wsSubscribe(this.parseMessage);
69 // Only fetch the data if coming from another route
70 if (this.isoData.path == this.context.router.route.match.url) {
71 this.state.siteConfigRes = this.isoData.routeData[0];
72 this.state.siteConfigHjson = this.state.siteConfigRes.config_hjson;
73 this.state.banned = this.isoData.routeData[1].banned;
74 this.state.siteConfigLoading = false;
75 this.state.loading = false;
77 WebSocketService.Instance.send(
78 wsClient.getSiteConfig({
82 WebSocketService.Instance.send(
83 wsClient.getBannedPersons({
90 static fetchInitialData(req: InitialFetchRequest): Promise<any>[] {
91 let promises: Promise<any>[] = [];
93 let siteConfigForm: GetSiteConfig = { auth: req.auth };
94 promises.push(req.client.getSiteConfig(siteConfigForm));
96 let bannedPersonsForm: GetBannedPersons = { auth: req.auth };
97 promises.push(req.client.getBannedPersons(bannedPersonsForm));
102 componentDidMount() {
104 var textarea: any = document.getElementById(this.siteConfigTextAreaId);
109 componentWillUnmount() {
111 this.subscription.unsubscribe();
115 get documentTitle(): string {
116 return `${i18n.t("admin_settings")} - ${
117 this.state.siteRes.site_view.site.name
123 <div class="container">
124 {this.state.loading ? (
130 <div class="col-12 col-md-6">
132 title={this.documentTitle}
133 path={this.context.router.route.match.url}
135 {this.state.siteRes.site_view.site.id && (
136 <SiteForm site={this.state.siteRes.site_view.site} />
141 <div class="col-12 col-md-6">{this.adminSettings()}</div>
151 <h5>{capitalizeFirstLetter(i18n.t("admins"))}</h5>
152 <ul class="list-unstyled">
153 {this.state.siteRes.admins.map(admin => (
154 <li class="list-inline-item">
155 <PersonListing person={admin.person} />
167 onClick={linkEvent(this, this.handleLeaveAdminTeam)}
168 class="btn btn-danger mb-2"
170 {this.state.leaveAdminTeamLoading ? (
173 i18n.t("leave_admin_team")
182 <h5>{i18n.t("banned_users")}</h5>
183 <ul class="list-unstyled">
184 {this.state.banned.map(banned => (
185 <li class="list-inline-item">
186 <PersonListing person={banned.person} />
197 <h5>{i18n.t("admin_settings")}</h5>
198 <form onSubmit={linkEvent(this, this.handleSiteConfigSubmit)}>
199 <div class="form-group row">
201 class="col-12 col-form-label"
202 htmlFor={this.siteConfigTextAreaId}
204 {i18n.t("site_config")}
208 id={this.siteConfigTextAreaId}
209 value={this.state.siteConfigHjson}
210 onInput={linkEvent(this, this.handleSiteConfigHjsonChange)}
211 class="form-control text-monospace"
216 <div class="form-group row">
218 <button type="submit" class="btn btn-secondary mr-2">
219 {this.state.siteConfigLoading ? (
222 capitalizeFirstLetter(i18n.t("save"))
232 handleSiteConfigSubmit(i: AdminSettings, event: any) {
233 event.preventDefault();
234 i.state.siteConfigLoading = true;
235 let form: SaveSiteConfig = {
236 config_hjson: this.state.siteConfigHjson,
239 WebSocketService.Instance.send(wsClient.saveSiteConfig(form));
243 handleSiteConfigHjsonChange(i: AdminSettings, event: any) {
244 i.state.siteConfigHjson = event.target.value;
248 handleLeaveAdminTeam(i: AdminSettings) {
249 i.state.leaveAdminTeamLoading = true;
250 WebSocketService.Instance.send(wsClient.leaveAdmin({ auth: authField() }));
254 parseMessage(msg: any) {
255 let op = wsUserOp(msg);
258 toast(i18n.t(msg.error), "danger");
259 this.context.router.history.push("/");
260 this.state.loading = false;
261 this.setState(this.state);
263 } else if (op == UserOperation.EditSite) {
264 let data = wsJsonToRes<SiteResponse>(msg).data;
265 this.state.siteRes.site_view = data.site_view;
266 this.setState(this.state);
267 toast(i18n.t("site_saved"));
268 } else if (op == UserOperation.GetBannedPersons) {
269 let data = wsJsonToRes<BannedPersonsResponse>(msg).data;
270 this.state.banned = data.banned;
271 this.setState(this.state);
272 } else if (op == UserOperation.GetSiteConfig) {
273 let data = wsJsonToRes<GetSiteConfigResponse>(msg).data;
274 this.state.siteConfigRes = data;
275 this.state.loading = false;
276 this.state.siteConfigHjson = this.state.siteConfigRes.config_hjson;
277 this.setState(this.state);
278 var textarea: any = document.getElementById(this.siteConfigTextAreaId);
280 } else if (op == UserOperation.LeaveAdmin) {
281 let data = wsJsonToRes<GetSiteResponse>(msg).data;
282 this.state.siteRes.site_view = data.site_view;
283 this.setState(this.state);
284 this.state.leaveAdminTeamLoading = false;
285 toast(i18n.t("left_admin_team"));
286 this.setState(this.state);
287 this.context.router.history.push("/");
288 } else if (op == UserOperation.SaveSiteConfig) {
289 let data = wsJsonToRes<GetSiteConfigResponse>(msg).data;
290 this.state.siteConfigRes = data;
291 this.state.siteConfigHjson = this.state.siteConfigRes.config_hjson;
292 this.state.siteConfigLoading = false;
293 toast(i18n.t("site_saved"));
294 this.setState(this.state);