1 import { Component, OnInit, ViewChild } from '@angular/core'
2 import { Account } from '@app/shared/account/account.model'
3 import { Notifier } from '@app/core'
4 import { SortMeta } from 'primeng/api'
5 import { VideoAbuse, VideoAbuseState } from '../../../../../../shared'
6 import { RestPagination, RestTable, VideoAbuseService, VideoBlacklistService } from '../../../shared'
7 import { I18n } from '@ngx-translate/i18n-polyfill'
8 import { DropdownAction } from '../../../shared/buttons/action-dropdown.component'
9 import { ConfirmService } from '../../../core/index'
10 import { ModerationCommentModalComponent } from './moderation-comment-modal.component'
11 import { Video } from '../../../shared/video/video.model'
12 import { MarkdownService } from '@app/shared/renderer'
13 import { Actor } from '@app/shared/actor/actor.model'
14 import { buildVideoLink, buildVideoEmbed } from 'src/assets/player/utils'
15 import { getAbsoluteAPIUrl } from '@app/shared/misc/utils'
16 import { DomSanitizer } from '@angular/platform-browser'
17 import { BlocklistService } from '@app/shared/blocklist'
20 selector: 'my-video-abuse-list',
21 templateUrl: './video-abuse-list.component.html',
22 styleUrls: [ '../moderation.component.scss']
24 export class VideoAbuseListComponent extends RestTable implements OnInit {
25 @ViewChild('moderationCommentModal', { static: true }) moderationCommentModal: ModerationCommentModalComponent
27 videoAbuses: (VideoAbuse & { moderationCommentHtml?: string, reasonHtml?: string })[] = []
30 sort: SortMeta = { field: 'createdAt', order: 1 }
31 pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
33 videoAbuseActions: DropdownAction<VideoAbuse>[][] = []
36 private notifier: Notifier,
37 private videoAbuseService: VideoAbuseService,
38 private blocklistService: BlocklistService,
39 private videoBlacklistService: VideoBlacklistService,
40 private confirmService: ConfirmService,
42 private markdownRenderer: MarkdownService,
43 private sanitizer: DomSanitizer
47 this.videoAbuseActions = [
50 label: this.i18n('Internal actions'),
54 label: this.i18n('Delete report'),
55 handler: videoAbuse => this.removeVideoAbuse(videoAbuse)
58 label: this.i18n('Add note'),
59 handler: videoAbuse => this.openModerationCommentModal(videoAbuse),
60 isDisplayed: videoAbuse => !videoAbuse.moderationComment
63 label: this.i18n('Update note'),
64 handler: videoAbuse => this.openModerationCommentModal(videoAbuse),
65 isDisplayed: videoAbuse => !!videoAbuse.moderationComment
68 label: this.i18n('Mark as accepted'),
69 handler: videoAbuse => this.updateVideoAbuseState(videoAbuse, VideoAbuseState.ACCEPTED),
70 isDisplayed: videoAbuse => !this.isVideoAbuseAccepted(videoAbuse)
73 label: this.i18n('Mark as rejected'),
74 handler: videoAbuse => this.updateVideoAbuseState(videoAbuse, VideoAbuseState.REJECTED),
75 isDisplayed: videoAbuse => !this.isVideoAbuseRejected(videoAbuse)
80 label: this.i18n('Actions for the video'),
84 label: this.i18n('Blacklist video'),
85 handler: videoAbuse => {
86 this.videoBlacklistService.blacklistVideo(videoAbuse.video.id, undefined, true)
89 this.notifier.success(this.i18n('Video blacklisted.'))
91 this.updateVideoAbuseState(videoAbuse, VideoAbuseState.ACCEPTED)
94 err => this.notifier.error(err.message)
107 return 'VideoAbuseListComponent'
110 openModerationCommentModal (videoAbuse: VideoAbuse) {
111 this.moderationCommentModal.openModal(videoAbuse)
114 onModerationCommentUpdated () {
118 createByString (account: Account) {
119 return Account.CREATE_BY_STRING(account.name, account.host)
122 isVideoAbuseAccepted (videoAbuse: VideoAbuse) {
123 return videoAbuse.state.id === VideoAbuseState.ACCEPTED
126 isVideoAbuseRejected (videoAbuse: VideoAbuse) {
127 return videoAbuse.state.id === VideoAbuseState.REJECTED
130 getVideoUrl (videoAbuse: VideoAbuse) {
131 return Video.buildClientUrl(videoAbuse.video.uuid)
134 getVideoEmbed (videoAbuse: VideoAbuse) {
135 const absoluteAPIUrl = 'http://localhost:9000' || getAbsoluteAPIUrl()
136 const embedUrl = buildVideoLink({
137 baseUrl: absoluteAPIUrl + '/videos/embed/' + videoAbuse.video.uuid,
140 return buildVideoEmbed(embedUrl)
143 switchToDefaultAvatar ($event: Event) {
144 ($event.target as HTMLImageElement).src = Actor.GET_DEFAULT_AVATAR_URL()
147 async removeVideoAbuse (videoAbuse: VideoAbuse) {
148 const res = await this.confirmService.confirm(this.i18n('Do you really want to delete this abuse report?'), this.i18n('Delete'))
149 if (res === false) return
151 this.videoAbuseService.removeVideoAbuse(videoAbuse).subscribe(
153 this.notifier.success(this.i18n('Abuse deleted.'))
157 err => this.notifier.error(err.message)
161 updateVideoAbuseState (videoAbuse: VideoAbuse, state: VideoAbuseState) {
162 this.videoAbuseService.updateVideoAbuse(videoAbuse, { state })
164 () => this.loadData(),
166 err => this.notifier.error(err.message)
171 protected loadData () {
172 return this.videoAbuseService.getVideoAbuses(this.pagination, this.sort)
174 async resultList => {
175 this.totalRecords = resultList.total
177 this.videoAbuses = resultList.data
179 for (const abuse of this.videoAbuses) {
180 Object.assign(abuse, {
181 reasonHtml: await this.toHtml(abuse.reason),
182 moderationCommentHtml: await this.toHtml(abuse.moderationComment),
183 embedHtml: this.sanitizer.bypassSecurityTrustHtml(this.getVideoEmbed(abuse))
189 err => this.notifier.error(err.message)
193 private toHtml (text: string) {
194 return this.markdownRenderer.textMarkdownToHTML(text)