client/src/app/+admin/moderation/video-block-list/video-block-list.component.ts

   1 import { SortMeta } from 'primeng/api'
   2 import { filter, switchMap } from 'rxjs/operators'
   3 import { AfterViewInit, Component, OnInit } from '@angular/core'
   4 import { ActivatedRoute, Params, Router } from '@angular/router'
   5 import { ConfirmService, MarkdownService, Notifier, RestPagination, RestTable, ServerService } from '@app/core'
   6 import { DropdownAction, Video, VideoService } from '@app/shared/shared-main'
   7 import { VideoBlockService } from '@app/shared/shared-moderation'
   8 import { I18n } from '@ngx-translate/i18n-polyfill'
   9 import { VideoBlacklist, VideoBlacklistType } from '@shared/models'
  10
  11 @Component({
  12   selector: 'my-video-block-list',
  13   templateUrl: './video-block-list.component.html',
  14   styleUrls: [ '../moderation.component.scss', './video-block-list.component.scss' ]
  15 })
  16 export class VideoBlockListComponent extends RestTable implements OnInit, AfterViewInit {
  17   blocklist: (VideoBlacklist & { reasonHtml?: string })[] = []
  18   totalRecords = 0
  19   sort: SortMeta = { field: 'createdAt', order: -1 }
  20   pagination: RestPagination = { count: this.rowsPerPage, start: 0 }
  21   blocklistTypeFilter: VideoBlacklistType = undefined
  22
  23   videoBlocklistActions: DropdownAction<VideoBlacklist>[][] = []
  24
  25   constructor (
  26     private notifier: Notifier,
  27     private serverService: ServerService,
  28     private confirmService: ConfirmService,
  29     private videoBlocklistService: VideoBlockService,
  30     private markdownRenderer: MarkdownService,
  31     private videoService: VideoService,
  32     private route: ActivatedRoute,
  33     private router: Router,
  34     private i18n: I18n
  35   ) {
  36     super()
  37
  38     this.videoBlocklistActions = [
  39       [
  40         {
  41           label: this.i18n('Internal actions'),
  42           isHeader: true
  43         },
  44         {
  45           label: this.i18n('Switch video block to manual'),
  46           handler: videoBlock => {
  47             this.videoBlocklistService.unblockVideo(videoBlock.video.id).pipe(
  48               switchMap(_ => this.videoBlocklistService.blockVideo(videoBlock.video.id, undefined, true))
  49             ).subscribe(
  50               () => {
  51                 this.notifier.success(this.i18n('Video {{name}} switched to manual block.', { name: videoBlock.video.name }))
  52                 this.loadData()
  53               },
  54
  55               err => this.notifier.error(err.message)
  56             )
  57           }
  58         }
  59       ],
  60       [
  61         {
  62           label: this.i18n('Actions for the video'),
  63           isHeader: true
  64         },
  65         {
  66           label: this.i18n('Unblock video'),
  67           handler: videoBlock => this.unblockVideo(videoBlock)
  68         },
  69
  70         {
  71           label: this.i18n('Delete video'),
  72           handler: async videoBlock => {
  73             const res = await this.confirmService.confirm(
  74               this.i18n('Do you really want to delete this video?'),
  75               this.i18n('Delete')
  76             )
  77             if (res === false) return
  78
  79             this.videoService.removeVideo(videoBlock.video.id)
  80               .subscribe(
  81                 () => {
  82                   this.notifier.success(this.i18n('Video deleted.'))
  83                 },
  84
  85                 err => this.notifier.error(err.message)
  86               )
  87           }
  88         }
  89       ]
  90     ]
  91   }
  92
  93   ngOnInit () {
  94     this.serverService.getConfig()
  95         .subscribe(config => {
  96           // don't filter if auto-blacklist is not enabled as this will be the only list
  97           if (config.autoBlacklist.videos.ofUsers.enabled) {
  98             this.blocklistTypeFilter = VideoBlacklistType.MANUAL
  99           }
 100         })
 101
 102     this.initialize()
 103
 104     this.route.queryParams
 105       .pipe(filter(params => params.search !== undefined && params.search !== null))
 106       .subscribe(params => {
 107         this.search = params.search
 108         this.setTableFilter(params.search)
 109         this.loadData()
 110       })
 111   }
 112
 113   ngAfterViewInit () {
 114     if (this.search) this.setTableFilter(this.search)
 115   }
 116
 117   /* Table filter functions */
 118   onBlockSearch (event: Event) {
 119     this.onSearch(event)
 120     this.setQueryParams((event.target as HTMLInputElement).value)
 121   }
 122
 123   setQueryParams (search: string) {
 124     const queryParams: Params = {}
 125     if (search) Object.assign(queryParams, { search })
 126     this.router.navigate([ '/admin/moderation/video-blocks/list' ], { queryParams })
 127   }
 128
 129   resetTableFilter () {
 130     this.setTableFilter('')
 131     this.setQueryParams('')
 132     this.resetSearch()
 133   }
 134   /* END Table filter functions */
 135
 136   getIdentifier () {
 137     return 'VideoBlockListComponent'
 138   }
 139
 140   getVideoUrl (videoBlock: VideoBlacklist) {
 141     return Video.buildClientUrl(videoBlock.video.uuid)
 142   }
 143
 144   booleanToText (value: boolean) {
 145     if (value === true) return this.i18n('yes')
 146
 147     return this.i18n('no')
 148   }
 149
 150   toHtml (text: string) {
 151     return this.markdownRenderer.textMarkdownToHTML(text)
 152   }
 153
 154   async unblockVideo (entry: VideoBlacklist) {
 155     const confirmMessage = this.i18n(
 156       'Do you really want to unblock this video? It will be available again in the videos list.'
 157     )
 158
 159     const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblock'))
 160     if (res === false) return
 161
 162     this.videoBlocklistService.unblockVideo(entry.video.id).subscribe(
 163       () => {
 164         this.notifier.success(this.i18n('Video {{name}} unblocked.', { name: entry.video.name }))
 165         this.loadData()
 166       },
 167
 168       err => this.notifier.error(err.message)
 169     )
 170   }
 171
 172   protected loadData () {
 173     this.videoBlocklistService.listBlocks({
 174       pagination: this.pagination,
 175       sort: this.sort,
 176       search: this.search
 177     })
 178       .subscribe(
 179         async resultList => {
 180           this.totalRecords = resultList.total
 181
 182           this.blocklist = resultList.data
 183
 184           for (const element of this.blocklist) {
 185             Object.assign(element, { reasonHtml: await this.toHtml(element.reason) })
 186           }
 187         },
 188
 189         err => this.notifier.error(err.message)
 190       )
 191   }
 192 }