onCancel?(): any;
onUpsertCommunity(form: CreateCommunity | EditCommunity): void;
enableNsfw?: boolean;
- isLoading?: boolean;
+ loading?: boolean;
}
interface CommunityFormState {
render() {
return (
- <form onSubmit={linkEvent(this, this.handleCreateCommunitySubmit)}>
+ <form
+ className="community-form"
+ onSubmit={linkEvent(this, this.handleCreateCommunitySubmit)}
+ >
<NavigationPrompt
when={
- !this.props.isLoading &&
+ !this.props.loading &&
!!(
this.state.form.name ||
this.state.form.title ||
}
/>
{!this.props.community_view && (
- <div className="form-group row">
+ <div className="mb-3 row">
<label
className="col-12 col-sm-2 col-form-label"
htmlFor="community-name"
>
{i18n.t("name")}
<span
- className="position-absolute pointer unselectable ml-2 text-muted"
+ className="position-absolute pointer unselectable ms-2 text-muted"
data-tippy-content={i18n.t("name_explain")}
>
<Icon icon="help-circle" classes="icon-inline" />
</div>
</div>
)}
- <div className="form-group row">
+ <div className="mb-3 row">
<label
className="col-12 col-sm-2 col-form-label"
htmlFor="community-title"
>
{i18n.t("display_name")}
<span
- className="position-absolute pointer unselectable ml-2 text-muted"
+ className="position-absolute pointer unselectable ms-2 text-muted"
data-tippy-content={i18n.t("display_name_explain")}
>
<Icon icon="help-circle" classes="icon-inline" />
/>
</div>
</div>
- <div className="form-group row">
- <label className="col-12 col-sm-2">{i18n.t("icon")}</label>
+ <div className="mb-3 row">
+ <label className="col-12 col-sm-2 col-form-label">
+ {i18n.t("icon")}
+ </label>
<div className="col-12 col-sm-10">
<ImageUploadForm
uploadTitle={i18n.t("upload_icon")}
/>
</div>
</div>
- <div className="form-group row">
- <label className="col-12 col-sm-2">{i18n.t("banner")}</label>
+ <div className="mb-3 row">
+ <label className="col-12 col-sm-2 col-form-label">
+ {i18n.t("banner")}
+ </label>
<div className="col-12 col-sm-10">
<ImageUploadForm
uploadTitle={i18n.t("upload_banner")}
/>
</div>
</div>
- <div className="form-group row">
+ <div className="mb-3 row">
<label className="col-12 col-sm-2 col-form-label" htmlFor={this.id}>
{i18n.t("sidebar")}
</label>
</div>
{this.props.enableNsfw && (
- <div className="form-group row">
+ <div className="mb-3 row">
<legend className="col-form-label col-sm-2 pt-0">
{i18n.t("nsfw")}
</legend>
</div>
</div>
)}
- <div className="form-group row">
+ <div className="mb-3 row">
<legend className="col-form-label col-6 pt-0">
{i18n.t("only_mods_can_post_in_community")}
</legend>
multiple={true}
onChange={this.handleDiscussionLanguageChange}
/>
- <div className="form-group row">
+ <div className="mb-3 row">
<div className="col-12">
<button
type="submit"
- className="btn btn-secondary mr-2"
- disabled={this.props.isLoading}
+ className="btn btn-secondary me-2"
+ disabled={this.props.loading}
>
- {this.props.isLoading ? (
+ {this.props.loading ? (
<Spinner />
) : this.props.community_view ? (
capitalizeFirstLetter(i18n.t("save"))