fedi/lemmy-ui
1
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-12-29 12:04:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

handle loading state on community-form.tsx

Browse source
This commit is contained in:
Alec Armbruster 2023-06-14 09:32:25 -04:00
parent 2b1af707c3
commit b076427e8d
No known key found for this signature in database
GPG key ID: 0BE3206ADE0F3B3B
2 changed files with 13 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/shared/components/community/community-form.tsx
View file

@ -21,6 +21,7 @@ interface CommunityFormProps {
onCancel?(): any; onCancel?(): any;
onUpsertCommunity(form: CreateCommunity | EditCommunity): void; onUpsertCommunity(form: CreateCommunity | EditCommunity): void;
enableNsfw?: boolean; enableNsfw?: boolean;
isLoading?: boolean;
} }
interface CommunityFormState { interface CommunityFormState {
@ -34,7 +35,6 @@ interface CommunityFormState {
posting_restricted_to_mods?: boolean; posting_restricted_to_mods?: boolean;
discussion_languages?: number[]; discussion_languages?: number[];
}; };
loading: boolean;
submitted: boolean; submitted: boolean;
} }
@ -46,7 +46,6 @@ export class CommunityForm extends Component<
state: CommunityFormState = { state: CommunityFormState = {
form: {}, form: {},
loading: false,
submitted: false, submitted: false,
}; };
@ -80,7 +79,6 @@ export class CommunityForm extends Component<
posting_restricted_to_mods: cv.community.posting_restricted_to_mods, posting_restricted_to_mods: cv.community.posting_restricted_to_mods,
discussion_languages: this.props.communityLanguages, discussion_languages: this.props.communityLanguages,
}, },
loading: false,
}; };
} }
} }
@ -90,7 +88,7 @@ export class CommunityForm extends Component<
<form onSubmit={linkEvent(this, this.handleCreateCommunitySubmit)}> <form onSubmit={linkEvent(this, this.handleCreateCommunitySubmit)}>
<NavigationPrompt <NavigationPrompt
when={ when={
!this.state.loading && !this.props.isLoading &&
!!( !!(
this.state.form.name || this.state.form.name ||
this.state.form.title || this.state.form.title ||
@ -243,9 +241,9 @@ export class CommunityForm extends Component<
<button <button
type="submit" type="submit"
className="btn btn-secondary mr-2" className="btn btn-secondary mr-2"
disabled={this.state.loading} disabled={this.props.isLoading}
> >
{this.state.loading ? ( {this.props.isLoading ? (
<Spinner /> <Spinner />
) : this.props.community_view ? ( ) : this.props.community_view ? (
capitalizeFirstLetter(i18n.t("save")) capitalizeFirstLetter(i18n.t("save"))
@ -270,7 +268,7 @@ export class CommunityForm extends Component<
handleCreateCommunitySubmit(i: CommunityForm, event: any) { handleCreateCommunitySubmit(i: CommunityForm, event: any) {
event.preventDefault(); event.preventDefault();
i.setState({ loading: true, submitted: true }); i.setState({ submitted: true });
const cForm = i.state.form; const cForm = i.state.form;
const auth = myAuthRequired(); const auth = myAuthRequired();

8
src/shared/components/community/create-community.tsx
View file

@ -11,12 +11,14 @@ import { CommunityForm } from "./community-form";
interface CreateCommunityState { interface CreateCommunityState {
siteRes: GetSiteResponse; siteRes: GetSiteResponse;
loading: boolean;
} }
export class CreateCommunity extends Component<any, CreateCommunityState> { export class CreateCommunity extends Component<any, CreateCommunityState> {
private isoData = setIsoData(this.context); private isoData = setIsoData(this.context);
state: CreateCommunityState = { state: CreateCommunityState = {
siteRes: this.isoData.site_res, siteRes: this.isoData.site_res,
loading: false,
}; };
constructor(props: any, context: any) { constructor(props: any, context: any) {
super(props, context); super(props, context);
@ -45,6 +47,7 @@ export class CreateCommunity extends Component<any, CreateCommunityState> {
allLanguages={this.state.siteRes.all_languages} allLanguages={this.state.siteRes.all_languages}
siteLanguages={this.state.siteRes.discussion_languages} siteLanguages={this.state.siteRes.discussion_languages}
communityLanguages={this.state.siteRes.discussion_languages} communityLanguages={this.state.siteRes.discussion_languages}
isLoading={this.state.loading}
/> />
</div> </div>
</div> </div>
@ -53,10 +56,15 @@ export class CreateCommunity extends Component<any, CreateCommunityState> {
} }
async handleCommunityCreate(form: CreateCommunityI) { async handleCommunityCreate(form: CreateCommunityI) {
this.setState({ loading: true });
const res = await HttpService.client.createCommunity(form); const res = await HttpService.client.createCommunity(form);
if (res.state === "success") { if (res.state === "success") {
const name = res.data.community_view.community.name; const name = res.data.community_view.community.name;
this.props.history.replace(`/c/${name}`); this.props.history.replace(`/c/${name}`);
} else {
this.setState({ loading: false });
} }
} }
} }