src/shared/components/post/post-report.tsx

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