GetModlog,
GetModlogResponse,
GetPersonDetails,
+ GetPersonDetailsResponse,
ModAddCommunityView,
ModAddView,
ModBanFromCommunityView,
import {
Choice,
QueryParams,
+ RouteDataResponse,
amAdmin,
amMod,
debounce,
| AdminPurgePostView
| AdminPurgeCommentView;
+type ModlogData = RouteDataResponse<{
+ res: GetModlogResponse;
+ communityRes: GetCommunityResponse;
+ modUserResponse: GetPersonDetailsResponse;
+ userResponse: GetPersonDetailsResponse;
+}>;
+
interface ModlogType {
id: number;
type_: ModlogActionType;
options: Choice[];
loading: boolean;
}) => (
- <div className="col-sm-6 form-group">
- <label className="col-form-label" htmlFor={`filter-${filterType}`}>
+ <div className="col-sm-6 mb-3">
+ <label className="mb-2" htmlFor={`filter-${filterType}`}>
{i18n.t(`filter_by_${filterType}` as NoOptionI18nKeys)}
</label>
<SearchableSelect
RouteComponentProps<{ communityId?: string }>,
ModlogState
> {
- private isoData = setIsoData(this.context);
+ private isoData = setIsoData<ModlogData>(this.context);
state: ModlogState = {
res: { state: "empty" },
// Only fetch the data if coming from another route
if (FirstLoadService.isFirstLoad) {
- const [res, communityRes, filteredModRes, filteredUserRes] =
+ const { res, communityRes, modUserResponse, userResponse } =
this.isoData.routeData;
+
this.state = {
...this.state,
res,
communityRes,
};
- if (filteredModRes.state === "success") {
+ if (modUserResponse.state === "success") {
this.state = {
...this.state,
- modSearchOptions: [personToChoice(filteredModRes.data.person_view)],
+ modSearchOptions: [personToChoice(modUserResponse.data.person_view)],
};
}
- if (filteredUserRes.state === "success") {
+ if (userResponse.state === "success") {
this.state = {
...this.state,
- userSearchOptions: [personToChoice(filteredUserRes.data.person_view)],
+ userSearchOptions: [personToChoice(userResponse.data.person_view)],
};
}
}
const { actionType, modId, userId } = getModlogQueryParams();
return (
- <div className="container-lg">
+ <div className="modlog container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}
<Icon
icon="alert-triangle"
inline
- classes="mr-sm-2 mx-auto d-sm-inline d-block"
+ classes="me-sm-2 mx-auto d-sm-inline d-block"
/>
<T i18nKey="modlog_content_warning" class="d-inline">
#<strong>#</strong>#
<span>{i18n.t("modlog")}</span>
</h5>
)}
- <div className="form-row">
- <select
- value={actionType}
- onChange={linkEvent(this, this.handleFilterActionChange)}
- className="custom-select col-sm-6"
- aria-label="action"
- >
- <option disabled aria-hidden="true">
- {i18n.t("filter_by_action")}
- </option>
- <option value={"All"}>{i18n.t("all")}</option>
- <option value={"ModRemovePost"}>Removing Posts</option>
- <option value={"ModLockPost"}>Locking Posts</option>
- <option value={"ModFeaturePost"}>Featuring Posts</option>
- <option value={"ModRemoveComment"}>Removing Comments</option>
- <option value={"ModRemoveCommunity"}>Removing Communities</option>
- <option value={"ModBanFromCommunity"}>
- Banning From Communities
- </option>
- <option value={"ModAddCommunity"}>Adding Mod to Community</option>
- <option value={"ModTransferCommunity"}>
- Transferring Communities
- </option>
- <option value={"ModAdd"}>Adding Mod to Site</option>
- <option value={"ModBan"}>Banning From Site</option>
- </select>
+ <div className="row mb-2">
+ <div className="col-sm-6">
+ <select
+ value={actionType}
+ onChange={linkEvent(this, this.handleFilterActionChange)}
+ className="form-select"
+ aria-label="action"
+ >
+ <option disabled aria-hidden="true">
+ {i18n.t("filter_by_action")}
+ </option>
+ <option value={"All"}>{i18n.t("all")}</option>
+ <option value={"ModRemovePost"}>Removing Posts</option>
+ <option value={"ModLockPost"}>Locking Posts</option>
+ <option value={"ModFeaturePost"}>Featuring Posts</option>
+ <option value={"ModRemoveComment"}>Removing Comments</option>
+ <option value={"ModRemoveCommunity"}>
+ Removing Communities
+ </option>
+ <option value={"ModBanFromCommunity"}>
+ Banning From Communities
+ </option>
+ <option value={"ModAddCommunity"}>
+ Adding Mod to Community
+ </option>
+ <option value={"ModTransferCommunity"}>
+ Transferring Communities
+ </option>
+ <option value={"ModAdd"}>Adding Mod to Site</option>
+ <option value={"ModBan"}>Banning From Site</option>
+ </select>
+ </div>
</div>
- <div className="form-row mb-2">
+ <div className="row mb-2">
<Filter
filterType="user"
onChange={this.handleUserChange}
}
}
- static fetchInitialData({
+ static async fetchInitialData({
client,
path,
query: { modId: urlModId, page, userId: urlUserId, actionType },
auth,
site,
- }: InitialFetchRequest<QueryParams<ModlogProps>>): Promise<
- RequestState<any>
- >[] {
+ }: InitialFetchRequest<QueryParams<ModlogProps>>): Promise<ModlogData> {
const pathSplit = path.split("/");
- const promises: Promise<RequestState<any>>[] = [];
const communityId = getIdFromString(pathSplit[2]);
const modId = !site.site_view.local_site.hide_modlog_mod_names
? getIdFromString(urlModId)
auth,
};
- promises.push(client.getModlog(modlogForm));
+ let communityResponse: RequestState<GetCommunityResponse> = {
+ state: "empty",
+ };
if (communityId) {
const communityForm: GetCommunity = {
id: communityId,
auth,
};
- promises.push(client.getCommunity(communityForm));
- } else {
- promises.push(Promise.resolve({ state: "empty" }));
+
+ communityResponse = await client.getCommunity(communityForm);
}
+ let modUserResponse: RequestState<GetPersonDetailsResponse> = {
+ state: "empty",
+ };
+
if (modId) {
const getPersonForm: GetPersonDetails = {
person_id: modId,
auth,
};
- promises.push(client.getPersonDetails(getPersonForm));
- } else {
- promises.push(Promise.resolve({ state: "empty" }));
+ modUserResponse = await client.getPersonDetails(getPersonForm);
}
+ let userResponse: RequestState<GetPersonDetailsResponse> = {
+ state: "empty",
+ };
+
if (userId) {
const getPersonForm: GetPersonDetails = {
person_id: userId,
auth,
};
- promises.push(client.getPersonDetails(getPersonForm));
- } else {
- promises.push(Promise.resolve({ state: "empty" }));
+ userResponse = await client.getPersonDetails(getPersonForm);
}
- return promises;
+ return {
+ res: await client.getModlog(modlogForm),
+ communityRes: communityResponse,
+ modUserResponse,
+ userResponse,
+ };
}
}