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 { AfterViewInit, 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 { AbuseMessageModalComponent } from './abuse-message-modal.component'
  15 import { ModerationCommentModalComponent } from './moderation-comment-modal.component'
  16 import { ProcessedAbuse } from './processed-abuse.model'
  17 import { AdvancedInputFilter } from '../shared-forms'
  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, AfterViewInit {
  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     this.listenToSearchChange()
  93   }
  94
  95   ngAfterViewInit () {
  96     if (this.search) this.setTableFilter(this.search, false)
  97   }
  98
  99   isAdminView () {
 100     return this.viewType === 'admin'
 101   }
 102
 103   getIdentifier () {
 104     return 'AbuseListTableComponent'
 105   }
 106
 107   openModerationCommentModal (abuse: AdminAbuse) {
 108     this.moderationCommentModal.openModal(abuse)
 109   }
 110
 111   onModerationCommentUpdated () {
 112     this.loadData()
 113   }
 114
 115   isAbuseAccepted (abuse: AdminAbuse) {
 116     return abuse.state.id === AbuseState.ACCEPTED
 117   }
 118
 119   isAbuseRejected (abuse: AdminAbuse) {
 120     return abuse.state.id === AbuseState.REJECTED
 121   }
 122
 123   getVideoUrl (abuse: AdminAbuse) {
 124     return Video.buildClientUrl(abuse.video.uuid)
 125   }
 126
 127   getCommentUrl (abuse: AdminAbuse) {
 128     return Video.buildClientUrl(abuse.comment.video.uuid) + ';threadId=' + abuse.comment.threadId
 129   }
 130
 131   getAccountUrl (abuse: ProcessedAbuse) {
 132     return '/accounts/' + abuse.flaggedAccount.nameWithHost
 133   }
 134
 135   getVideoEmbed (abuse: AdminAbuse) {
 136     return buildVideoOrPlaylistEmbed(
 137       buildVideoLink({
 138         baseUrl: `${environment.originServerUrl}/videos/embed/${abuse.video.uuid}`,
 139         title: false,
 140         warningTitle: false,
 141         startTime: abuse.video.startAt,
 142         stopTime: abuse.video.endAt
 143       }),
 144       abuse.video.name
 145     )
 146   }
 147
 148   async removeAbuse (abuse: AdminAbuse) {
 149     const res = await this.confirmService.confirm($localize`Do you really want to delete this abuse report?`, $localize`Delete`)
 150     if (res === false) return
 151
 152     this.abuseService.removeAbuse(abuse).subscribe(
 153       () => {
 154         this.notifier.success($localize`Abuse deleted.`)
 155         this.loadData()
 156       },
 157
 158       err => this.notifier.error(err.message)
 159     )
 160   }
 161
 162   updateAbuseState (abuse: AdminAbuse, state: AbuseState) {
 163     this.abuseService.updateAbuse(abuse, { state })
 164       .subscribe(
 165         () => this.loadData(),
 166
 167         err => this.notifier.error(err.message)
 168       )
 169   }
 170
 171   onCountMessagesUpdated (event: { abuseId: number, countMessages: number }) {
 172     const abuse = this.abuses.find(a => a.id === event.abuseId)
 173
 174     if (!abuse) {
 175       console.error('Cannot find abuse %d.', event.abuseId)
 176       return
 177     }
 178
 179     abuse.countMessages = event.countMessages
 180   }
 181
 182   openAbuseMessagesModal (abuse: AdminAbuse) {
 183     this.abuseMessagesModal.openModal(abuse)
 184   }
 185
 186   isLocalAbuse (abuse: AdminAbuse) {
 187     if (this.viewType === 'user') return true
 188
 189     return Actor.IS_LOCAL(abuse.reporterAccount.host)
 190   }
 191
 192   protected loadData () {
 193     logger('Loading data.')
 194
 195     const options = {
 196       pagination: this.pagination,
 197       sort: this.sort,
 198       search: this.search
 199     }
 200
 201     const observable = this.viewType === 'admin'
 202       ? this.abuseService.getAdminAbuses(options)
 203       : this.abuseService.getUserAbuses(options)
 204
 205     return observable.subscribe(
 206         async resultList => {
 207           this.totalRecords = resultList.total
 208
 209           this.abuses = []
 210
 211           for (const a of resultList.data) {
 212             const abuse = a as ProcessedAbuse
 213
 214             abuse.reasonHtml = await this.toHtml(abuse.reason)
 215
 216             if (abuse.moderationComment) {
 217               abuse.moderationCommentHtml = await this.toHtml(abuse.moderationComment)
 218             }
 219
 220             if (abuse.video) {
 221               abuse.embedHtml = this.sanitizer.bypassSecurityTrustHtml(this.getVideoEmbed(abuse))
 222
 223               if (abuse.video.channel?.ownerAccount) {
 224                 abuse.video.channel.ownerAccount = new Account(abuse.video.channel.ownerAccount)
 225               }
 226             }
 227
 228             if (abuse.comment) {
 229               if (abuse.comment.deleted) {
 230                 abuse.truncatedCommentHtml = abuse.commentHtml = $localize`Deleted comment`
 231               } else {
 232                 const truncated = truncate(abuse.comment.text, { length: 100 })
 233                 abuse.truncatedCommentHtml = await this.markdownRenderer.textMarkdownToHTML(truncated, true)
 234                 abuse.commentHtml = await this.markdownRenderer.textMarkdownToHTML(abuse.comment.text, true)
 235               }
 236             }
 237
 238             if (abuse.reporterAccount) {
 239               abuse.reporterAccount = new Account(abuse.reporterAccount)
 240             }
 241
 242             if (abuse.flaggedAccount) {
 243               abuse.flaggedAccount = new Account(abuse.flaggedAccount)
 244             }
 245
 246             if (abuse.updatedAt === abuse.createdAt) delete abuse.updatedAt
 247
 248             this.abuses.push(abuse)
 249           }
 250         },
 251
 252         err => this.notifier.error(err.message)
 253       )
 254   }
 255
 256   private buildInternalActions (): DropdownAction<ProcessedAbuse>[] {
 257     return [
 258       {
 259         label: $localize`Internal actions`,
 260         isHeader: true
 261       },
 262       {
 263         label: this.isAdminView()
 264           ? $localize`Messages with reporter`
 265           : $localize`Messages with moderators`,
 266         handler: abuse => this.openAbuseMessagesModal(abuse),
 267         isDisplayed: abuse => this.isLocalAbuse(abuse)
 268       },
 269       {
 270         label: $localize`Update internal note`,
 271         handler: abuse => this.openModerationCommentModal(abuse),
 272         isDisplayed: abuse => this.isAdminView() && !!abuse.moderationComment
 273       },
 274       {
 275         label: $localize`Mark as accepted`,
 276         handler: abuse => this.updateAbuseState(abuse, AbuseState.ACCEPTED),
 277         isDisplayed: abuse => this.isAdminView() && !this.isAbuseAccepted(abuse)
 278       },
 279       {
 280         label: $localize`Mark as rejected`,
 281         handler: abuse => this.updateAbuseState(abuse, AbuseState.REJECTED),
 282         isDisplayed: abuse => this.isAdminView() && !this.isAbuseRejected(abuse)
 283       },
 284       {
 285         label: $localize`Add internal note`,
 286         handler: abuse => this.openModerationCommentModal(abuse),
 287         isDisplayed: abuse => this.isAdminView() && !abuse.moderationComment
 288       },
 289       {
 290         label: $localize`Delete report`,
 291         handler: abuse => this.isAdminView() && this.removeAbuse(abuse)
 292       }
 293     ]
 294   }
 295
 296   private buildFlaggedAccountActions (): DropdownAction<ProcessedAbuse>[] {
 297     if (!this.isAdminView()) return []
 298
 299     return [
 300       {
 301         label: $localize`Actions for the flagged account`,
 302         isHeader: true,
 303         isDisplayed: abuse => abuse.flaggedAccount && !abuse.comment && !abuse.video
 304       },
 305
 306       {
 307         label: $localize`Mute account`,
 308         isDisplayed: abuse => abuse.flaggedAccount && !abuse.comment && !abuse.video,
 309         handler: abuse => this.muteAccountHelper(abuse.flaggedAccount)
 310       },
 311
 312       {
 313         label: $localize`Mute server account`,
 314         isDisplayed: abuse => abuse.flaggedAccount && !abuse.comment && !abuse.video,
 315         handler: abuse => this.muteServerHelper(abuse.flaggedAccount.host)
 316       }
 317     ]
 318   }
 319
 320   private buildAccountActions (): DropdownAction<ProcessedAbuse>[] {
 321     if (!this.isAdminView()) return []
 322
 323     return [
 324       {
 325         label: $localize`Actions for the reporter`,
 326         isHeader: true,
 327         isDisplayed: abuse => !!abuse.reporterAccount
 328       },
 329
 330       {
 331         label: $localize`Mute reporter`,
 332         isDisplayed: abuse => !!abuse.reporterAccount,
 333         handler: abuse => this.muteAccountHelper(abuse.reporterAccount)
 334       },
 335
 336       {
 337         label: $localize`Mute server`,
 338         isDisplayed: abuse => abuse.reporterAccount && !abuse.reporterAccount.userId,
 339         handler: abuse => this.muteServerHelper(abuse.reporterAccount.host)
 340       }
 341     ]
 342   }
 343
 344   private buildVideoActions (): DropdownAction<ProcessedAbuse>[] {
 345     if (!this.isAdminView()) return []
 346
 347     return [
 348       {
 349         label: $localize`Actions for the video`,
 350         isHeader: true,
 351         isDisplayed: abuse => abuse.video && !abuse.video.deleted
 352       },
 353       {
 354         label: $localize`Block video`,
 355         isDisplayed: abuse => abuse.video && !abuse.video.deleted && !abuse.video.blacklisted,
 356         handler: abuse => {
 357           this.videoBlocklistService.blockVideo(abuse.video.id, undefined, abuse.video.channel.isLocal)
 358             .subscribe(
 359               () => {
 360                 this.notifier.success($localize`Video blocked.`)
 361
 362                 this.updateAbuseState(abuse, AbuseState.ACCEPTED)
 363               },
 364
 365               err => this.notifier.error(err.message)
 366             )
 367         }
 368       },
 369       {
 370         label: $localize`Unblock video`,
 371         isDisplayed: abuse => abuse.video && !abuse.video.deleted && abuse.video.blacklisted,
 372         handler: abuse => {
 373           this.videoBlocklistService.unblockVideo(abuse.video.id)
 374             .subscribe(
 375               () => {
 376                 this.notifier.success($localize`Video unblocked.`)
 377
 378                 this.updateAbuseState(abuse, AbuseState.ACCEPTED)
 379               },
 380
 381               err => this.notifier.error(err.message)
 382             )
 383         }
 384       },
 385       {
 386         label: $localize`Delete video`,
 387         isDisplayed: abuse => abuse.video && !abuse.video.deleted,
 388         handler: async abuse => {
 389           const res = await this.confirmService.confirm(
 390             $localize`Do you really want to delete this video?`,
 391             $localize`Delete`
 392           )
 393           if (res === false) return
 394
 395           this.videoService.removeVideo(abuse.video.id)
 396             .subscribe(
 397               () => {
 398                 this.notifier.success($localize`Video deleted.`)
 399
 400                 this.updateAbuseState(abuse, AbuseState.ACCEPTED)
 401               },
 402
 403               err => this.notifier.error(err.message)
 404             )
 405         }
 406       }
 407     ]
 408   }
 409
 410   private buildCommentActions (): DropdownAction<ProcessedAbuse>[] {
 411     if (!this.isAdminView()) return []
 412
 413     return [
 414       {
 415         label: $localize`Actions for the comment`,
 416         isHeader: true,
 417         isDisplayed: abuse => abuse.comment && !abuse.comment.deleted
 418       },
 419
 420       {
 421         label: $localize`Delete comment`,
 422         isDisplayed: abuse => abuse.comment && !abuse.comment.deleted,
 423         handler: async abuse => {
 424           const res = await this.confirmService.confirm(
 425             $localize`Do you really want to delete this comment?`,
 426             $localize`Delete`
 427           )
 428           if (res === false) return
 429
 430           this.commentService.deleteVideoComment(abuse.comment.video.id, abuse.comment.id)
 431             .subscribe(
 432               () => {
 433                 this.notifier.success($localize`Comment deleted.`)
 434
 435                 this.updateAbuseState(abuse, AbuseState.ACCEPTED)
 436               },
 437
 438               err => this.notifier.error(err.message)
 439             )
 440         }
 441       }
 442     ]
 443   }
 444
 445   private muteAccountHelper (account: Account) {
 446     this.blocklistService.blockAccountByInstance(account)
 447       .subscribe(
 448         () => {
 449           this.notifier.success($localize`Account ${account.nameWithHost} muted by the instance.`)
 450           account.mutedByInstance = true
 451         },
 452
 453         err => this.notifier.error(err.message)
 454       )
 455   }
 456
 457   private muteServerHelper (host: string) {
 458     this.blocklistService.blockServerByInstance(host)
 459       .subscribe(
 460         () => {
 461           this.notifier.success($localize`Server ${host} muted by the instance.`)
 462         },
 463
 464         err => this.notifier.error(err.message)
 465       )
 466   }
 467
 468   private toHtml (text: string) {
 469     return this.markdownRenderer.textMarkdownToHTML(text)
 470   }
 471 }