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