From 5baee5fca418487e72ddcd6419d31bca8659b668 Mon Sep 17 00:00:00 2001 From: Rigel Kent Date: Tue, 2 Jun 2020 20:50:42 +0200 Subject: rename blacklist to block/blocklist, merge block and auto-block views - also replace whitelist with allowlist - add advanced filters for video-block-list view - move icons in video-block-list and video-abuse-list to left side for visibility - add robot icon to depict automated nature of a block in video-block-list resolves #2790 --- .../src/app/shared/forms/form-validators/index.ts | 2 +- .../video-blacklist-validators.service.ts | 19 ----- .../video-block-validators.service.ts | 19 +++++ .../src/app/shared/images/global-icon.component.ts | 3 +- client/src/app/shared/index.ts | 2 +- client/src/app/shared/shared.module.ts | 14 ++-- .../app/shared/users/user-notification.model.ts | 6 +- .../shared/users/user-notifications.component.html | 12 +-- client/src/app/shared/video-blacklist/index.ts | 1 - .../video-blacklist/video-blacklist.service.ts | 89 ---------------------- client/src/app/shared/video-block/index.ts | 1 + .../app/shared/video-block/video-block.service.ts | 77 +++++++++++++++++++ .../src/app/shared/video/abstract-video-list.html | 2 +- .../video/modals/video-blacklist.component.html | 45 ----------- .../video/modals/video-blacklist.component.scss | 6 -- .../video/modals/video-blacklist.component.ts | 76 ------------------ .../shared/video/modals/video-block.component.html | 45 +++++++++++ .../shared/video/modals/video-block.component.scss | 6 ++ .../shared/video/modals/video-block.component.ts | 75 ++++++++++++++++++ .../video/video-actions-dropdown.component.html | 2 +- .../video/video-actions-dropdown.component.ts | 54 ++++++------- .../shared/video/video-miniature.component.html | 8 +- .../shared/video/video-miniature.component.scss | 8 +- .../app/shared/video/video-miniature.component.ts | 12 +-- client/src/app/shared/video/video.model.ts | 12 +-- 25 files changed, 292 insertions(+), 304 deletions(-) delete mode 100644 client/src/app/shared/forms/form-validators/video-blacklist-validators.service.ts create mode 100644 client/src/app/shared/forms/form-validators/video-block-validators.service.ts delete mode 100644 client/src/app/shared/video-blacklist/index.ts delete mode 100644 client/src/app/shared/video-blacklist/video-blacklist.service.ts create mode 100644 client/src/app/shared/video-block/index.ts create mode 100644 client/src/app/shared/video-block/video-block.service.ts delete mode 100644 client/src/app/shared/video/modals/video-blacklist.component.html delete mode 100644 client/src/app/shared/video/modals/video-blacklist.component.scss delete mode 100644 client/src/app/shared/video/modals/video-blacklist.component.ts create mode 100644 client/src/app/shared/video/modals/video-block.component.html create mode 100644 client/src/app/shared/video/modals/video-block.component.scss create mode 100644 client/src/app/shared/video/modals/video-block.component.ts (limited to 'client/src/app/shared') diff --git a/client/src/app/shared/forms/form-validators/index.ts b/client/src/app/shared/forms/form-validators/index.ts index e3de3ae13..4a01b1622 100644 --- a/client/src/app/shared/forms/form-validators/index.ts +++ b/client/src/app/shared/forms/form-validators/index.ts @@ -6,7 +6,7 @@ export * from './login-validators.service' export * from './reset-password-validators.service' export * from './user-validators.service' export * from './video-abuse-validators.service' -export * from './video-blacklist-validators.service' +export * from './video-block-validators.service' export * from './video-channel-validators.service' export * from './video-comment-validators.service' export * from './video-validators.service' diff --git a/client/src/app/shared/forms/form-validators/video-blacklist-validators.service.ts b/client/src/app/shared/forms/form-validators/video-blacklist-validators.service.ts deleted file mode 100644 index 07d1f264a..000000000 --- a/client/src/app/shared/forms/form-validators/video-blacklist-validators.service.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { I18n } from '@ngx-translate/i18n-polyfill' -import { Validators } from '@angular/forms' -import { Injectable } from '@angular/core' -import { BuildFormValidator } from '@app/shared' - -@Injectable() -export class VideoBlacklistValidatorsService { - readonly VIDEO_BLACKLIST_REASON: BuildFormValidator - - constructor (private i18n: I18n) { - this.VIDEO_BLACKLIST_REASON = { - VALIDATORS: [ Validators.minLength(2), Validators.maxLength(300) ], - MESSAGES: { - 'minlength': this.i18n('Blacklist reason must be at least 2 characters long.'), - 'maxlength': this.i18n('Blacklist reason cannot be more than 300 characters long.') - } - } - } -} diff --git a/client/src/app/shared/forms/form-validators/video-block-validators.service.ts b/client/src/app/shared/forms/form-validators/video-block-validators.service.ts new file mode 100644 index 000000000..dc8257761 --- /dev/null +++ b/client/src/app/shared/forms/form-validators/video-block-validators.service.ts @@ -0,0 +1,19 @@ +import { I18n } from '@ngx-translate/i18n-polyfill' +import { Validators } from '@angular/forms' +import { Injectable } from '@angular/core' +import { BuildFormValidator } from '@app/shared' + +@Injectable() +export class VideoBlockValidatorsService { + readonly VIDEO_BLOCK_REASON: BuildFormValidator + + constructor (private i18n: I18n) { + this.VIDEO_BLOCK_REASON = { + VALIDATORS: [ Validators.minLength(2), Validators.maxLength(300) ], + MESSAGES: { + 'minlength': this.i18n('Block reason must be at least 2 characters long.'), + 'maxlength': this.i18n('Block reason cannot be more than 300 characters long.') + } + } + } +} diff --git a/client/src/app/shared/images/global-icon.component.ts b/client/src/app/shared/images/global-icon.component.ts index d2700f6c3..169882685 100644 --- a/client/src/app/shared/images/global-icon.component.ts +++ b/client/src/app/shared/images/global-icon.component.ts @@ -56,7 +56,8 @@ const icons = { 'refresh': require('!!raw-loader?!../../../assets/images/global/refresh.svg').default, 'npm': require('!!raw-loader?!../../../assets/images/global/npm.svg').default, 'fullscreen': require('!!raw-loader?!../../../assets/images/global/fullscreen.svg').default, - 'exit-fullscreen': require('!!raw-loader?!../../../assets/images/global/exit-fullscreen.svg').default + 'exit-fullscreen': require('!!raw-loader?!../../../assets/images/global/exit-fullscreen.svg').default, + 'robot': require('!!raw-loader?!../../../assets/images/global/robot.svg').default } export type GlobalIconName = keyof typeof icons diff --git a/client/src/app/shared/index.ts b/client/src/app/shared/index.ts index 136730c91..8be578d9f 100644 --- a/client/src/app/shared/index.ts +++ b/client/src/app/shared/index.ts @@ -3,5 +3,5 @@ export * from './forms' export * from './rest' export * from './users' export * from './video-abuse' -export * from './video-blacklist' +export * from './video-block' export * from './shared.module' diff --git a/client/src/app/shared/shared.module.ts b/client/src/app/shared/shared.module.ts index 813f76672..2035097d7 100644 --- a/client/src/app/shared/shared.module.ts +++ b/client/src/app/shared/shared.module.ts @@ -35,7 +35,7 @@ import { UserValidatorsService, VideoAbuseValidatorsService, VideoAcceptOwnershipValidatorsService, - VideoBlacklistValidatorsService, + VideoBlockValidatorsService, VideoChangeOwnershipValidatorsService, VideoChannelValidatorsService, VideoCommentValidatorsService, @@ -78,7 +78,7 @@ import { VideoPlaylistElementMiniatureComponent } from '@app/shared/video-playli import { VideoPlaylistMiniatureComponent } from '@app/shared/video-playlist/video-playlist-miniature.component' import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service' import { InfiniteScrollerDirective } from '@app/shared/video/infinite-scroller.directive' -import { VideoBlacklistComponent } from '@app/shared/video/modals/video-blacklist.component' +import { VideoBlockComponent } from '@app/shared/video/modals/video-block.component' import { VideoDownloadComponent } from '@app/shared/video/modals/video-download.component' import { VideoReportComponent } from '@app/shared/video/modals/video-report.component' import { RedundancyService } from '@app/shared/video/redundancy.service' @@ -102,7 +102,7 @@ import { LoaderComponent } from './misc/loader.component' import { RestExtractor, RestService } from './rest' import { UserService } from './users' import { VideoAbuseService } from './video-abuse' -import { VideoBlacklistService } from './video-blacklist' +import { VideoBlockService } from './video-block' import { VideoOwnershipService } from './video-ownership' import { FeedComponent } from './video/feed.component' import { VideoMiniatureComponent } from './video/video-miniature.component' @@ -147,7 +147,7 @@ import { VideoService } from './video/video.service' VideoDownloadComponent, VideoReportComponent, - VideoBlacklistComponent, + VideoBlockComponent, FeedComponent, @@ -230,7 +230,7 @@ import { VideoService } from './video/video.service' VideoDownloadComponent, VideoReportComponent, - VideoBlacklistComponent, + VideoBlockComponent, FeedComponent, @@ -282,7 +282,7 @@ import { VideoService } from './video/video.service' RestExtractor, RestService, VideoAbuseService, - VideoBlacklistService, + VideoBlockService, VideoOwnershipService, UserService, VideoService, @@ -305,7 +305,7 @@ import { VideoService } from './video/video.service' VideoCommentValidatorsService, VideoValidatorsService, VideoCaptionsValidatorsService, - VideoBlacklistValidatorsService, + VideoBlockValidatorsService, OverviewService, VideoChangeOwnershipValidatorsService, VideoAcceptOwnershipValidatorsService, diff --git a/client/src/app/shared/users/user-notification.model.ts b/client/src/app/shared/users/user-notification.model.ts index 7b8368d87..bc1861c64 100644 --- a/client/src/app/shared/users/user-notification.model.ts +++ b/client/src/app/shared/users/user-notification.model.ts @@ -96,7 +96,7 @@ export class UserNotification implements UserNotificationServer { this.videoUrl = this.buildVideoUrl(this.video) break - case UserNotificationType.UNBLACKLIST_ON_MY_VIDEO: + case UserNotificationType.UNBLOCK_ON_MY_VIDEO: this.videoUrl = this.buildVideoUrl(this.video) break @@ -112,7 +112,7 @@ export class UserNotification implements UserNotificationServer { this.videoUrl = this.buildVideoUrl(this.videoAbuse.video) break - case UserNotificationType.VIDEO_AUTO_BLACKLIST_FOR_MODERATORS: + case UserNotificationType.VIDEO_AUTO_BLOCK_FOR_MODERATORS: this.videoAutoBlacklistUrl = '/admin/moderation/video-auto-blacklist/list' // Backward compatibility where we did not assign videoBlacklist to this type of notification before if (!this.videoBlacklist) this.videoBlacklist = { id: null, video: this.video } @@ -120,7 +120,7 @@ export class UserNotification implements UserNotificationServer { this.videoUrl = this.buildVideoUrl(this.videoBlacklist.video) break - case UserNotificationType.BLACKLIST_ON_MY_VIDEO: + case UserNotificationType.BLOCK_ON_MY_VIDEO: this.videoUrl = this.buildVideoUrl(this.videoBlacklist.video) break diff --git a/client/src/app/shared/users/user-notifications.component.html b/client/src/app/shared/users/user-notifications.component.html index 8dbe6e329..5a102995a 100644 --- a/client/src/app/shared/users/user-notifications.component.html +++ b/client/src/app/shared/users/user-notifications.component.html @@ -26,19 +26,19 @@ - +
- Your video {{ notification.video.name }} has been unblacklisted + Your video {{ notification.video.name }} has been unblocked
- +
- Your video {{ notification.videoBlacklist.video.name }} has been blacklisted + Your video {{ notification.videoBlacklist.video.name }} has been blocked
@@ -50,11 +50,11 @@ - +
- The recently added video {{ notification.videoBlacklist.video.name }} has been auto-blacklisted + The recently added video {{ notification.videoBlacklist.video.name }} has been auto-blocked
diff --git a/client/src/app/shared/video-blacklist/index.ts b/client/src/app/shared/video-blacklist/index.ts deleted file mode 100644 index bfb026441..000000000 --- a/client/src/app/shared/video-blacklist/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './video-blacklist.service' diff --git a/client/src/app/shared/video-blacklist/video-blacklist.service.ts b/client/src/app/shared/video-blacklist/video-blacklist.service.ts deleted file mode 100644 index c0e13a651..000000000 --- a/client/src/app/shared/video-blacklist/video-blacklist.service.ts +++ /dev/null @@ -1,89 +0,0 @@ -import { catchError, map, concatMap, toArray } from 'rxjs/operators' -import { HttpClient, HttpParams } from '@angular/common/http' -import { Injectable } from '@angular/core' -import { SortMeta } from 'primeng/api' -import { from as observableFrom, Observable } from 'rxjs' -import { VideoBlacklist, VideoBlacklistType, ResultList } from '../../../../../shared' -import { Video } from '../video/video.model' -import { environment } from '../../../environments/environment' -import { RestExtractor, RestPagination, RestService } from '../rest' -import { ComponentPaginationLight } from '../rest/component-pagination.model' - -@Injectable() -export class VideoBlacklistService { - private static BASE_VIDEOS_URL = environment.apiUrl + '/api/v1/videos/' - - constructor ( - private authHttp: HttpClient, - private restService: RestService, - private restExtractor: RestExtractor - ) {} - - listBlacklist (options: { - pagination: RestPagination, - sort: SortMeta, - search?: string - type?: VideoBlacklistType - }): Observable> { - const { pagination, sort, search, type } = options - - let params = new HttpParams() - params = this.restService.addRestGetParams(params, pagination, sort) - - if (search) params = params.append('search', search) - if (type) params = params.append('type', type.toString()) - - return this.authHttp.get>(VideoBlacklistService.BASE_VIDEOS_URL + 'blacklist', { params }) - .pipe( - map(res => this.restExtractor.convertResultListDateToHuman(res)), - catchError(res => this.restExtractor.handleError(res)) - ) - } - - getAutoBlacklistedAsVideoList (videoPagination: ComponentPaginationLight): Observable> { - const pagination = this.restService.componentPaginationToRestPagination(videoPagination) - - // prioritize first created since waiting longest - const AUTO_BLACKLIST_SORT = 'createdAt' - - let params = new HttpParams() - params = this.restService.addRestGetParams(params, pagination, AUTO_BLACKLIST_SORT) - - params = params.set('type', VideoBlacklistType.AUTO_BEFORE_PUBLISHED.toString()) - - return this.authHttp.get>(VideoBlacklistService.BASE_VIDEOS_URL + 'blacklist', { params }) - .pipe( - map(res => { - return { - total: res.total, - data: res.data.map(videoBlacklist => new Video(videoBlacklist.video)) - } - }), - catchError(res => this.restExtractor.handleError(res)) - ) - } - - removeVideoFromBlacklist (videoIdArgs: number | number[]) { - const videoIds = Array.isArray(videoIdArgs) ? videoIdArgs : [ videoIdArgs ] - - return observableFrom(videoIds) - .pipe( - concatMap(id => this.authHttp.delete(VideoBlacklistService.BASE_VIDEOS_URL + id + '/blacklist')), - toArray(), - catchError(err => this.restExtractor.handleError(err)) - ) - } - - blacklistVideo (videoId: number, reason: string, unfederate: boolean) { - const body = { - unfederate, - reason - } - - return this.authHttp.post(VideoBlacklistService.BASE_VIDEOS_URL + videoId + '/blacklist', body) - .pipe( - map(this.restExtractor.extractDataBool), - catchError(res => this.restExtractor.handleError(res)) - ) - } -} diff --git a/client/src/app/shared/video-block/index.ts b/client/src/app/shared/video-block/index.ts new file mode 100644 index 000000000..a99551a38 --- /dev/null +++ b/client/src/app/shared/video-block/index.ts @@ -0,0 +1 @@ +export * from './video-block.service' diff --git a/client/src/app/shared/video-block/video-block.service.ts b/client/src/app/shared/video-block/video-block.service.ts new file mode 100644 index 000000000..67ca1d85b --- /dev/null +++ b/client/src/app/shared/video-block/video-block.service.ts @@ -0,0 +1,77 @@ +import { catchError, map, concatMap, toArray } from 'rxjs/operators' +import { HttpClient, HttpParams } from '@angular/common/http' +import { Injectable } from '@angular/core' +import { SortMeta } from 'primeng/api' +import { from as observableFrom, Observable } from 'rxjs' +import { VideoBlocklist, VideoBlockType, ResultList } from '../../../../../shared' +import { environment } from '../../../environments/environment' +import { RestExtractor, RestPagination, RestService } from '../rest' + +@Injectable() +export class VideoBlockService { + private static BASE_VIDEOS_URL = environment.apiUrl + '/api/v1/videos/' + + constructor ( + private authHttp: HttpClient, + private restService: RestService, + private restExtractor: RestExtractor + ) {} + + listBlocks (options: { + pagination: RestPagination + sort: SortMeta + search?: string + type?: VideoBlockType + }): Observable> { + const { pagination, sort, search, type } = options + + let params = new HttpParams() + params = this.restService.addRestGetParams(params, pagination, sort) + + if (search) { + const filters = this.restService.parseQueryStringFilter(search, { + type: { + prefix: 'type:', + handler: v => { + if (v === 'manual') return VideoBlockType.MANUAL + if (v === 'auto') return VideoBlockType.AUTO_BEFORE_PUBLISHED + + return undefined + } + } + }) + + params = this.restService.addObjectParams(params, filters) + } + + return this.authHttp.get>(VideoBlockService.BASE_VIDEOS_URL + 'blacklist', { params }) + .pipe( + map(res => this.restExtractor.convertResultListDateToHuman(res)), + catchError(res => this.restExtractor.handleError(res)) + ) + } + + unblockVideo (videoIdArgs: number | number[]) { + const videoIds = Array.isArray(videoIdArgs) ? videoIdArgs : [ videoIdArgs ] + + return observableFrom(videoIds) + .pipe( + concatMap(id => this.authHttp.delete(VideoBlockService.BASE_VIDEOS_URL + id + '/blacklist')), + toArray(), + catchError(err => this.restExtractor.handleError(err)) + ) + } + + blockVideo (videoId: number, reason: string, unfederate: boolean) { + const body = { + unfederate, + reason + } + + return this.authHttp.post(VideoBlockService.BASE_VIDEOS_URL + videoId + '/blacklist', body) + .pipe( + map(this.restExtractor.extractDataBool), + catchError(res => this.restExtractor.handleError(res)) + ) + } +} diff --git a/client/src/app/shared/video/abstract-video-list.html b/client/src/app/shared/video/abstract-video-list.html index cd8a5b840..8ce3b25b0 100644 --- a/client/src/app/shared/video/abstract-video-list.html +++ b/client/src/app/shared/video/abstract-video-list.html @@ -39,7 +39,7 @@ [fitWidth]="true" [video]="video" [user]="user" [ownerDisplayType]="ownerDisplayType" [displayVideoActions]="displayVideoActions" [displayOptions]="displayOptions" - (videoBlacklisted)="removeVideoFromArray(video)" (videoRemoved)="removeVideoFromArray(video)" + (videoBlocked)="removeVideoFromArray(video)" (videoRemoved)="removeVideoFromArray(video)" > diff --git a/client/src/app/shared/video/modals/video-blacklist.component.html b/client/src/app/shared/video/modals/video-blacklist.component.html deleted file mode 100644 index 8f06a6b02..000000000 --- a/client/src/app/shared/video/modals/video-blacklist.component.html +++ /dev/null @@ -1,45 +0,0 @@ - -
-

Blacklist video

- -
- -
- -
-
- -
- {{ formErrors.reason }} -
-
- -
- - - This will ask remote instances to delete it - - -
- -
- - - -
-
- -
- diff --git a/client/src/app/shared/video/modals/video-blacklist.component.scss b/client/src/app/shared/video/modals/video-blacklist.component.scss deleted file mode 100644 index afcdb9a16..000000000 --- a/client/src/app/shared/video/modals/video-blacklist.component.scss +++ /dev/null @@ -1,6 +0,0 @@ -@import 'variables'; -@import 'mixins'; - -textarea { - @include peertube-textarea(100%, 100px); -} diff --git a/client/src/app/shared/video/modals/video-blacklist.component.ts b/client/src/app/shared/video/modals/video-blacklist.component.ts deleted file mode 100644 index 6ef9c250b..000000000 --- a/client/src/app/shared/video/modals/video-blacklist.component.ts +++ /dev/null @@ -1,76 +0,0 @@ -import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core' -import { Notifier, RedirectService } from '@app/core' -import { VideoBlacklistService } from '../../../shared/video-blacklist' -import { I18n } from '@ngx-translate/i18n-polyfill' -import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' -import { NgbModal } from '@ng-bootstrap/ng-bootstrap' -import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' -import { FormReactive, VideoBlacklistValidatorsService } from '@app/shared/forms' -import { Video } from '@app/shared/video/video.model' - -@Component({ - selector: 'my-video-blacklist', - templateUrl: './video-blacklist.component.html', - styleUrls: [ './video-blacklist.component.scss' ] -}) -export class VideoBlacklistComponent extends FormReactive implements OnInit { - @Input() video: Video = null - - @ViewChild('modal', { static: true }) modal: NgbModal - - @Output() videoBlacklisted = new EventEmitter() - - error: string = null - - private openedModal: NgbModalRef - - constructor ( - protected formValidatorService: FormValidatorService, - private modalService: NgbModal, - private videoBlacklistValidatorsService: VideoBlacklistValidatorsService, - private videoBlacklistService: VideoBlacklistService, - private notifier: Notifier, - private redirectService: RedirectService, - private i18n: I18n - ) { - super() - } - - ngOnInit () { - const defaultValues = { unfederate: 'true' } - - this.buildForm({ - reason: this.videoBlacklistValidatorsService.VIDEO_BLACKLIST_REASON, - unfederate: null - }, defaultValues) - } - - show () { - this.openedModal = this.modalService.open(this.modal, { centered: true, keyboard: false }) - } - - hide () { - this.openedModal.close() - this.openedModal = null - } - - blacklist () { - const reason = this.form.value[ 'reason' ] || undefined - const unfederate = this.video.isLocal ? this.form.value[ 'unfederate' ] : undefined - - this.videoBlacklistService.blacklistVideo(this.video.id, reason, unfederate) - .subscribe( - () => { - this.notifier.success(this.i18n('Video blacklisted.')) - this.hide() - - this.video.blacklisted = true - this.video.blacklistedReason = reason - - this.videoBlacklisted.emit() - }, - - err => this.notifier.error(err.message) - ) - } -} diff --git a/client/src/app/shared/video/modals/video-block.component.html b/client/src/app/shared/video/modals/video-block.component.html new file mode 100644 index 000000000..a8dd30b5e --- /dev/null +++ b/client/src/app/shared/video/modals/video-block.component.html @@ -0,0 +1,45 @@ + +
+

Blocklist video

+ +
+ +
+ +
+
+ +
+ {{ formErrors.reason }} +
+
+ +
+ + + This will ask remote instances to delete it + + +
+ +
+ + + +
+
+ +
+ diff --git a/client/src/app/shared/video/modals/video-block.component.scss b/client/src/app/shared/video/modals/video-block.component.scss new file mode 100644 index 000000000..afcdb9a16 --- /dev/null +++ b/client/src/app/shared/video/modals/video-block.component.scss @@ -0,0 +1,6 @@ +@import 'variables'; +@import 'mixins'; + +textarea { + @include peertube-textarea(100%, 100px); +} diff --git a/client/src/app/shared/video/modals/video-block.component.ts b/client/src/app/shared/video/modals/video-block.component.ts new file mode 100644 index 000000000..1a25e0578 --- /dev/null +++ b/client/src/app/shared/video/modals/video-block.component.ts @@ -0,0 +1,75 @@ +import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core' +import { Notifier, RedirectService } from '@app/core' +import { VideoBlockService } from '../../video-block' +import { I18n } from '@ngx-translate/i18n-polyfill' +import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' +import { NgbModal } from '@ng-bootstrap/ng-bootstrap' +import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' +import { FormReactive, VideoBlockValidatorsService } from '@app/shared/forms' +import { Video } from '@app/shared/video/video.model' + +@Component({ + selector: 'my-video-block', + templateUrl: './video-block.component.html', + styleUrls: [ './video-block.component.scss' ] +}) +export class VideoBlockComponent extends FormReactive implements OnInit { + @Input() video: Video = null + + @ViewChild('modal', { static: true }) modal: NgbModal + + @Output() videoBlocked = new EventEmitter() + + error: string = null + + private openedModal: NgbModalRef + + constructor ( + protected formValidatorService: FormValidatorService, + private modalService: NgbModal, + private videoBlockValidatorsService: VideoBlockValidatorsService, + private videoBlocklistService: VideoBlockService, + private notifier: Notifier, + private i18n: I18n + ) { + super() + } + + ngOnInit () { + const defaultValues = { unfederate: 'true' } + + this.buildForm({ + reason: this.videoBlockValidatorsService.VIDEO_BLOCK_REASON, + unfederate: null + }, defaultValues) + } + + show () { + this.openedModal = this.modalService.open(this.modal, { centered: true, keyboard: false }) + } + + hide () { + this.openedModal.close() + this.openedModal = null + } + + block () { + const reason = this.form.value[ 'reason' ] || undefined + const unfederate = this.video.isLocal ? this.form.value[ 'unfederate' ] : undefined + + this.videoBlocklistService.blockVideo(this.video.id, reason, unfederate) + .subscribe( + () => { + this.notifier.success(this.i18n('Video blocked.')) + this.hide() + + this.video.blacklisted = true + this.video.blockedReason = reason + + this.videoBlocked.emit() + }, + + err => this.notifier.error(err.message) + ) + } +} diff --git a/client/src/app/shared/video/video-actions-dropdown.component.html b/client/src/app/shared/video/video-actions-dropdown.component.html index ec03fa55d..3c8271b65 100644 --- a/client/src/app/shared/video/video-actions-dropdown.component.html +++ b/client/src/app/shared/video/video-actions-dropdown.component.html @@ -17,5 +17,5 @@ - + diff --git a/client/src/app/shared/video/video-actions-dropdown.component.ts b/client/src/app/shared/video/video-actions-dropdown.component.ts index 4e5fc6476..1f5763610 100644 --- a/client/src/app/shared/video/video-actions-dropdown.component.ts +++ b/client/src/app/shared/video/video-actions-dropdown.component.ts @@ -9,8 +9,8 @@ import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap' import { VideoAddToPlaylistComponent } from '@app/shared/video-playlist/video-add-to-playlist.component' import { VideoDownloadComponent } from '@app/shared/video/modals/video-download.component' import { VideoReportComponent } from '@app/shared/video/modals/video-report.component' -import { VideoBlacklistComponent } from '@app/shared/video/modals/video-blacklist.component' -import { VideoBlacklistService } from '@app/shared/video-blacklist' +import { VideoBlockComponent } from '@app/shared/video/modals/video-block.component' +import { VideoBlockService } from '@app/shared/video-block' import { ScreenService } from '@app/shared/misc/screen.service' import { VideoCaption } from '@shared/models' import { RedundancyService } from '@app/shared/video/redundancy.service' @@ -36,7 +36,7 @@ export class VideoActionsDropdownComponent implements OnChanges { @ViewChild('videoDownloadModal') videoDownloadModal: VideoDownloadComponent @ViewChild('videoReportModal') videoReportModal: VideoReportComponent - @ViewChild('videoBlacklistModal') videoBlacklistModal: VideoBlacklistComponent + @ViewChild('videoBlockModal') videoBlockModal: VideoBlockComponent @Input() video: Video | VideoDetails @Input() videoCaptions: VideoCaption[] = [] @@ -59,8 +59,8 @@ export class VideoActionsDropdownComponent implements OnChanges { @Input() buttonDirection: DropdownDirection = 'vertical' @Output() videoRemoved = new EventEmitter() - @Output() videoUnblacklisted = new EventEmitter() - @Output() videoBlacklisted = new EventEmitter() + @Output() videoUnblocked = new EventEmitter() + @Output() videoBlocked = new EventEmitter() @Output() modalOpened = new EventEmitter() videoActions: DropdownAction<{ video: Video }>[][] = [] @@ -71,7 +71,7 @@ export class VideoActionsDropdownComponent implements OnChanges { private authService: AuthService, private notifier: Notifier, private confirmService: ConfirmService, - private videoBlacklistService: VideoBlacklistService, + private videoBlocklistService: VideoBlockService, private screenService: ScreenService, private videoService: VideoService, private redundancyService: RedundancyService, @@ -117,10 +117,10 @@ export class VideoActionsDropdownComponent implements OnChanges { this.videoReportModal.show() } - showBlacklistModal () { + showBlockModal () { this.modalOpened.emit() - this.videoBlacklistModal.show() + this.videoBlockModal.show() } /* Actions checker */ @@ -133,12 +133,12 @@ export class VideoActionsDropdownComponent implements OnChanges { return this.video.isRemovableBy(this.user) } - isVideoBlacklistable () { - return this.video.isBlackistableBy(this.user) + isVideoBlockable () { + return this.video.isBlockableBy(this.user) } - isVideoUnblacklistable () { - return this.video.isUnblacklistableBy(this.user) + isVideoUnblockable () { + return this.video.isUnblockableBy(this.user) } isVideoDownloadable () { @@ -151,22 +151,22 @@ export class VideoActionsDropdownComponent implements OnChanges { /* Action handlers */ - async unblacklistVideo () { + async unblockVideo () { const confirmMessage = this.i18n( - 'Do you really want to remove this video from the blacklist? It will be available again in the videos list.' + 'Do you really want to unblock this video? It will be available again in the videos list.' ) - const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblacklist')) + const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblock')) if (res === false) return - this.videoBlacklistService.removeVideoFromBlacklist(this.video.id).subscribe( + this.videoBlocklistService.unblockVideo(this.video.id).subscribe( () => { - this.notifier.success(this.i18n('Video {{name}} removed from the blacklist.', { name: this.video.name })) + this.notifier.success(this.i18n('Video {{name}} unblocked.', { name: this.video.name })) this.video.blacklisted = false - this.video.blacklistedReason = null + this.video.blockedReason = null - this.videoUnblacklisted.emit() + this.videoUnblocked.emit() }, err => this.notifier.error(err.message) @@ -203,8 +203,8 @@ export class VideoActionsDropdownComponent implements OnChanges { ) } - onVideoBlacklisted () { - this.videoBlacklisted.emit() + onVideoBlocked () { + this.videoBlocked.emit() } getPlaylistDropdownPlacement () { @@ -239,16 +239,16 @@ export class VideoActionsDropdownComponent implements OnChanges { isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.update && this.isVideoUpdatable() }, { - label: this.i18n('Blacklist'), - handler: () => this.showBlacklistModal(), + label: this.i18n('Block'), + handler: () => this.showBlockModal(), iconName: 'no', - isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoBlacklistable() + isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoBlockable() }, { - label: this.i18n('Unblacklist'), - handler: () => this.unblacklistVideo(), + label: this.i18n('Unblock'), + handler: () => this.unblockVideo(), iconName: 'undo', - isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoUnblacklistable() + isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoUnblockable() }, { label: this.i18n('Mirror'), diff --git a/client/src/app/shared/video/video-miniature.component.html b/client/src/app/shared/video/video-miniature.component.html index 3e23cf18c..575505f63 100644 --- a/client/src/app/shared/video/video-miniature.component.html +++ b/client/src/app/shared/video/video-miniature.component.html @@ -43,9 +43,9 @@ -
- Blacklisted - {{ video.blacklistedReason }} +
+ Blocked + {{ video.blockedReason }}
@@ -57,7 +57,7 @@
diff --git a/client/src/app/shared/video/video-miniature.component.scss b/client/src/app/shared/video/video-miniature.component.scss index 849bd54bb..34f34f228 100644 --- a/client/src/app/shared/video/video-miniature.component.scss +++ b/client/src/app/shared/video/video-miniature.component.scss @@ -45,15 +45,15 @@ $more-margin-right: 15px; } .video-info-privacy, - .video-info-blacklisted .blacklisted-label, + .video-info-blocked .blocked-label, .video-info-nsfw { font-weight: $font-semibold; } - .video-info-blacklisted { + .video-info-blocked { color: red; - .blacklisted-reason::before { + .blocked-reason::before { content: ' - '; } } @@ -160,7 +160,7 @@ $more-margin-right: 15px; margin-top: 5px; } - .video-info-blacklisted { + .video-info-blocked { margin-top: 3px; } } diff --git a/client/src/app/shared/video/video-miniature.component.ts b/client/src/app/shared/video/video-miniature.component.ts index aa1726ca7..f0b0992e2 100644 --- a/client/src/app/shared/video/video-miniature.component.ts +++ b/client/src/app/shared/video/video-miniature.component.ts @@ -59,8 +59,8 @@ export class VideoMiniatureComponent implements OnInit { @Input() useLazyLoadUrl = false - @Output() videoBlacklisted = new EventEmitter() - @Output() videoUnblacklisted = new EventEmitter() + @Output() videoBlocked = new EventEmitter() + @Output() videoUnblocked = new EventEmitter() @Output() videoRemoved = new EventEmitter() videoActionsDisplayOptions: VideoActionsDisplayType = { @@ -184,12 +184,12 @@ export class VideoMiniatureComponent implements OnInit { this.loadWatchLater() } - onVideoBlacklisted () { - this.videoBlacklisted.emit() + onVideoBlocked () { + this.videoBlocked.emit() } - onVideoUnblacklisted () { - this.videoUnblacklisted.emit() + onVideoUnblocked () { + this.videoUnblocked.emit() } onVideoRemoved () { diff --git a/client/src/app/shared/video/video.model.ts b/client/src/app/shared/video/video.model.ts index 97759f9c1..2b3d915ef 100644 --- a/client/src/app/shared/video/video.model.ts +++ b/client/src/app/shared/video/video.model.ts @@ -54,7 +54,7 @@ export class Video implements VideoServerModel { state?: VideoConstant scheduledUpdate?: VideoScheduleUpdate blacklisted?: boolean - blacklistedReason?: string + blockedReason?: string account: { id: number @@ -140,7 +140,7 @@ export class Video implements VideoServerModel { if (this.state) this.state.label = peertubeTranslate(this.state.label, translations) this.blacklisted = hash.blacklisted - this.blacklistedReason = hash.blacklistedReason + this.blockedReason = hash.blacklistedReason this.userHistory = hash.userHistory @@ -163,12 +163,12 @@ export class Video implements VideoServerModel { return user && this.isLocal === true && (this.account.name === user.username || user.hasRight(UserRight.REMOVE_ANY_VIDEO)) } - isBlackistableBy (user: AuthUser) { - return this.blacklisted !== true && user && user.hasRight(UserRight.MANAGE_VIDEO_BLACKLIST) === true + isBlockableBy (user: AuthUser) { + return this.blacklisted !== true && user && user.hasRight(UserRight.MANAGE_VIDEO_BLOCKS) === true } - isUnblacklistableBy (user: AuthUser) { - return this.blacklisted === true && user && user.hasRight(UserRight.MANAGE_VIDEO_BLACKLIST) === true + isUnblockableBy (user: AuthUser) { + return this.blacklisted === true && user && user.hasRight(UserRight.MANAGE_VIDEO_BLOCKS) === true } isUpdatableBy (user: AuthUser) { -- cgit v1.2.3