amAdmin,
amMod,
auth,
- choicesConfig,
+ choicesModLogConfig,
+ debounce,
fetchLimit,
+ fetchUsers,
isBrowser,
setIsoData,
toast,
import { Paginator } from "./common/paginator";
import { CommunityLink } from "./community/community-link";
import { PersonListing } from "./person/person-listing";
-
- enum ModlogEnum {
- ModRemovePost,
- ModLockPost,
- ModStickyPost,
- ModRemoveComment,
- ModRemoveCommunity,
- ModBanFromCommunity,
- ModAddCommunity,
- ModTransferCommunity,
- ModAdd,
- ModBan,
- AdminPurgePerson,
- AdminPurgeCommunity,
- AdminPurgePost,
- AdminPurgeComment,
- }
-
type ModlogType = {
id: number;
- type_: ModlogEnum;
- moderator: PersonSafe;
+ type_: ModlogActionType;
+ moderator: Option<PersonSafe>;
view:
- | ModRemovePostView
- | ModLockPostView
- | ModStickyPostView
- | ModRemoveCommentView
- | ModRemoveCommunityView
- | ModBanFromCommunityView
- | ModBanView
- | ModAddCommunityView
- | ModTransferCommunityView
- | ModAddView
- | AdminPurgePersonView
- | AdminPurgeCommunityView
- | AdminPurgePostView
- | AdminPurgeCommentView;
+ | ModRemovePostView
+ | ModLockPostView
+ | ModStickyPostView
+ | ModRemoveCommentView
+ | ModRemoveCommunityView
+ | ModBanFromCommunityView
+ | ModBanView
+ | ModAddCommunityView
+ | ModTransferCommunityView
+ | ModAddView
+ | AdminPurgePersonView
+ | AdminPurgeCommunityView
+ | AdminPurgePostView
+ | AdminPurgeCommentView;
when_: string;
};
+ var Choices: any;
+ if (isBrowser()) {
+ Choices = require("choices.js");
+ }
interface ModlogState {
res: Option<GetModlogResponse>;
communityId: Option<number>;
communityMods: Option<CommunityModeratorView[]>;
- communityName: Option<string>,
++ communityName: Option<string>;
page: number;
siteRes: GetSiteResponse;
loading: boolean;
- filter_action: ModlogActionType,
- filter_user: Option<number>,
- filter_mod: Option<number>,
++ filter_action: ModlogActionType;
++ filter_user: Option<number>;
++ filter_mod: Option<number>;
}
export class Modlog extends Component<any, ModlogState> {
);
}
- modOrAdminText(person: PersonSafe): string {
- if (
- this.isoData.site_res.admins.map(a => a.person.id).includes(person.id)
- ) {
- return i18n.t("admin");
- } else {
- return i18n.t("mod");
- }
+ modOrAdminText(person: Option<PersonSafe>): string {
+ return person.match({
- some: res => this.isoData.site_res.admins.map(a => a.person.id).includes(res.id) ? i18n.t("admin") : i18n.t("mod"),
++ some: res =>
++ this.isoData.site_res.admins.map(a => a.person.id).includes(res.id)
++ ? i18n.t("admin")
++ : i18n.t("mod"),
+ none: i18n.t("mod"),
+ });
}
get documentTitle(): string {
</h5>
) : (
<div>
- <div class="table-responsive">
- <table id="modlog_table" class="table table-sm table-hover">
- <thead class="pointer">
+ <h5>
- {
- this.state.communityName.match({
++ {this.state.communityName.match({
+ some: name => (
- <Link
- className="text-body"
- to={`/c/${name}`}
- >
++ <Link className="text-body" to={`/c/${name}`}>
+ /c/{name}{" "}
+ </Link>
+ ),
+ none: <></>,
- })
- }
++ })}
+ <span>{i18n.t("modlog")}</span>
+ </h5>
+ <form className="form-inline mr-2">
+ <select
+ value={this.state.filter_action}
+ onChange={linkEvent(this, this.handleFilterActionChange)}
+ className="custom-select col-4 mb-2"
- aria-label="action">
- <option disabled aria-hidden="true">{i18n.t("filter_by_action")}</option>
++ aria-label="action"
++ >
++ <option disabled aria-hidden="true">
++ {i18n.t("filter_by_action")}
++ </option>
+ <option value={ModlogActionType.All}>{i18n.t("all")}</option>
- <option value={ModlogActionType.ModRemovePost}>Removing Posts</option>
- <option value={ModlogActionType.ModLockPost}>Locking Posts</option>
- <option value={ModlogActionType.ModStickyPost}>Stickying Posts</option>
- <option value={ModlogActionType.ModRemoveComment}>Removing Comments</option>
- <option value={ModlogActionType.ModRemoveCommunity}>Removing Communities</option>
- <option value={ModlogActionType.ModBanFromCommunity}>Banning From Communities</option>
- <option value={ModlogActionType.ModAddCommunity}>Adding Mod to Community</option>
- <option value={ModlogActionType.ModTransferCommunity}>Transfering Communities</option>
- <option value={ModlogActionType.ModAdd}>Adding Mod to Site</option>
- <option value={ModlogActionType.ModBan}>Banning From Site</option>
++ <option value={ModlogActionType.ModRemovePost}>
++ Removing Posts
++ </option>
++ <option value={ModlogActionType.ModLockPost}>
++ Locking Posts
++ </option>
++ <option value={ModlogActionType.ModStickyPost}>
++ Stickying Posts
++ </option>
++ <option value={ModlogActionType.ModRemoveComment}>
++ Removing Comments
++ </option>
++ <option value={ModlogActionType.ModRemoveCommunity}>
++ Removing Communities
++ </option>
++ <option value={ModlogActionType.ModBanFromCommunity}>
++ Banning From Communities
++ </option>
++ <option value={ModlogActionType.ModAddCommunity}>
++ Adding Mod to Community
++ </option>
++ <option value={ModlogActionType.ModTransferCommunity}>
++ Transfering Communities
++ </option>
++ <option value={ModlogActionType.ModAdd}>
++ Adding Mod to Site
++ </option>
++ <option value={ModlogActionType.ModBan}>
++ Banning From Site
++ </option>
+ </select>
- {
- this.state.siteRes.site_view.match({
- some: site_view => !site_view.site.hide_modlog_mod_names.unwrapOr(false) && (
++ {this.state.siteRes.site_view.match({
++ some: site_view =>
++ !site_view.site.hide_modlog_mod_names.unwrapOr(false) && (
+ <select
+ id="filter-mod"
- value={toUndefined(this.state.filter_mod)}>
++ value={toUndefined(this.state.filter_mod)}
++ >
+ <option>{i18n.t("filter_by_mod")}</option>
+ </select>
+ ),
- none: <></>,
- })
- }
++ none: <></>,
++ })}
+ <select
+ id="filter-user"
- value={toUndefined(this.state.filter_user)}>
++ value={toUndefined(this.state.filter_user)}
++ >
+ <option>{i18n.t("filter_by_user")}</option>
- </select>
++ </select>
+ </form>
+ <div className="table-responsive">
+ <table id="modlog_table" className="table table-sm table-hover">
+ <thead className="pointer">
<tr>
<th> {i18n.t("time")}</th>
<th>{i18n.t("mod")}</th>
});
}
- users.map(u => {return {
- value: u.person.id.toString(),
- label: u.person.name,
- }}),
+ setupUserFilter() {
+ if (isBrowser()) {
+ let selectId: any = document.getElementById("filter-user");
+ if (selectId) {
+ this.userChoices = new Choices(selectId, choicesModLogConfig);
+ this.userChoices.passedElement.element.addEventListener(
+ "choice",
+ (e: any) => {
+ this.state.filter_user = Some(Number(e.detail.choice.value));
+ this.setState(this.state);
+ this.refetch();
+ },
+ false
+ );
+ this.userChoices.passedElement.element.addEventListener(
+ "search",
+ debounce(async (e: any) => {
+ try {
+ let users = (await fetchUsers(e.detail.value)).users;
+ this.userChoices.setChoices(
- mods.map(u => {return {
- value: u.person.id.toString(),
- label: u.person.name,
- }}),
++ users.map(u => {
++ return {
++ value: u.person.id.toString(),
++ label: u.person.name,
++ };
++ }),
+ "value",
+ "label",
+ true
+ );
+ } catch (err) {
+ console.log(err);
+ }
+ }),
+ false
+ );
+ }
+ }
+ }
+
+ setupModFilter() {
+ if (isBrowser()) {
+ let selectId: any = document.getElementById("filter-mod");
+ if (selectId) {
+ this.modChoices = new Choices(selectId, choicesModLogConfig);
+ this.modChoices.passedElement.element.addEventListener(
+ "choice",
+ (e: any) => {
+ this.state.filter_mod = Some(Number(e.detail.choice.value));
+ this.setState(this.state);
+ this.refetch();
+ },
+ false
+ );
+ this.modChoices.passedElement.element.addEventListener(
+ "search",
+ debounce(async (e: any) => {
+ try {
+ let mods = (await fetchUsers(e.detail.value)).users;
+ this.modChoices.setChoices(
++ mods.map(u => {
++ return {
++ value: u.person.id.toString(),
++ label: u.person.name,
++ };
++ }),
+ "value",
+ "label",
+ true
+ );
+ } catch (err) {
+ console.log(err);
+ }
+ }),
+ false
+ );
+ }
+ }
+ }
+
static fetchInitialData(req: InitialFetchRequest): Promise<any>[] {
let pathSplit = req.path.split("/");
let communityId = Some(pathSplit[3]).map(Number);
community_id: communityId,
mod_person_id: None,
auth: req.auth,
- other_person_id: None
+ type_: ModlogActionType.All,
++ other_person_id: None,
});
promises.push(req.client.getModlog(modlogForm));
},
};
- containerInner: "choices__inner bg-secondary border-0 py-0 modlog-choices-font-size",
+ export const choicesModLogConfig = {
+ shouldSort: false,
+ searchResultLimit: fetchLimit,
+ classNames: {
+ containerOuter: "choices mb-2 custom-select col-4 px-0",
++ containerInner:
++ "choices__inner bg-secondary border-0 py-0 modlog-choices-font-size",
+ input: "form-control",
+ inputCloned: "choices__input--cloned w-100",
+ list: "choices__list",
+ listItems: "choices__list--multiple",
+ listSingle: "choices__list--single py-0",
+ listDropdown: "choices__list--dropdown",
+ item: "choices__item bg-secondary",
+ itemSelectable: "choices__item--selectable",
+ itemDisabled: "choices__item--disabled",
+ itemChoice: "choices__item--choice",
+ placeholder: "choices__placeholder",
+ group: "choices__group",
+ groupHeading: "choices__heading",
+ button: "choices__button",
+ activeState: "is-active",
+ focusState: "is-focused",
+ openState: "is-open",
+ disabledState: "is-disabled",
+ highlightedState: "text-info",
+ selectedState: "text-info",
+ flippedState: "is-flipped",
+ loadingState: "is-loading",
+ noResults: "has-no-results",
+ noChoices: "has-no-choices",
+ },
+ };
+
export function communitySelectName(cv: CommunityView): string {
return cv.community.local
? cv.community.title