Fixing up tagline and ratelimit forms.
This commit is contained in:
parent
27bb9c3d6c
commit
d9553571ff
3 changed files with 56 additions and 111 deletions
|
@ -163,14 +163,24 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
|
|||
{
|
||||
key: "rate_limiting",
|
||||
label: "Rate Limiting",
|
||||
getNode: () => <RateLimitForm onSaveSite={this.handleEditSite} />,
|
||||
getNode: () => (
|
||||
<RateLimitForm
|
||||
rateLimits={
|
||||
this.state.siteRes.site_view.local_site_rate_limit
|
||||
}
|
||||
onSaveSite={this.handleEditSite}
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: "taglines",
|
||||
label: i18n.t("taglines"),
|
||||
getNode: () => (
|
||||
<div className="row">
|
||||
<TaglineForm onSaveSite={this.handleEditSite} />
|
||||
<TaglineForm
|
||||
taglines={this.state.siteRes.taglines}
|
||||
onSaveSite={this.handleEditSite}
|
||||
/>
|
||||
</div>
|
||||
),
|
||||
},
|
||||
|
@ -254,6 +264,11 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
|
|||
const editRes = await apiWrapper(HttpService.client.editSite(form));
|
||||
|
||||
if (editRes.state === "success") {
|
||||
this.setState(s => {
|
||||
s.siteRes.site_view = editRes.data.site_view;
|
||||
s.siteRes.taglines = editRes.data.taglines;
|
||||
return s;
|
||||
});
|
||||
toast(i18n.t("site_saved"));
|
||||
}
|
||||
|
||||
|
|
|
@ -1,8 +1,7 @@
|
|||
import { Component, FormEventHandler, linkEvent } from "inferno";
|
||||
import { EditSite, GetSiteResponse, SiteResponse } from "lemmy-js-client";
|
||||
import { EditSite, LocalSiteRateLimit } from "lemmy-js-client";
|
||||
import { i18n } from "../../i18next";
|
||||
import { RequestState } from "../../services/HttpService";
|
||||
import { capitalizeFirstLetter, myAuthRequired, setIsoData } from "../../utils";
|
||||
import { capitalizeFirstLetter, myAuthRequired } from "../../utils";
|
||||
import { Spinner } from "../common/icon";
|
||||
import Tabs from "../common/tabs";
|
||||
|
||||
|
@ -23,11 +22,11 @@ interface RateLimitsProps {
|
|||
}
|
||||
|
||||
interface RateLimitFormProps {
|
||||
onSaveSite(form: EditSite): Promise<RequestState<SiteResponse>>;
|
||||
rateLimits: LocalSiteRateLimit;
|
||||
onSaveSite(form: EditSite): void;
|
||||
}
|
||||
|
||||
interface RateLimitFormState {
|
||||
siteRes: GetSiteResponse;
|
||||
form: {
|
||||
message?: number;
|
||||
message_per_second?: number;
|
||||
|
@ -105,7 +104,7 @@ function handlePerSecondChange(
|
|||
}));
|
||||
}
|
||||
|
||||
async function submitRateLimitForm(i: RateLimitsForm, event: any) {
|
||||
function submitRateLimitForm(i: RateLimitsForm, event: any) {
|
||||
event.preventDefault();
|
||||
const auth = myAuthRequired();
|
||||
const form: EditSite = Object.entries(i.state.form).reduce(
|
||||
|
@ -115,67 +114,23 @@ async function submitRateLimitForm(i: RateLimitsForm, event: any) {
|
|||
},
|
||||
{
|
||||
auth,
|
||||
application_question:
|
||||
i.state.siteRes.site_view.local_site.application_question,
|
||||
}
|
||||
);
|
||||
|
||||
i.setState({ loading: true });
|
||||
|
||||
const res = await i.props.onSaveSite(form);
|
||||
|
||||
if (res.state === "success") {
|
||||
i.setState(s => ((s.siteRes.site_view = res.data.site_view), s));
|
||||
}
|
||||
|
||||
i.setState({ loading: false });
|
||||
i.props.onSaveSite(form);
|
||||
}
|
||||
|
||||
export default class RateLimitsForm extends Component<
|
||||
RateLimitFormProps,
|
||||
RateLimitFormState
|
||||
> {
|
||||
private isoData = setIsoData(this.context);
|
||||
state: RateLimitFormState = {
|
||||
siteRes: this.isoData.site_res,
|
||||
loading: false,
|
||||
form: {},
|
||||
form: this.props.rateLimits,
|
||||
};
|
||||
constructor(props: RateLimitFormProps, context) {
|
||||
constructor(props: RateLimitFormProps, context: any) {
|
||||
super(props, context);
|
||||
|
||||
const {
|
||||
comment,
|
||||
comment_per_second,
|
||||
image,
|
||||
image_per_second,
|
||||
message,
|
||||
message_per_second,
|
||||
post,
|
||||
post_per_second,
|
||||
register,
|
||||
register_per_second,
|
||||
search,
|
||||
search_per_second,
|
||||
} = this.state.siteRes.site_view.local_site_rate_limit;
|
||||
|
||||
this.state = {
|
||||
...this.state,
|
||||
form: {
|
||||
comment,
|
||||
comment_per_second,
|
||||
image,
|
||||
image_per_second,
|
||||
message,
|
||||
message_per_second,
|
||||
post,
|
||||
post_per_second,
|
||||
register,
|
||||
register_per_second,
|
||||
search,
|
||||
search_per_second,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
|
|
|
@ -1,33 +1,27 @@
|
|||
import { Component, InfernoMouseEvent, linkEvent } from "inferno";
|
||||
import { EditSite, GetSiteResponse, SiteResponse } from "lemmy-js-client";
|
||||
import { EditSite, Tagline } from "lemmy-js-client";
|
||||
import { i18n } from "../../i18next";
|
||||
import { RequestState } from "../../services/HttpService";
|
||||
import { capitalizeFirstLetter, myAuthRequired, setIsoData } from "../../utils";
|
||||
import { capitalizeFirstLetter, myAuthRequired } from "../../utils";
|
||||
import { HtmlTags } from "../common/html-tags";
|
||||
import { Icon, Spinner } from "../common/icon";
|
||||
import { MarkdownTextArea } from "../common/markdown-textarea";
|
||||
|
||||
interface TaglineFormProps {
|
||||
onSaveSite(form: EditSite): Promise<RequestState<SiteResponse>>;
|
||||
taglines: Array<Tagline>;
|
||||
onSaveSite(form: EditSite): void;
|
||||
}
|
||||
|
||||
interface TaglineFormState {
|
||||
siteRes: GetSiteResponse;
|
||||
siteForm: EditSite;
|
||||
taglines: Array<string>;
|
||||
loading: boolean;
|
||||
editingRow?: number;
|
||||
}
|
||||
|
||||
export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
|
||||
private isoData = setIsoData(this.context);
|
||||
state: TaglineFormState = {
|
||||
loading: false,
|
||||
siteRes: this.isoData.site_res,
|
||||
editingRow: undefined,
|
||||
siteForm: {
|
||||
taglines: this.state.siteRes.taglines?.map(x => x.content),
|
||||
auth: "TODO",
|
||||
},
|
||||
taglines: this.props.taglines.map(x => x.content),
|
||||
};
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
|
@ -55,7 +49,7 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
|
|||
<th style="width:121px"></th>
|
||||
</thead>
|
||||
<tbody>
|
||||
{this.state.siteForm.taglines?.map((cv, index) => (
|
||||
{this.state.taglines.map((cv, index) => (
|
||||
<tr key={index}>
|
||||
<td>
|
||||
{this.state.editingRow == index && (
|
||||
|
@ -65,8 +59,8 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
|
|||
this.handleTaglineChange(this, index, s)
|
||||
}
|
||||
hideNavigationWarnings
|
||||
allLanguages={this.state.siteRes.all_languages}
|
||||
siteLanguages={this.state.siteRes.discussion_languages}
|
||||
allLanguages={[]}
|
||||
siteLanguages={[]}
|
||||
/>
|
||||
)}
|
||||
{this.state.editingRow != index && <div>{cv}</div>}
|
||||
|
@ -75,7 +69,7 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
|
|||
<button
|
||||
className="btn btn-link btn-animate text-muted"
|
||||
onClick={linkEvent(
|
||||
{ form: this, index: index },
|
||||
{ i: this, index: index },
|
||||
this.handleEditTaglineClick
|
||||
)}
|
||||
data-tippy-content={i18n.t("edit")}
|
||||
|
@ -87,7 +81,7 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
|
|||
<button
|
||||
className="btn btn-link btn-animate text-muted"
|
||||
onClick={linkEvent(
|
||||
{ form: this, index: index },
|
||||
{ i: this, index: index },
|
||||
this.handleDeleteTaglineClick
|
||||
)}
|
||||
data-tippy-content={i18n.t("delete")}
|
||||
|
@ -132,51 +126,33 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
|
|||
}
|
||||
|
||||
handleTaglineChange(i: TaglineForm, index: number, val: string) {
|
||||
let taglines = i.state.siteForm.taglines;
|
||||
if (taglines) {
|
||||
taglines[index] = val;
|
||||
i.setState(i.state);
|
||||
}
|
||||
const newTaglines = [...i.state.taglines];
|
||||
newTaglines[index] = val;
|
||||
i.setState({ taglines: newTaglines });
|
||||
}
|
||||
|
||||
handleDeleteTaglineClick(
|
||||
props: { form: TaglineForm; index: number },
|
||||
event: any
|
||||
) {
|
||||
handleDeleteTaglineClick(d: { i: TaglineForm; index: number }, event: any) {
|
||||
event.preventDefault();
|
||||
let taglines = props.form.state.siteForm.taglines;
|
||||
if (taglines) {
|
||||
taglines.splice(props.index, 1);
|
||||
props.form.state.siteForm.taglines = undefined;
|
||||
props.form.setState(props.form.state);
|
||||
props.form.state.siteForm.taglines = taglines;
|
||||
props.form.setState({ ...props.form.state, editingRow: undefined });
|
||||
}
|
||||
const newTaglines = [...d.i.state.taglines];
|
||||
newTaglines.splice(d.index, 1);
|
||||
d.i.setState({ taglines: newTaglines, editingRow: undefined });
|
||||
}
|
||||
|
||||
handleEditTaglineClick(
|
||||
props: { form: TaglineForm; index: number },
|
||||
event: any
|
||||
) {
|
||||
handleEditTaglineClick(d: { i: TaglineForm; index: number }, event: any) {
|
||||
event.preventDefault();
|
||||
if (this.state.editingRow == props.index) {
|
||||
props.form.setState({ editingRow: undefined });
|
||||
if (this.state.editingRow == d.index) {
|
||||
d.i.setState({ editingRow: undefined });
|
||||
} else {
|
||||
props.form.setState({ editingRow: props.index });
|
||||
d.i.setState({ editingRow: d.index });
|
||||
}
|
||||
}
|
||||
|
||||
async handleSaveClick(i: TaglineForm) {
|
||||
const auth = myAuthRequired();
|
||||
i.setState(s => ((s.siteForm.auth = auth), s));
|
||||
i.setState({ loading: true });
|
||||
const editRes = await i.props.onSaveSite(i.state.siteForm);
|
||||
|
||||
if (editRes.state === "success") {
|
||||
i.setState(s => ((s.siteRes.site_view = editRes.data.site_view), s));
|
||||
}
|
||||
|
||||
i.setState({ loading: false });
|
||||
i.props.onSaveSite({
|
||||
taglines: i.state.taglines,
|
||||
auth: myAuthRequired(),
|
||||
});
|
||||
}
|
||||
|
||||
handleAddTaglineClick(
|
||||
|
@ -184,13 +160,12 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
|
|||
event: InfernoMouseEvent<HTMLButtonElement>
|
||||
) {
|
||||
event.preventDefault();
|
||||
if (!i.state.siteForm.taglines) {
|
||||
i.state.siteForm.taglines = [];
|
||||
}
|
||||
i.state.siteForm.taglines.push("");
|
||||
const newTaglines = [...i.state.taglines];
|
||||
newTaglines.push("");
|
||||
|
||||
i.setState({
|
||||
...i.state,
|
||||
editingRow: i.state.siteForm.taglines.length - 1,
|
||||
taglines: newTaglines,
|
||||
editingRow: newTaglines.length - 1,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue