Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Admin Settings: Bugfixes #1313

Merged
merged 9 commits into from
Jun 16, 2023
Merged

Admin Settings: Bugfixes #1313

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
b1e952c
move loading state to AdminSettings, pass as prop, tweak margin on so…
alectrocute Jun 15, 2023
f54d3c5
default loading state to false on setup.tsx, add util
alectrocute Jun 15, 2023
2c4ec9e
Merge branch 'main' into admin-settings-bugfixes-and-tlc
alectrocute Jun 15, 2023
f845a3b
rename util to make more sense
alectrocute Jun 15, 2023
83801ba
Merge branch 'admin-settings-bugfixes-and-tlc' of https://github.com/…
alectrocute Jun 15, 2023
5b123d1
Merge branch 'main' into admin-settings-bugfixes-and-tlc
alectrocute Jun 16, 2023
9e9cd65
Merge branch 'main' into admin-settings-bugfixes-and-tlc
alectrocute Jun 16, 2023
3c71c4a
make @dessalines suggested changes
alectrocute Jun 16, 2023
e83955a
Merge branch 'main' into admin-settings-bugfixes-and-tlc
alectrocute Jun 16, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 24 additions & 0 deletions src/shared/components/home/admin-settings.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ interface AdminSettingsState {
instancesRes: RequestState<GetFederatedInstancesResponse>;
bannedRes: RequestState<BannedPersonsResponse>;
leaveAdminTeamRes: RequestState<GetSiteResponse>;
loading: boolean;
themeList: string[];
isIsomorphic: boolean;
}
Expand All @@ -52,6 +53,7 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
bannedRes: { state: "empty" },
instancesRes: { state: "empty" },
leaveAdminTeamRes: { state: "empty" },
loading: false,
themeList: [],
isIsomorphic: false,
};
Expand Down Expand Up @@ -81,6 +83,7 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
bannedRes: { state: "loading" },
instancesRes: { state: "loading" },
themeList: [],
loading: true,
});

const auth = myAuthRequired();
Expand All @@ -95,6 +98,7 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
bannedRes,
instancesRes,
themeList,
loading: false,
});
}

Expand Down Expand Up @@ -156,6 +160,7 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
onSaveSite={this.handleEditSite}
siteRes={this.state.siteRes}
themeList={this.state.themeList}
loading={this.state.loading}
/>
</div>
<div className="col-12 col-md-6">
Expand All @@ -174,6 +179,7 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
this.state.siteRes.site_view.local_site_rate_limit
}
onSaveSite={this.handleEditSite}
loading={this.state.loading}
/>
),
},
Expand All @@ -185,6 +191,7 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
<TaglineForm
taglines={this.state.siteRes.taglines}
onSaveSite={this.handleEditSite}
loading={this.state.loading}
/>
</div>
),
Expand All @@ -198,6 +205,7 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
onCreate={this.handleCreateEmoji}
onDelete={this.handleDeleteEmoji}
onEdit={this.handleEditEmoji}
loading={this.state.loading}
alectrocute marked this conversation as resolved.
Show resolved Hide resolved
/>
</div>
),
Expand Down Expand Up @@ -266,6 +274,8 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
}

async handleEditSite(form: EditSite) {
this.setState({ loading: true });

const editRes = await HttpService.client.editSite(form);

if (editRes.state === "success") {
Expand All @@ -278,6 +288,8 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
toast(i18n.t("site_saved"));
}

this.setState({ loading: false });

return editRes;
}

Expand All @@ -300,23 +312,35 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
}

async handleEditEmoji(form: EditCustomEmoji) {
this.setState({ loading: true });
alectrocute marked this conversation as resolved.
Show resolved Hide resolved

const res = await HttpService.client.editCustomEmoji(form);
if (res.state === "success") {
updateEmojiDataModel(res.data.custom_emoji);
}

this.setState({ loading: false });
}

async handleDeleteEmoji(form: DeleteCustomEmoji) {
this.setState({ loading: true });

const res = await HttpService.client.deleteCustomEmoji(form);
if (res.state === "success") {
removeFromEmojiDataModel(res.data.id);
}

this.setState({ loading: false });
}

async handleCreateEmoji(form: CreateCustomEmoji) {
this.setState({ loading: true });

const res = await HttpService.client.createCustomEmoji(form);
if (res.state === "success") {
updateEmojiDataModel(res.data.custom_emoji);
}

this.setState({ loading: false });
}
}
7 changes: 3 additions & 4 deletions src/shared/components/home/emojis-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,12 @@ interface EmojiFormProps {
onEdit(form: EditCustomEmoji): void;
onCreate(form: CreateCustomEmoji): void;
onDelete(form: DeleteCustomEmoji): void;
loading: boolean;
}

interface EmojiFormState {
siteRes: GetSiteResponse;
customEmojis: CustomEmojiViewForm[];
loading: boolean;
page: number;
}

Expand All @@ -47,7 +47,6 @@ export class EmojiForm extends Component<EmojiFormProps, EmojiFormState> {
private isoData = setIsoData(this.context);
private itemsPerPage = 15;
private emptyState: EmojiFormState = {
loading: false,
siteRes: this.isoData.site_res,
customEmojis: this.isoData.site_res.custom_emojis.map((x, index) => ({
id: x.custom_emoji.id,
Expand Down Expand Up @@ -223,7 +222,7 @@ export class EmojiForm extends Component<EmojiFormProps, EmojiFormState> {
data-tippy-content={i18n.t("save")}
aria-label={i18n.t("save")}
disabled={
this.state.loading ||
this.props.loading ||
!this.canEdit(cv) ||
!cv.changed
}
Expand All @@ -243,7 +242,7 @@ export class EmojiForm extends Component<EmojiFormProps, EmojiFormState> {
)}
data-tippy-content={i18n.t("delete")}
aria-label={i18n.t("delete")}
disabled={this.state.loading}
disabled={this.props.loading}
title={i18n.t("delete")}
>
<Icon
Expand Down
8 changes: 3 additions & 5 deletions src/shared/components/home/rate-limit-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ interface RateLimitsProps {
interface RateLimitFormProps {
rateLimits: LocalSiteRateLimit;
onSaveSite(form: EditSite): void;
loading: boolean;
}

interface RateLimitFormState {
Expand All @@ -41,7 +42,6 @@ interface RateLimitFormState {
register?: number;
register_per_second?: number;
};
loading: boolean;
}

function RateLimits({
Expand Down Expand Up @@ -117,7 +117,6 @@ function submitRateLimitForm(i: RateLimitsForm, event: any) {
}
);

i.setState({ loading: true });
i.props.onSaveSite(form);
}

Expand All @@ -126,7 +125,6 @@ export default class RateLimitsForm extends Component<
RateLimitFormState
> {
state: RateLimitFormState = {
loading: false,
form: this.props.rateLimits,
};
constructor(props: RateLimitFormProps, context: any) {
Expand Down Expand Up @@ -164,9 +162,9 @@ export default class RateLimitsForm extends Component<
<button
type="submit"
className="btn btn-secondary mr-2"
disabled={this.state.loading}
disabled={this.props.loading}
>
{this.state.loading ? (
{this.props.loading ? (
<Spinner />
) : (
capitalizeFirstLetter(i18n.t("save"))
Expand Down
1 change: 1 addition & 0 deletions src/shared/components/home/setup.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,7 @@ export class Setup extends Component<any, State> {
onSaveSite={this.handleCreateSite}
siteRes={this.state.siteRes}
themeList={this.state.themeList}
loading={false}
Copy link
Contributor Author

@alectrocute alectrocute Jun 15, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This can always be false since the route is redirected upon submit of this form.

/>
)}
</div>
Expand Down
38 changes: 22 additions & 16 deletions src/shared/components/home/site-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,11 @@ import {
ListingType,
} from "lemmy-js-client";
import { i18n } from "../../i18next";
import { capitalizeFirstLetter, myAuthRequired } from "../../utils";
import {
capitalizeFirstLetter,
myAuthRequired,
validInstanceTLD,
} from "../../utils";
import { Icon, Spinner } from "../common/icon";
import { ImageUploadForm } from "../common/image-upload-form";
import { LanguageSelect } from "../common/language-select";
Expand All @@ -27,11 +31,11 @@ interface SiteFormProps {
themeList?: string[];
onSaveSite(form: EditSite): void;
siteRes: GetSiteResponse;
loading: boolean;
}

interface SiteFormState {
siteForm: EditSite;
loading: boolean;
instance_select: {
allowed_instances: string;
blocked_instances: string;
Expand All @@ -44,7 +48,6 @@ type InstanceKey = "allowed_instances" | "blocked_instances";
export class SiteForm extends Component<SiteFormProps, SiteFormState> {
state: SiteFormState = {
siteForm: this.initSiteForm(),
loading: false,
instance_select: {
allowed_instances: "",
blocked_instances: "",
Expand Down Expand Up @@ -107,23 +110,21 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {

this.handleDiscussionLanguageChange =
this.handleDiscussionLanguageChange.bind(this);

this.handleAddInstance = this.handleAddInstance.bind(this);
this.handleRemoveInstance = this.handleRemoveInstance.bind(this);

this.handleInstanceEnterPress = this.handleInstanceEnterPress.bind(this);
this.handleInstanceTextChange = this.handleInstanceTextChange.bind(this);
}

// Necessary to stop the loading
componentWillReceiveProps() {
this.setState({ loading: false });
}

render() {
const siteSetup = this.props.siteRes.site_view.local_site.site_setup;
return (
<form onSubmit={linkEvent(this, this.handleSaveSiteSubmit)}>
<NavigationPrompt
when={
!this.state.loading &&
!this.props.loading &&
!siteSetup &&
!!(
this.state.siteForm.name ||
Expand All @@ -136,8 +137,8 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
/>
<h5>{`${
siteSetup
? capitalizeFirstLetter(i18n.t("save"))
: capitalizeFirstLetter(i18n.t("name"))
? capitalizeFirstLetter(i18n.t("edit"))
: capitalizeFirstLetter(i18n.t("setup"))
} ${i18n.t("your_site")}`}</h5>
<div className="form-group row">
<label className="col-12 col-form-label" htmlFor="create-site-name">
Expand All @@ -157,7 +158,7 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
</div>
</div>
<div className="form-group">
<label>{i18n.t("icon")}</label>
<label className="mr-2">{i18n.t("icon")}</label>
<ImageUploadForm
uploadTitle={i18n.t("upload_icon")}
imageSrc={this.state.siteForm.icon}
Expand All @@ -167,7 +168,7 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
/>
</div>
<div className="form-group">
<label>{i18n.t("banner")}</label>
<label className="mr-2">{i18n.t("banner")}</label>
<ImageUploadForm
uploadTitle={i18n.t("upload_banner")}
imageSrc={this.state.siteForm.banner}
Expand Down Expand Up @@ -609,9 +610,9 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
<button
type="submit"
className="btn btn-secondary mr-2"
disabled={this.state.loading}
disabled={this.props.loading}
>
{this.state.loading ? (
{this.props.loading ? (
<Spinner />
) : siteSetup ? (
capitalizeFirstLetter(i18n.t("save"))
Expand Down Expand Up @@ -717,7 +718,7 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
event.preventDefault();
const auth = myAuthRequired();
i.setState(s => ((s.siteForm.auth = auth), s));
i.setState({ loading: true, submitted: true });
i.setState({ submitted: true });

const stateSiteForm = i.state.siteForm;

Expand Down Expand Up @@ -780,6 +781,11 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {

handleAddInstance(key: InstanceKey) {
const instance = this.state.instance_select[key].trim();

if (!validInstanceTLD(instance)) {
return;
}

if (!this.state.siteForm[key]?.includes(instance)) {
this.setState(s => ({
...s,
Expand Down
12 changes: 3 additions & 9 deletions src/shared/components/home/tagline-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,17 +9,16 @@ import { MarkdownTextArea } from "../common/markdown-textarea";
interface TaglineFormProps {
taglines: Array<Tagline>;
onSaveSite(form: EditSite): void;
loading: boolean;
}

interface TaglineFormState {
taglines: Array<string>;
loading: boolean;
editingRow?: number;
}

export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
state: TaglineFormState = {
loading: false,
editingRow: undefined,
taglines: this.props.taglines.map(x => x.content),
};
Expand All @@ -30,10 +29,6 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
return i18n.t("taglines");
}

componentWillReceiveProps() {
this.setState({ loading: false });
}

render() {
return (
<div className="col-12">
Expand Down Expand Up @@ -110,9 +105,9 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
<button
onClick={linkEvent(this, this.handleSaveClick)}
className="btn btn-secondary mr-2"
disabled={this.state.loading}
disabled={this.props.loading}
>
{this.state.loading ? (
{this.props.loading ? (
<Spinner />
) : (
capitalizeFirstLetter(i18n.t("save"))
Expand Down Expand Up @@ -153,7 +148,6 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
}

async handleSaveClick(i: TaglineForm) {
i.setState({ loading: true });
i.props.onSaveSite({
taglines: i.state.taglines,
auth: myAuthRequired(),
Expand Down
Loading