client/src/app/shared/shared-abuse-list/abuse-list-table.component.ts

   1 import * as debug from 'debug'
   2 import truncate from 'lodash-es/truncate'
   3 import { SortMeta } from 'primeng/api'
   4 import { buildVideoLink, buildVideoOrPlaylistEmbed } from 'src/assets/player/utils'
   5 import { environment } from 'src/environments/environment'
   6 import { Component, Input, OnInit, ViewChild } from '@angular/core'
   7 import { DomSanitizer } from '@angular/platform-browser'
   8 import { ActivatedRoute, Router } from '@angular/router'
   9 import { ConfirmService, MarkdownService, Notifier, RestPagination, RestTable } from '@app/core'
  10 import { Account, Actor, DropdownAction, Video, VideoService } from '@app/shared/shared-main'
  11 import { AbuseService, BlocklistService, VideoBlockService } from '@app/shared/shared-moderation'
  12 import { VideoCommentService } from '@app/shared/shared-video-comment'
  13 import { AbuseState, AdminAbuse } from '@shared/models'
  14 import { AdvancedInputFilter } from '../shared-forms'
  15 import { AbuseMessageModalComponent } from './abuse-message-modal.component'
  16 import { ModerationCommentModalComponent } from './moderation-comment-modal.component'
  17 import { ProcessedAbuse } from './processed-abuse.model'
  18
  19 const logger = debug('peertube:moderation:AbuseListTableComponent')
  20
  21 @Component({
  22   selector: 'my-abuse-list-table',
  23   templateUrl: './abuse-list-table.component.html',
  24   styleUrls: [ '../shared-moderation/moderation.scss', './abuse-list-table.component.scss' ]
  25 })
  26 export class AbuseListTableComponent extends RestTable implements OnInit {
  27   @Input() viewType: 'admin' | 'user'
  28
  29   @ViewChild('abuseMessagesModal', { static: true }) abuseMessagesModal: AbuseMessageModalComponent
  30   @ViewChild('moderationCommentModal', { static: true }) moderationCommentModal: ModerationCommentModalComponent
  31
  32   abuses: ProcessedAbuse[] = []
  33   totalRecords = 0
  34   sort: SortMeta = { field: 'createdAt', order: 1 }
  35   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
  36
  37   abuseActions: DropdownAction<ProcessedAbuse>[][] = []
  38
  39   inputFilters: AdvancedInputFilter[] = [
  40     {
  41       queryParams: { 'search': 'state:pending' },
  42       label: $localize`Unsolved reports`
  43     },
  44     {
  45       queryParams: { 'search': 'state:accepted' },
  46       label: $localize`Accepted reports`
  47     },
  48     {
  49       queryParams: { 'search': 'state:rejected' },
  50       label: $localize`Refused reports`
  51     },
  52     {
  53       queryParams: { 'search': 'videoIs:blacklisted' },
  54       label: $localize`Reports with blocked videos`
  55     },
  56     {
  57       queryParams: { 'search': 'videoIs:deleted' },
  58       label: $localize`Reports with deleted videos`
  59     }
  60   ]
  61
  62   constructor (
  63     protected route: ActivatedRoute,
  64     protected router: Router,
  65     private notifier: Notifier,
  66     private abuseService: AbuseService,
  67     private blocklistService: BlocklistService,
  68     private commentService: VideoCommentService,
  69     private videoService: VideoService,
  70     private videoBlocklistService: VideoBlockService,
  71     private confirmService: ConfirmService,
  72     private markdownRenderer: MarkdownService,
  73     private sanitizer: DomSanitizer
  74   ) {
  75     super()
  76   }
  77
  78   ngOnInit () {
  79     this.abuseActions = [
  80       this.buildInternalActions(),
  81
  82       this.buildFlaggedAccountActions(),
  83
  84       this.buildCommentActions(),
  85
  86       this.buildVideoActions(),
  87
  88       this.buildAccountActions()
  89     ]
  90
  91     this.initialize()
  92   }
  93
  94   isAdminView () {
  95     return this.viewType === 'admin'
  96   }
  97
  98   getIdentifier () {
  99     return 'AbuseListTableComponent'
 100   }
 101
 102   openModerationCommentModal (abuse: AdminAbuse) {
 103     this.moderationCommentModal.openModal(abuse)
 104   }
 105
 106   onModerationCommentUpdated () {
 107     this.reloadData()
 108   }
 109
 110   isAbuseAccepted (abuse: AdminAbuse) {
 111     return abuse.state.id === AbuseState.ACCEPTED
 112   }
 113
 114   isAbuseRejected (abuse: AdminAbuse) {
 115     return abuse.state.id === AbuseState.REJECTED
 116   }
 117
 118   getVideoUrl (abuse: AdminAbuse) {
 119     return Video.buildClientUrl(abuse.video.uuid)
 120   }
 121
 122   getCommentUrl (abuse: AdminAbuse) {
 123     return Video.buildClientUrl(abuse.comment.video.uuid) + ';threadId=' + abuse.comment.threadId
 124   }
 125
 126   getAccountUrl (abuse: ProcessedAbuse) {
 127     return '/a/' + abuse.flaggedAccount.nameWithHost
 128   }
 129
 130   getVideoEmbed (abuse: AdminAbuse) {
 131     return buildVideoOrPlaylistEmbed(
 132       buildVideoLink({
 133         baseUrl: `${environment.originServerUrl}/videos/embed/${abuse.video.uuid}`,
 134         title: false,
 135         warningTitle: false,
 136         startTime: abuse.video.startAt,
 137         stopTime: abuse.video.endAt
 138       }),
 139       abuse.video.name
 140     )
 141   }
 142
 143   async removeAbuse (abuse: AdminAbuse) {
 144     const res = await this.confirmService.confirm($localize`Do you really want to delete this abuse report?`, $localize`Delete`)
 145     if (res === false) return
 146
 147     this.abuseService.removeAbuse(abuse).subscribe(
 148       () => {
 149         this.notifier.success($localize`Abuse deleted.`)
 150         this.reloadData()
 151       },
 152
 153       err => this.notifier.error(err.message)
 154     )
 155   }
 156
 157   updateAbuseState (abuse: AdminAbuse, state: AbuseState) {
 158     this.abuseService.updateAbuse(abuse, { state })
 159       .subscribe(
 160         () => this.reloadData(),
 161
 162         err => this.notifier.error(err.message)
 163       )
 164   }
 165
 166   onCountMessagesUpdated (event: { abuseId: number, countMessages: number }) {
 167     const abuse = this.abuses.find(a => a.id === event.abuseId)
 168
 169     if (!abuse) {
 170       console.error('Cannot find abuse %d.', event.abuseId)
 171       return
 172     }
 173
 174     abuse.countMessages = event.countMessages
 175   }
 176
 177   openAbuseMessagesModal (abuse: AdminAbuse) {
 178     this.abuseMessagesModal.openModal(abuse)
 179   }
 180
 181   isLocalAbuse (abuse: AdminAbuse) {
 182     if (this.viewType === 'user') return true
 183
 184     return Actor.IS_LOCAL(abuse.reporterAccount.host)
 185   }
 186
 187   protected reloadData () {
 188     logger('Loading data.')
 189
 190     const options = {
 191       pagination: this.pagination,
 192       sort: this.sort,
 193       search: this.search
 194     }
 195
 196     const observable = this.viewType === 'admin'
 197       ? this.abuseService.getAdminAbuses(options)
 198       : this.abuseService.getUserAbuses(options)
 199
 200     return observable.subscribe(
 201         async resultList => {
 202           this.totalRecords = resultList.total
 203
 204           this.abuses = []
 205
 206           for (const a of resultList.data) {
 207             const abuse = a as ProcessedAbuse
 208
 209             abuse.reasonHtml = await this.toHtml(abuse.reason)
 210
 211             if (abuse.moderationComment) {
 212               abuse.moderationCommentHtml = await this.toHtml(abuse.moderationComment)
 213             }
 214
 215             if (abuse.video) {
 216               abuse.embedHtml = this.sanitizer.bypassSecurityTrustHtml(this.getVideoEmbed(abuse))
 217
 218               if (abuse.video.channel?.ownerAccount) {
 219                 abuse.video.channel.ownerAccount = new Account(abuse.video.channel.ownerAccount)
 220               }
 221             }
 222
 223             if (abuse.comment) {
 224               if (abuse.comment.deleted) {
 225                 abuse.truncatedCommentHtml = abuse.commentHtml = $localize`Deleted comment`
 226               } else {
 227                 const truncated = truncate(abuse.comment.text, { length: 100 })
 228                 abuse.truncatedCommentHtml = await this.markdownRenderer.textMarkdownToHTML(truncated, true)
 229                 abuse.commentHtml = await this.markdownRenderer.textMarkdownToHTML(abuse.comment.text, true)
 230               }
 231             }
 232
 233             if (abuse.reporterAccount) {
 234               abuse.reporterAccount = new Account(abuse.reporterAccount)
 235             }
 236
 237             if (abuse.flaggedAccount) {
 238               abuse.flaggedAccount = new Account(abuse.flaggedAccount)
 239             }
 240
 241             if (abuse.updatedAt === abuse.createdAt) delete abuse.updatedAt
 242
 243             this.abuses.push(abuse)
 244           }
 245         },
 246
 247         err => this.notifier.error(err.message)
 248       )
 249   }
 250
 251   private buildInternalActions (): DropdownAction<ProcessedAbuse>[] {
 252     return [
 253       {
 254         label: $localize`Internal actions`,
 255         isHeader: true
 256       },
 257       {
 258         label: this.isAdminView()
 259           ? $localize`Messages with reporter`
 260           : $localize`Messages with moderators`,
 261         handler: abuse => this.openAbuseMessagesModal(abuse),
 262         isDisplayed: abuse => this.isLocalAbuse(abuse)
 263       },
 264       {
 265         label: $localize`Update internal note`,
 266         handler: abuse => this.openModerationCommentModal(abuse),
 267         isDisplayed: abuse => this.isAdminView() && !!abuse.moderationComment
 268       },
 269       {
 270         label: $localize`Mark as accepted`,
 271         handler: abuse => this.updateAbuseState(abuse, AbuseState.ACCEPTED),
 272         isDisplayed: abuse => this.isAdminView() && !this.isAbuseAccepted(abuse)
 273       },
 274       {
 275         label: $localize`Mark as rejected`,
 276         handler: abuse => this.updateAbuseState(abuse, AbuseState.REJECTED),
 277         isDisplayed: abuse => this.isAdminView() && !this.isAbuseRejected(abuse)
 278       },
 279       {
 280         label: $localize`Add internal note`,
 281         handler: abuse => this.openModerationCommentModal(abuse),
 282         isDisplayed: abuse => this.isAdminView() && !abuse.moderationComment
 283       },
 284       {
 285         label: $localize`Delete report`,
 286         handler: abuse => this.isAdminView() && this.removeAbuse(abuse)
 287       }
 288     ]
 289   }
 290
 291   private buildFlaggedAccountActions (): DropdownAction<ProcessedAbuse>[] {
 292     if (!this.isAdminView()) return []
 293
 294     return [
 295       {
 296         label: $localize`Actions for the flagged account`,
 297         isHeader: true,
 298         isDisplayed: abuse => abuse.flaggedAccount && !abuse.comment && !abuse.video
 299       },
 300
 301       {
 302         label: $localize`Mute account`,
 303         isDisplayed: abuse => abuse.flaggedAccount && !abuse.comment && !abuse.video,
 304         handler: abuse => this.muteAccountHelper(abuse.flaggedAccount)
 305       },
 306
 307       {
 308         label: $localize`Mute server account`,
 309         isDisplayed: abuse => abuse.flaggedAccount && !abuse.comment && !abuse.video,
 310         handler: abuse => this.muteServerHelper(abuse.flaggedAccount.host)
 311       }
 312     ]
 313   }
 314
 315   private buildAccountActions (): DropdownAction<ProcessedAbuse>[] {
 316     if (!this.isAdminView()) return []
 317
 318     return [
 319       {
 320         label: $localize`Actions for the reporter`,
 321         isHeader: true,
 322         isDisplayed: abuse => !!abuse.reporterAccount
 323       },
 324
 325       {
 326         label: $localize`Mute reporter`,
 327         isDisplayed: abuse => !!abuse.reporterAccount,
 328         handler: abuse => this.muteAccountHelper(abuse.reporterAccount)
 329       },
 330
 331       {
 332         label: $localize`Mute server`,
 333         isDisplayed: abuse => abuse.reporterAccount && !abuse.reporterAccount.userId,
 334         handler: abuse => this.muteServerHelper(abuse.reporterAccount.host)
 335       }
 336     ]
 337   }
 338
 339   private buildVideoActions (): DropdownAction<ProcessedAbuse>[] {
 340     if (!this.isAdminView()) return []
 341
 342     return [
 343       {
 344         label: $localize`Actions for the video`,
 345         isHeader: true,
 346         isDisplayed: abuse => abuse.video && !abuse.video.deleted
 347       },
 348       {
 349         label: $localize`Block video`,
 350         isDisplayed: abuse => abuse.video && !abuse.video.deleted && !abuse.video.blacklisted,
 351         handler: abuse => {
 352           this.videoBlocklistService.blockVideo(abuse.video.id, undefined, abuse.video.channel.isLocal)
 353             .subscribe(
 354               () => {
 355                 this.notifier.success($localize`Video blocked.`)
 356
 357                 this.updateAbuseState(abuse, AbuseState.ACCEPTED)
 358               },
 359
 360               err => this.notifier.error(err.message)
 361             )
 362         }
 363       },
 364       {
 365         label: $localize`Unblock video`,
 366         isDisplayed: abuse => abuse.video && !abuse.video.deleted && abuse.video.blacklisted,
 367         handler: abuse => {
 368           this.videoBlocklistService.unblockVideo(abuse.video.id)
 369             .subscribe(
 370               () => {
 371                 this.notifier.success($localize`Video unblocked.`)
 372
 373                 this.updateAbuseState(abuse, AbuseState.ACCEPTED)
 374               },
 375
 376               err => this.notifier.error(err.message)
 377             )
 378         }
 379       },
 380       {
 381         label: $localize`Delete video`,
 382         isDisplayed: abuse => abuse.video && !abuse.video.deleted,
 383         handler: async abuse => {
 384           const res = await this.confirmService.confirm(
 385             $localize`Do you really want to delete this video?`,
 386             $localize`Delete`
 387           )
 388           if (res === false) return
 389
 390           this.videoService.removeVideo(abuse.video.id)
 391             .subscribe(
 392               () => {
 393                 this.notifier.success($localize`Video deleted.`)
 394
 395                 this.updateAbuseState(abuse, AbuseState.ACCEPTED)
 396               },
 397
 398               err => this.notifier.error(err.message)
 399             )
 400         }
 401       }
 402     ]
 403   }
 404
 405   private buildCommentActions (): DropdownAction<ProcessedAbuse>[] {
 406     if (!this.isAdminView()) return []
 407
 408     return [
 409       {
 410         label: $localize`Actions for the comment`,
 411         isHeader: true,
 412         isDisplayed: abuse => abuse.comment && !abuse.comment.deleted
 413       },
 414
 415       {
 416         label: $localize`Delete comment`,
 417         isDisplayed: abuse => abuse.comment && !abuse.comment.deleted,
 418         handler: async abuse => {
 419           const res = await this.confirmService.confirm(
 420             $localize`Do you really want to delete this comment?`,
 421             $localize`Delete`
 422           )
 423           if (res === false) return
 424
 425           this.commentService.deleteVideoComment(abuse.comment.video.id, abuse.comment.id)
 426             .subscribe(
 427               () => {
 428                 this.notifier.success($localize`Comment deleted.`)
 429
 430                 this.updateAbuseState(abuse, AbuseState.ACCEPTED)
 431               },
 432
 433               err => this.notifier.error(err.message)
 434             )
 435         }
 436       }
 437     ]
 438   }
 439
 440   private muteAccountHelper (account: Account) {
 441     this.blocklistService.blockAccountByInstance(account)
 442       .subscribe(
 443         () => {
 444           this.notifier.success($localize`Account ${account.nameWithHost} muted by the instance.`)
 445           account.mutedByInstance = true
 446         },
 447
 448         err => this.notifier.error(err.message)
 449       )
 450   }
 451
 452   private muteServerHelper (host: string) {
 453     this.blocklistService.blockServerByInstance(host)
 454       .subscribe(
 455         () => {
 456           this.notifier.success($localize`Server ${host} muted by the instance.`)
 457         },
 458
 459         err => this.notifier.error(err.message)
 460       )
 461   }
 462
 463   private toHtml (text: string) {
 464     return this.markdownRenderer.textMarkdownToHTML(text)
 465   }
 466 }