src/shared/components/post/post_report.tsx

   1 import { Component, linkEvent } from "inferno";
   2 import { T } from "inferno-i18next-dess";
   3 import { PostReportView, PostView, ResolvePostReport } from "lemmy-js-client";
   4 import { i18n } from "../../i18next";
   5 import { WebSocketService } from "../../services";
   6 import { authField, wsClient } from "../../utils";
   7 import { Icon } from "../common/icon";
   8 import { PersonListing } from "../person/person-listing";
   9 import { PostListing } from "./post-listing";
  10
  11 interface PostReportProps {
  12   report: PostReportView;
  13 }
  14
  15 export class PostReport extends Component<PostReportProps, any> {
  16   constructor(props: any, context: any) {
  17     super(props, context);
  18   }
  19
  20   render() {
  21     let r = this.props.report;
  22     let post = r.post;
  23
  24     // Set the original post data ( a troll could change it )
  25     post.name = r.post_report.original_post_name;
  26     post.url = r.post_report.original_post_url;
  27     post.body = r.post_report.original_post_body;
  28     let pv: PostView = {
  29       post,
  30       creator: r.post_creator,
  31       community: r.community,
  32       creator_banned_from_community: r.creator_banned_from_community,
  33       counts: r.counts,
  34       subscribed: false,
  35       saved: false,
  36       read: false,
  37       creator_blocked: false,
  38       my_vote: r.my_vote,
  39     };
  40
  41     return (
  42       <div>
  43         <PostListing
  44           post_view={pv}
  45           showCommunity={true}
  46           enableDownvotes={true}
  47           enableNsfw={true}
  48         />
  49         <div>
  50           {i18n.t("reporter")}: <PersonListing person={r.creator} />
  51         </div>
  52         <div>
  53           {i18n.t("reason")}: {r.post_report.reason}
  54         </div>
  55         {r.resolver && (
  56           <div>
  57             {r.post_report.resolved ? (
  58               <T i18nKey="resolved_by">
  59                 #
  60                 <PersonListing person={r.resolver} />
  61               </T>
  62             ) : (
  63               <T i18nKey="unresolved_by">
  64                 #
  65                 <PersonListing person={r.resolver} />
  66               </T>
  67             )}
  68           </div>
  69         )}
  70         <button
  71           className="btn btn-link btn-animate text-muted py-0"
  72           onClick={linkEvent(this, this.handleResolveReport)}
  73           data-tippy-content={
  74             r.post_report.resolved ? "unresolve_report" : "resolve_report"
  75           }
  76           aria-label={
  77             r.post_report.resolved ? "unresolve_report" : "resolve_report"
  78           }
  79         >
  80           <Icon
  81             icon="check"
  82             classes={`icon-inline ${
  83               r.post_report.resolved ? "text-success" : "text-danger"
  84             }`}
  85           />
  86         </button>
  87       </div>
  88     );
  89   }
  90
  91   handleResolveReport(i: PostReport) {
  92     let form: ResolvePostReport = {
  93       report_id: i.props.report.post_report.id,
  94       resolved: !i.props.report.post_report.resolved,
  95       auth: authField(),
  96     };
  97     WebSocketService.Instance.send(wsClient.resolvePostReport(form));
  98   }
  99 }