1 import { Component, InfernoNode, linkEvent } from "inferno";
2 import { T } from "inferno-i18next-dess";
4 PrivateMessageReportView,
5 ResolvePrivateMessageReport,
6 } from "lemmy-js-client";
7 import { i18n } from "../../i18next";
8 import { mdToHtml, myAuthRequired } from "../../utils";
9 import { Icon, Spinner } from "../common/icon";
10 import { PersonListing } from "../person/person-listing";
13 report: PrivateMessageReportView;
14 onResolveReport(form: ResolvePrivateMessageReport): void;
21 export class PrivateMessageReport extends Component<Props, State> {
26 constructor(props: any, context: any) {
27 super(props, context);
30 componentWillReceiveProps(
31 nextProps: Readonly<{ children?: InfernoNode } & Props>
33 if (this.props != nextProps) {
34 this.setState({ loading: false });
39 const r = this.props.report;
40 const pmr = r.private_message_report;
41 const tippyContent = i18n.t(
42 r.private_message_report.resolved ? "unresolve_report" : "resolve_report"
46 <div className="private-message-report">
48 {i18n.t("creator")}:{" "}
49 <PersonListing person={r.private_message_creator} />
55 dangerouslySetInnerHTML={mdToHtml(pmr.original_pm_text)}
59 {i18n.t("reporter")}: <PersonListing person={r.creator} />
62 {i18n.t("reason")}: {pmr.reason}
67 <T i18nKey="resolved_by">
69 <PersonListing person={r.resolver} />
72 <T i18nKey="unresolved_by">
74 <PersonListing person={r.resolver} />
80 className="btn btn-link btn-animate text-muted py-0"
81 onClick={linkEvent(this, this.handleResolveReport)}
82 data-tippy-content={tippyContent}
83 aria-label={tippyContent}
85 {this.state.loading ? (
90 classes={`icon-inline ${
91 pmr.resolved ? "text-success" : "text-danger"
100 handleResolveReport(i: PrivateMessageReport) {
101 i.setState({ loading: true });
102 const pmr = i.props.report.private_message_report;
103 i.props.onResolveReport({
105 resolved: !pmr.resolved,
106 auth: myAuthRequired(),