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