community_view={res.community_view}
moderators={res.moderators}
admins={site_res.admins}
- online={res.online}
enableNsfw={enableNsfw(site_res)}
editable
allLanguages={site_res.all_languages}
const blockCommunityRes = await HttpService.client.blockCommunity(form);
if (blockCommunityRes.state == "success") {
updateCommunityBlock(blockCommunityRes.data);
+ this.setState(s => {
+ if (s.communityRes.state == "success") {
+ s.communityRes.data.community_view.blocked =
+ blockCommunityRes.data.blocked;
+ }
+ });
}
}
import { Component, InfernoNode, linkEvent } from "inferno";
+import { T } from "inferno-i18next-dess";
import { Link } from "inferno-router";
import {
AddModToCommunity,
allLanguages: Language[];
siteLanguages: number[];
communityLanguages?: number[];
- online: number;
enableNsfw?: boolean;
showIcon?: boolean;
editable?: boolean;
removeCommunityLoading: boolean;
leaveModTeamLoading: boolean;
followCommunityLoading: boolean;
- blockCommunityLoading: boolean;
purgeCommunityLoading: boolean;
}
removeCommunityLoading: false,
leaveModTeamLoading: false,
followCommunityLoading: false,
- blockCommunityLoading: false,
purgeCommunityLoading: false,
};
removeCommunityLoading: false,
leaveModTeamLoading: false,
followCommunityLoading: false,
- blockCommunityLoading: false,
purgeCommunityLoading: false,
});
}
{myUSerInfo && this.blockCommunity()}
{!myUSerInfo && (
<div className="alert alert-info" role="alert">
- {i18n.t("community_not_logged_in_alert", {
- community: name,
- instance: hostname(actor_id),
- })}
+ <T
+ i18nKey="community_not_logged_in_alert"
+ interpolation={{
+ community: name,
+ instance: hostname(actor_id),
+ }}
+ >
+ #<code className="user-select-all">#</code>#
+ </T>
</div>
)}
</div>
const counts = community_view.counts;
return (
<ul className="my-1 list-inline">
- <li className="list-inline-item badge badge-secondary">
- {i18n.t("number_online", {
- count: this.props.online,
- formattedCount: numToSI(this.props.online),
- })}
- </li>
<li
className="list-inline-item badge badge-secondary pointer"
data-tippy-content={i18n.t("active_users_in_the_last_day", {
}
blockCommunity() {
- const community_view = this.props.community_view;
- const blocked = this.props.community_view.blocked;
+ const { subscribed, blocked } = this.props.community_view;
return (
<div className="mb-2">
- {community_view.subscribed == "NotSubscribed" &&
- (blocked ? (
- <button
- className="btn btn-danger btn-block"
- onClick={linkEvent(this, this.handleBlockCommunity)}
- >
- {this.state.blockCommunityLoading ? (
- <Spinner />
- ) : (
- i18n.t("unblock_community")
- )}
- </button>
- ) : (
- <button
- className="btn btn-danger btn-block"
- onClick={linkEvent(this, this.handleBlockCommunity)}
- >
- {this.state.blockCommunityLoading ? (
- <Spinner />
- ) : (
- i18n.t("block_community")
- )}
- </button>
- ))}
+ {subscribed == "NotSubscribed" && (
+ <button
+ className="btn btn-danger btn-block"
+ onClick={linkEvent(this, this.handleBlockCommunity)}
+ >
+ {i18n.t(blocked ? "unblock_community" : "block_community")}
+ </button>
+ )}
</div>
);
}
}
handleBlockCommunity(i: Sidebar) {
- i.setState({ blockCommunityLoading: true });
+ const { community, blocked } = i.props.community_view;
+
i.props.onBlockCommunity({
- community_id: 0,
- block: !i.props.community_view.blocked,
+ community_id: community.id,
+ block: !blocked,
auth: myAuthRequired(),
});
}
instancesRes: RequestState<GetFederatedInstancesResponse>;
bannedRes: RequestState<BannedPersonsResponse>;
leaveAdminTeamRes: RequestState<GetSiteResponse>;
+ emojiLoading: boolean;
+ loading: boolean;
themeList: string[];
isIsomorphic: boolean;
}
bannedRes: { state: "empty" },
instancesRes: { state: "empty" },
leaveAdminTeamRes: { state: "empty" },
+ emojiLoading: false,
+ loading: false,
themeList: [],
isIsomorphic: false,
};
bannedRes: { state: "loading" },
instancesRes: { state: "loading" },
themeList: [],
+ loading: true,
});
const auth = myAuthRequired();
bannedRes,
instancesRes,
themeList,
+ loading: false,
});
}
onSaveSite={this.handleEditSite}
siteRes={this.state.siteRes}
themeList={this.state.themeList}
+ loading={this.state.loading}
/>
</div>
<div className="col-12 col-md-6">
this.state.siteRes.site_view.local_site_rate_limit
}
onSaveSite={this.handleEditSite}
+ loading={this.state.loading}
/>
),
},
<TaglineForm
taglines={this.state.siteRes.taglines}
onSaveSite={this.handleEditSite}
+ loading={this.state.loading}
/>
</div>
),
onCreate={this.handleCreateEmoji}
onDelete={this.handleDeleteEmoji}
onEdit={this.handleEditEmoji}
+ loading={this.state.emojiLoading}
/>
</div>
),
}
async handleEditSite(form: EditSite) {
+ this.setState({ loading: true });
+
const editRes = await HttpService.client.editSite(form);
if (editRes.state === "success") {
toast(i18n.t("site_saved"));
}
+ this.setState({ loading: false });
+
return editRes;
}
}
async handleEditEmoji(form: EditCustomEmoji) {
+ this.setState({ emojiLoading: true });
+
const res = await HttpService.client.editCustomEmoji(form);
if (res.state === "success") {
updateEmojiDataModel(res.data.custom_emoji);
}
+
+ this.setState({ emojiLoading: false });
}
async handleDeleteEmoji(form: DeleteCustomEmoji) {
+ this.setState({ emojiLoading: true });
+
const res = await HttpService.client.deleteCustomEmoji(form);
if (res.state === "success") {
removeFromEmojiDataModel(res.data.id);
}
+
+ this.setState({ emojiLoading: false });
}
async handleCreateEmoji(form: CreateCustomEmoji) {
+ this.setState({ emojiLoading: true });
+
const res = await HttpService.client.createCustomEmoji(form);
if (res.state === "success") {
updateEmojiDataModel(res.data.custom_emoji);
}
+
+ this.setState({ emojiLoading: false });
}
}
onEdit(form: EditCustomEmoji): void;
onCreate(form: CreateCustomEmoji): void;
onDelete(form: DeleteCustomEmoji): void;
+ loading: boolean;
}
interface EmojiFormState {
siteRes: GetSiteResponse;
customEmojis: CustomEmojiViewForm[];
- loading: boolean;
page: number;
}
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,
data-tippy-content={i18n.t("save")}
aria-label={i18n.t("save")}
disabled={
- this.state.loading ||
+ this.props.loading ||
!this.canEdit(cv) ||
!cv.changed
}
)}
data-tippy-content={i18n.t("delete")}
aria-label={i18n.t("delete")}
- disabled={this.state.loading}
+ disabled={this.props.loading}
title={i18n.t("delete")}
>
<Icon
siteRes: {
site_view: { counts, site },
admins,
- online,
},
showSubscribedMobile,
showTrendingMobile,
site={site}
admins={admins}
counts={counts}
- online={online}
showLocal={showLocal(this.isoData)}
/>
)}
siteRes: {
site_view: { counts, site },
admins,
- online,
},
} = this.state;
site={site}
admins={admins}
counts={counts}
- online={online}
showLocal={showLocal(this.isoData)}
/>
{this.hasFollows && (
interface RateLimitFormProps {
rateLimits: LocalSiteRateLimit;
onSaveSite(form: EditSite): void;
+ loading: boolean;
}
interface RateLimitFormState {
register?: number;
register_per_second?: number;
};
- loading: boolean;
}
function RateLimits({
}
);
- i.setState({ loading: true });
i.props.onSaveSite(form);
}
RateLimitFormState
> {
state: RateLimitFormState = {
- loading: false,
form: this.props.rateLimits,
};
constructor(props: RateLimitFormProps, context: any) {
<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"))
onSaveSite={this.handleCreateSite}
siteRes={this.state.siteRes}
themeList={this.state.themeList}
+ loading={false}
/>
)}
</div>
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";
themeList?: string[];
onSaveSite(form: EditSite): void;
siteRes: GetSiteResponse;
+ loading: boolean;
}
interface SiteFormState {
siteForm: EditSite;
- loading: boolean;
instance_select: {
allowed_instances: string;
blocked_instances: string;
export class SiteForm extends Component<SiteFormProps, SiteFormState> {
state: SiteFormState = {
siteForm: this.initSiteForm(),
- loading: false,
instance_select: {
allowed_instances: "",
blocked_instances: "",
slur_filter_regex: ls.slur_filter_regex,
actor_name_max_length: ls.actor_name_max_length,
federation_enabled: ls.federation_enabled,
- federation_debug: ls.federation_debug,
federation_worker_count: ls.federation_worker_count,
captcha_enabled: ls.captcha_enabled,
captcha_difficulty: ls.captcha_difficulty,
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 ||
/>
<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">
</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}
/>
</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}
<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"))
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;
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,
showLocal: boolean;
counts?: SiteAggregates;
admins?: PersonView[];
- online?: number;
}
interface SiteSidebarState {
badges(siteAggregates: SiteAggregates) {
const counts = siteAggregates;
- const online = this.props.online ?? 1;
return (
<ul className="my-2 list-inline">
- <li className="list-inline-item badge badge-secondary">
- {i18n.t("number_online", {
- count: online,
- formattedCount: numToSI(online),
- })}
- </li>
<li
className="list-inline-item badge badge-secondary pointer"
data-tippy-content={i18n.t("active_users_in_the_last_day", {
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),
};
return i18n.t("taglines");
}
- componentWillReceiveProps() {
- this.setState({ loading: false });
- }
-
render() {
return (
<div className="col-12">
<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"))
}
async handleSaveClick(i: TaglineForm) {
- i.setState({ loading: true });
i.props.onSaveSite({
taglines: i.state.taglines,
auth: myAuthRequired(),
fetchCommunities,
fetchThemeList,
fetchUsers,
- getLanguages,
myAuth,
myAuthRequired,
personToChoice,
}
handleInterfaceLangChange(i: Settings, event: any) {
+ const newLang = event.target.value ?? "browser";
+ i18n.changeLanguage(newLang === "browser" ? navigator.languages : newLang);
+
i.setState(
s => ((s.saveUserSettingsForm.interface_language = event.target.value), s)
);
- i18n.changeLanguage(
- getLanguages(i.state.saveUserSettingsForm.interface_language).at(0)
- );
}
handleDiscussionLanguageChange(val: number[]) {
if (res.state === "success") {
const postId = res.data.post_view.post.id;
this.props.history.replace(`/post/${postId}`);
+ } else {
+ this.setState({
+ loading: false,
+ });
}
}
community_view={res.data.community_view}
moderators={res.data.moderators}
admins={this.state.siteRes.admins}
- online={res.data.online}
enableNsfw={enableNsfw(this.state.siteRes)}
showIcon
allLanguages={this.state.siteRes.all_languages}
async handleBlockCommunity(form: BlockCommunity) {
const blockCommunityRes = await HttpService.client.blockCommunity(form);
- // TODO Probably isn't necessary
- this.setState(s => {
- if (
- s.postRes.state == "success" &&
- blockCommunityRes.state == "success"
- ) {
- s.postRes.data.community_view = blockCommunityRes.data.community_view;
- }
- return s;
- });
-
if (blockCommunityRes.state == "success") {
updateCommunityBlock(blockCommunityRes.data);
+ this.setState(s => {
+ if (s.postRes.state == "success") {
+ s.postRes.data.community_view.blocked =
+ blockCommunityRes.data.blocked;
+ }
+ });
}
}