X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;ds=sidebyside;f=client%2Fsrc%2Fapp%2F%2Badmin%2Fmoderation%2Fvideo-abuse-list%2Fvideo-abuse-list.component.ts;h=b0a655e714d154f53a03b497ab8215cdddb54738;hb=67ed6552b831df66713bac9e672738796128d33f;hp=e87163c4f80d9ae6d51791679f2a93fdb3c2860c;hpb=d1261d9a3cef6d3df408c9dce977100ac196f9f8;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.ts b/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.ts index e87163c4f..b0a655e71 100644 --- a/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.ts +++ b/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.ts @@ -1,23 +1,30 @@ -import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core' -import { Account } from '@app/shared/account/account.model' -import { Notifier } from '@app/core' import { SortMeta } from 'primeng/api' -import { VideoAbuse, VideoAbuseState } from '../../../../../../shared' -import { RestPagination, RestTable, VideoAbuseService, VideoBlacklistService } from '../../../shared' +import { filter } from 'rxjs/operators' +import { buildVideoEmbed, buildVideoLink } from 'src/assets/player/utils' +import { environment } from 'src/environments/environment' +import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core' +import { DomSanitizer } from '@angular/platform-browser' +import { ActivatedRoute, Params, Router } from '@angular/router' +import { ConfirmService, MarkdownService, Notifier, RestPagination, RestTable } from '@app/core' +import { Account, Actor, DropdownAction, Video, VideoService } from '@app/shared/shared-main' +import { BlocklistService, VideoAbuseService, VideoBlockService } from '@app/shared/shared-moderation' import { I18n } from '@ngx-translate/i18n-polyfill' -import { DropdownAction } from '../../../shared/buttons/action-dropdown.component' -import { ConfirmService } from '../../../core/index' +import { VideoAbuse, VideoAbuseState } from '@shared/models' import { ModerationCommentModalComponent } from './moderation-comment-modal.component' -import { Video } from '../../../shared/video/video.model' -import { MarkdownService } from '@app/shared/renderer' -import { Actor } from '@app/shared/actor/actor.model' -import { buildVideoLink, buildVideoEmbed } from 'src/assets/player/utils' -import { getAbsoluteAPIUrl } from '@app/shared/misc/utils' -import { DomSanitizer } from '@angular/platform-browser' -import { BlocklistService } from '@app/shared/blocklist' -import { VideoService } from '@app/shared/video/video.service' -import { ActivatedRoute } from '@angular/router' -import { filter } from 'rxjs/operators' + +export type ProcessedVideoAbuse = VideoAbuse & { + moderationCommentHtml?: string, + reasonHtml?: string + embedHtml?: string + updatedAt?: Date + // override bare server-side definitions with rich client-side definitions + reporterAccount: Account + video: VideoAbuse['video'] & { + channel: VideoAbuse['video']['channel'] & { + ownerAccount: Account + } + } +} @Component({ selector: 'my-video-abuse-list', @@ -27,7 +34,7 @@ import { filter } from 'rxjs/operators' export class VideoAbuseListComponent extends RestTable implements OnInit, AfterViewInit { @ViewChild('moderationCommentModal', { static: true }) moderationCommentModal: ModerationCommentModalComponent - videoAbuses: (VideoAbuse & { moderationCommentHtml?: string, reasonHtml?: string })[] = [] + videoAbuses: ProcessedVideoAbuse[] = [] totalRecords = 0 sort: SortMeta = { field: 'createdAt', order: 1 } pagination: RestPagination = { count: this.rowsPerPage, start: 0 } @@ -39,12 +46,13 @@ export class VideoAbuseListComponent extends RestTable implements OnInit, AfterV private videoAbuseService: VideoAbuseService, private blocklistService: BlocklistService, private videoService: VideoService, - private videoBlacklistService: VideoBlacklistService, + private videoBlocklistService: VideoBlockService, private confirmService: ConfirmService, private i18n: I18n, private markdownRenderer: MarkdownService, private sanitizer: DomSanitizer, - private route: ActivatedRoute + private route: ActivatedRoute, + private router: Router ) { super() @@ -86,13 +94,13 @@ export class VideoAbuseListComponent extends RestTable implements OnInit, AfterV isDisplayed: videoAbuse => !videoAbuse.video.deleted }, { - label: this.i18n('Blacklist video'), + label: this.i18n('Block video'), isDisplayed: videoAbuse => !videoAbuse.video.deleted && !videoAbuse.video.blacklisted, handler: videoAbuse => { - this.videoBlacklistService.blacklistVideo(videoAbuse.video.id, undefined, true) + this.videoBlocklistService.blockVideo(videoAbuse.video.id, undefined, true) .subscribe( () => { - this.notifier.success(this.i18n('Video blacklisted.')) + this.notifier.success(this.i18n('Video blocked.')) this.updateVideoAbuseState(videoAbuse, VideoAbuseState.ACCEPTED) }, @@ -102,13 +110,13 @@ export class VideoAbuseListComponent extends RestTable implements OnInit, AfterV } }, { - label: this.i18n('Unblacklist video'), + label: this.i18n('Unblock video'), isDisplayed: videoAbuse => !videoAbuse.video.deleted && videoAbuse.video.blacklisted, handler: videoAbuse => { - this.videoBlacklistService.removeVideoFromBlacklist(videoAbuse.video.id) + this.videoBlocklistService.unblockVideo(videoAbuse.video.id) .subscribe( () => { - this.notifier.success(this.i18n('Video unblacklisted.')) + this.notifier.success(this.i18n('Video unblocked.')) this.updateVideoAbuseState(videoAbuse, VideoAbuseState.ACCEPTED) }, @@ -212,16 +220,25 @@ export class VideoAbuseListComponent extends RestTable implements OnInit, AfterV this.loadData() } - createByString (account: Account) { - return Account.CREATE_BY_STRING(account.name, account.host) + /* Table filter functions */ + onAbuseSearch (event: Event) { + this.onSearch(event) + this.setQueryParams((event.target as HTMLInputElement).value) } - setTableFilter (filter: string) { - // FIXME: cannot use ViewChild, so create a component for the filter input - const filterInput = document.getElementById('table-filter') as HTMLInputElement - if (filterInput) filterInput.value = filter + setQueryParams (search: string) { + const queryParams: Params = {} + if (search) Object.assign(queryParams, { search }) + this.router.navigate([ '/admin/moderation/video-abuses/list' ], { queryParams }) } + resetTableFilter () { + this.setTableFilter('') + this.setQueryParams('') + this.resetSearch() + } + /* END Table filter functions */ + isVideoAbuseAccepted (videoAbuse: VideoAbuse) { return videoAbuse.state.id === VideoAbuseState.ACCEPTED } @@ -235,12 +252,15 @@ export class VideoAbuseListComponent extends RestTable implements OnInit, AfterV } getVideoEmbed (videoAbuse: VideoAbuse) { - const absoluteAPIUrl = getAbsoluteAPIUrl() - const embedUrl = buildVideoLink({ - baseUrl: absoluteAPIUrl + '/videos/embed/' + videoAbuse.video.uuid, - warningTitle: false - }) - return buildVideoEmbed(embedUrl) + return buildVideoEmbed( + buildVideoLink({ + baseUrl: `${environment.embedUrl}/videos/embed/${videoAbuse.video.uuid}`, + title: false, + warningTitle: false, + startTime: videoAbuse.startAt, + stopTime: videoAbuse.endAt + }) + ) } switchToDefaultAvatar ($event: Event) { @@ -268,7 +288,6 @@ export class VideoAbuseListComponent extends RestTable implements OnInit, AfterV err => this.notifier.error(err.message) ) - } protected loadData () { @@ -279,18 +298,23 @@ export class VideoAbuseListComponent extends RestTable implements OnInit, AfterV }).subscribe( async resultList => { this.totalRecords = resultList.total + const videoAbuses = [] - this.videoAbuses = resultList.data - - for (const abuse of this.videoAbuses) { + for (const abuse of resultList.data) { Object.assign(abuse, { reasonHtml: await this.toHtml(abuse.reason), moderationCommentHtml: await this.toHtml(abuse.moderationComment), embedHtml: this.sanitizer.bypassSecurityTrustHtml(this.getVideoEmbed(abuse)), reporterAccount: new Account(abuse.reporterAccount) }) + + if (abuse.video.channel?.ownerAccount) abuse.video.channel.ownerAccount = new Account(abuse.video.channel.ownerAccount) + if (abuse.updatedAt === abuse.createdAt) delete abuse.updatedAt + + videoAbuses.push(abuse as ProcessedVideoAbuse) } + this.videoAbuses = videoAbuses }, err => this.notifier.error(err.message)