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

   1 import { Component, InfernoNode, 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 { myAuthRequired } from "../../utils";
   6 import { Icon, Spinner } from "../common/icon";
   7 import { PersonListing } from "../person/person-listing";
   8 import { PostListing } from "./post-listing";
   9
  10 interface PostReportProps {
  11   report: PostReportView;
  12   onResolveReport(form: ResolvePostReport): void;
  13 }
  14
  15 interface PostReportState {
  16   loading: boolean;
  17 }
  18
  19 export class PostReport extends Component<PostReportProps, PostReportState> {
  20   state: PostReportState = {
  21     loading: false,
  22   };
  23
  24   constructor(props: any, context: any) {
  25     super(props, context);
  26   }
  27
  28   componentWillReceiveProps(
  29     nextProps: Readonly<{ children?: InfernoNode } & PostReportProps>
  30   ): void {
  31     if (this.props != nextProps) {
  32       this.setState({ loading: false });
  33     }
  34   }
  35
  36   render() {
  37     const r = this.props.report;
  38     const resolver = r.resolver;
  39     const post = r.post;
  40     const tippyContent = i18n.t(
  41       r.post_report.resolved ? "unresolve_report" : "resolve_report"
  42     );
  43
  44     // Set the original post data ( a troll could change it )
  45     post.name = r.post_report.original_post_name;
  46     post.url = r.post_report.original_post_url;
  47     post.body = r.post_report.original_post_body;
  48     const pv: PostView = {
  49       post,
  50       creator: r.post_creator,
  51       community: r.community,
  52       creator_banned_from_community: r.creator_banned_from_community,
  53       counts: r.counts,
  54       subscribed: "NotSubscribed",
  55       saved: false,
  56       read: false,
  57       creator_blocked: false,
  58       my_vote: r.my_vote,
  59       unread_comments: 0,
  60     };
  61
  62     return (
  63       <div>
  64         <PostListing
  65           post_view={pv}
  66           showCommunity={true}
  67           enableDownvotes={true}
  68           enableNsfw={true}
  69           viewOnly={true}
  70           allLanguages={[]}
  71           siteLanguages={[]}
  72           hideImage
  73           // All of these are unused, since its view only
  74           onPostEdit={() => {}}
  75           onPostVote={() => {}}
  76           onPostReport={() => {}}
  77           onBlockPerson={() => {}}
  78           onLockPost={() => {}}
  79           onDeletePost={() => {}}
  80           onRemovePost={() => {}}
  81           onSavePost={() => {}}
  82           onFeaturePost={() => {}}
  83           onPurgePerson={() => {}}
  84           onPurgePost={() => {}}
  85           onBanPersonFromCommunity={() => {}}
  86           onBanPerson={() => {}}
  87           onAddModToCommunity={() => {}}
  88           onAddAdmin={() => {}}
  89           onTransferCommunity={() => {}}
  90         />
  91         <div>
  92           {i18n.t("reporter")}: <PersonListing person={r.creator} />
  93         </div>
  94         <div>
  95           {i18n.t("reason")}: {r.post_report.reason}
  96         </div>
  97         {resolver && (
  98           <div>
  99             {r.post_report.resolved ? (
 100               <T i18nKey="resolved_by">
 101                 #
 102                 <PersonListing person={resolver} />
 103               </T>
 104             ) : (
 105               <T i18nKey="unresolved_by">
 106                 #
 107                 <PersonListing person={resolver} />
 108               </T>
 109             )}
 110           </div>
 111         )}
 112         <button
 113           className="btn btn-link btn-animate text-muted py-0"
 114           onClick={linkEvent(this, this.handleResolveReport)}
 115           data-tippy-content={tippyContent}
 116           aria-label={tippyContent}
 117         >
 118           {this.state.loading ? (
 119             <Spinner />
 120           ) : (
 121             <Icon
 122               icon="check"
 123               classes={`icon-inline ${
 124                 r.post_report.resolved ? "text-success" : "text-danger"
 125               }`}
 126             />
 127           )}
 128         </button>
 129       </div>
 130     );
 131   }
 132
 133   handleResolveReport(i: PostReport) {
 134     i.setState({ loading: true });
 135     i.props.onResolveReport({
 136       report_id: i.props.report.post_report.id,
 137       resolved: !i.props.report.post_report.resolved,
 138       auth: myAuthRequired(),
 139     });
 140   }
 141 }