From cfde28bac33c3644e1b6218eb471b675a37def60 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Thu, 9 Jul 2020 15:54:24 +0200 Subject: Add ability to report account --- .../app/shared/shared-main/account/actor.model.ts | 6 + .../shared-main/users/user-notification.model.ts | 10 +- .../users/user-notifications.component.html | 15 ++- .../comment-report.component.html | 62 --------- .../comment-report.component.scss | 11 -- .../shared-moderation/comment-report.component.ts | 93 ------------- client/src/app/shared/shared-moderation/index.ts | 3 +- .../report-modals/account-report.component.ts | 94 +++++++++++++ .../report-modals/comment-report.component.ts | 94 +++++++++++++ .../shared-moderation/report-modals/index.ts | 3 + .../report-modals/report.component.html | 62 +++++++++ .../report-modals/report.component.scss | 27 ++++ .../report-modals/video-report.component.html | 100 ++++++++++++++ .../report-modals/video-report.component.ts | 122 +++++++++++++++++ .../shared-moderation/shared-moderation.module.ts | 15 ++- .../shared-moderation/video-report.component.html | 100 -------------- .../shared-moderation/video-report.component.scss | 27 ---- .../shared-moderation/video-report.component.ts | 122 ----------------- .../src/app/shared/shared-video-comment/index.ts | 5 + .../shared-video-comment.module.ts | 19 +++ .../video-comment-thread-tree.model.ts | 7 + .../shared-video-comment/video-comment.model.ts | 48 +++++++ .../shared-video-comment/video-comment.service.ts | 149 +++++++++++++++++++++ 23 files changed, 770 insertions(+), 424 deletions(-) delete mode 100644 client/src/app/shared/shared-moderation/comment-report.component.html delete mode 100644 client/src/app/shared/shared-moderation/comment-report.component.scss delete mode 100644 client/src/app/shared/shared-moderation/comment-report.component.ts create mode 100644 client/src/app/shared/shared-moderation/report-modals/account-report.component.ts create mode 100644 client/src/app/shared/shared-moderation/report-modals/comment-report.component.ts create mode 100644 client/src/app/shared/shared-moderation/report-modals/index.ts create mode 100644 client/src/app/shared/shared-moderation/report-modals/report.component.html create mode 100644 client/src/app/shared/shared-moderation/report-modals/report.component.scss create mode 100644 client/src/app/shared/shared-moderation/report-modals/video-report.component.html create mode 100644 client/src/app/shared/shared-moderation/report-modals/video-report.component.ts delete mode 100644 client/src/app/shared/shared-moderation/video-report.component.html delete mode 100644 client/src/app/shared/shared-moderation/video-report.component.scss delete mode 100644 client/src/app/shared/shared-moderation/video-report.component.ts create mode 100644 client/src/app/shared/shared-video-comment/index.ts create mode 100644 client/src/app/shared/shared-video-comment/shared-video-comment.module.ts create mode 100644 client/src/app/shared/shared-video-comment/video-comment-thread-tree.model.ts create mode 100644 client/src/app/shared/shared-video-comment/video-comment.model.ts create mode 100644 client/src/app/shared/shared-video-comment/video-comment.service.ts (limited to 'client/src/app/shared') diff --git a/client/src/app/shared/shared-main/account/actor.model.ts b/client/src/app/shared/shared-main/account/actor.model.ts index 9ec6dbab1..bda88bdee 100644 --- a/client/src/app/shared/shared-main/account/actor.model.ts +++ b/client/src/app/shared/shared-main/account/actor.model.ts @@ -14,6 +14,8 @@ export abstract class Actor implements ActorServer { avatarUrl: string + isLocal: boolean + static GET_ACTOR_AVATAR_URL (actor: { avatar?: { url?: string, path: string } }) { if (actor?.avatar?.url) return actor.avatar.url @@ -52,6 +54,10 @@ export abstract class Actor implements ActorServer { this.avatar = hash.avatar + const absoluteAPIUrl = getAbsoluteAPIUrl() + const thisHost = new URL(absoluteAPIUrl).host + this.isLocal = this.host.trim() === thisHost + this.updateComputedAttributes() } diff --git a/client/src/app/shared/shared-main/users/user-notification.model.ts b/client/src/app/shared/shared-main/users/user-notification.model.ts index a137f8c62..61b48a806 100644 --- a/client/src/app/shared/shared-main/users/user-notification.model.ts +++ b/client/src/app/shared/shared-main/users/user-notification.model.ts @@ -34,7 +34,9 @@ export class UserNotification implements UserNotificationServer { threadId: number video: { + id: number uuid: string + name: string } } @@ -115,13 +117,15 @@ export class UserNotification implements UserNotificationServer { case UserNotificationType.COMMENT_MENTION: if (!this.comment) break this.accountUrl = this.buildAccountUrl(this.comment.account) - this.commentUrl = [ this.buildVideoUrl(this.comment.video), { threadId: this.comment.threadId } ] + this.commentUrl = this.buildCommentUrl(this.comment) break case UserNotificationType.NEW_ABUSE_FOR_MODERATORS: this.abuseUrl = '/admin/moderation/abuses/list' if (this.abuse.video) this.videoUrl = this.buildVideoUrl(this.abuse.video) + else if (this.abuse.comment) this.commentUrl = this.buildCommentUrl(this.abuse.comment) + else if (this.abuse.account) this.accountUrl = this.buildAccountUrl(this.abuse.account) break case UserNotificationType.VIDEO_AUTO_BLACKLIST_FOR_MODERATORS: @@ -190,6 +194,10 @@ export class UserNotification implements UserNotificationServer { return videoImport.targetUrl || videoImport.magnetUri || videoImport.torrentName } + private buildCommentUrl (comment: { video: { uuid: string }, threadId: number }) { + return [ this.buildVideoUrl(comment.video), { threadId: comment.threadId } ] + } + private setAvatarUrl (actor: { avatarUrl?: string, avatar?: { url?: string, path: string } }) { actor.avatarUrl = Actor.GET_ACTOR_AVATAR_URL(actor) } diff --git a/client/src/app/shared/shared-main/users/user-notifications.component.html b/client/src/app/shared/shared-main/users/user-notifications.component.html index 2b341af2c..8127ae979 100644 --- a/client/src/app/shared/shared-main/users/user-notifications.component.html +++ b/client/src/app/shared/shared-main/users/user-notifications.component.html @@ -45,9 +45,22 @@ -
+
A new video abuse has been created on video {{ notification.abuse.video.name }}
+ +
+ A new comment abuse has been created on video {{ notification.abuse.comment.video.name }} +
+ +
+ A new account abuse has been created on account {{ notification.abuse.account.displayName }} +
+ + +
+ A new abuse has been created +
diff --git a/client/src/app/shared/shared-moderation/comment-report.component.html b/client/src/app/shared/shared-moderation/comment-report.component.html deleted file mode 100644 index 1105b3788..000000000 --- a/client/src/app/shared/shared-moderation/comment-report.component.html +++ /dev/null @@ -1,62 +0,0 @@ - -
-

Report comment

- -
- -
-
- -
-
- - - -
- - -
- - -
- - - -
- - -
- - -
- -
- -
-
- Your report will be sent to moderators of {{ currentHost }} and will be forwarded to the comment origin ({{ originHost }}) too. -
- -
- -
- {{ formErrors.reason }} -
-
-
-
- -
- - -
- -
-
- diff --git a/client/src/app/shared/shared-moderation/comment-report.component.scss b/client/src/app/shared/shared-moderation/comment-report.component.scss deleted file mode 100644 index 17a33d3a2..000000000 --- a/client/src/app/shared/shared-moderation/comment-report.component.scss +++ /dev/null @@ -1,11 +0,0 @@ -@import 'variables'; -@import 'mixins'; - -.information { - margin-bottom: 20px; -} - -textarea { - @include peertube-textarea(100%, 100px); -} - diff --git a/client/src/app/shared/shared-moderation/comment-report.component.ts b/client/src/app/shared/shared-moderation/comment-report.component.ts deleted file mode 100644 index 5db4b2dc1..000000000 --- a/client/src/app/shared/shared-moderation/comment-report.component.ts +++ /dev/null @@ -1,93 +0,0 @@ -import { mapValues, pickBy } from 'lodash-es' -import { Component, Input, OnInit, ViewChild } from '@angular/core' -import { SafeHtml } from '@angular/platform-browser' -import { VideoComment } from '@app/+videos/+video-watch/comment/video-comment.model' -import { Notifier } from '@app/core' -import { AbuseValidatorsService, FormReactive, FormValidatorService } from '@app/shared/shared-forms' -import { NgbModal } from '@ng-bootstrap/ng-bootstrap' -import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' -import { I18n } from '@ngx-translate/i18n-polyfill' -import { abusePredefinedReasonsMap, AbusePredefinedReasonsString } from '@shared/models' -import { AbuseService } from './abuse.service' - -@Component({ - selector: 'my-comment-report', - templateUrl: './comment-report.component.html', - styleUrls: [ './comment-report.component.scss' ] -}) -export class CommentReportComponent extends FormReactive implements OnInit { - @Input() comment: VideoComment = null - - @ViewChild('modal', { static: true }) modal: NgbModal - - error: string = null - predefinedReasons: { id: AbusePredefinedReasonsString, label: string, description?: string, help?: string }[] = [] - embedHtml: SafeHtml - - private openedModal: NgbModalRef - - constructor ( - protected formValidatorService: FormValidatorService, - private modalService: NgbModal, - private abuseValidatorsService: AbuseValidatorsService, - private abuseService: AbuseService, - private notifier: Notifier, - private i18n: I18n - ) { - super() - } - - get currentHost () { - return window.location.host - } - - get originHost () { - if (this.isRemoteComment()) { - return this.comment.account.host - } - - return '' - } - - ngOnInit () { - this.buildForm({ - reason: this.abuseValidatorsService.ABUSE_REASON, - predefinedReasons: mapValues(abusePredefinedReasonsMap, r => null) - }) - - this.predefinedReasons = this.abuseService.getPrefefinedReasons('comment') - } - - show () { - this.openedModal = this.modalService.open(this.modal, { centered: true, keyboard: false, size: 'lg' }) - } - - hide () { - this.openedModal.close() - this.openedModal = null - } - - report () { - const reason = this.form.get('reason').value - const predefinedReasons = Object.keys(pickBy(this.form.get('predefinedReasons').value)) as AbusePredefinedReasonsString[] - - this.abuseService.reportVideo({ - reason, - predefinedReasons, - comment: { - id: this.comment.id - } - }).subscribe( - () => { - this.notifier.success(this.i18n('Comment reported.')) - this.hide() - }, - - err => this.notifier.error(err.message) - ) - } - - isRemoteComment () { - return !this.comment.isLocal - } -} diff --git a/client/src/app/shared/shared-moderation/index.ts b/client/src/app/shared/shared-moderation/index.ts index d6c4a10be..41c910ffe 100644 --- a/client/src/app/shared/shared-moderation/index.ts +++ b/client/src/app/shared/shared-moderation/index.ts @@ -1,3 +1,5 @@ +export * from './report-modals' + export * from './abuse.service' export * from './account-block.model' export * from './account-blocklist.component' @@ -9,5 +11,4 @@ export * from './user-ban-modal.component' export * from './user-moderation-dropdown.component' export * from './video-block.component' export * from './video-block.service' -export * from './video-report.component' export * from './shared-moderation.module' diff --git a/client/src/app/shared/shared-moderation/report-modals/account-report.component.ts b/client/src/app/shared/shared-moderation/report-modals/account-report.component.ts new file mode 100644 index 000000000..78ca934c7 --- /dev/null +++ b/client/src/app/shared/shared-moderation/report-modals/account-report.component.ts @@ -0,0 +1,94 @@ +import { mapValues, pickBy } from 'lodash-es' +import { Component, Input, OnInit, ViewChild } from '@angular/core' +import { Notifier } from '@app/core' +import { AbuseValidatorsService, FormReactive, FormValidatorService } from '@app/shared/shared-forms' +import { Account } from '@app/shared/shared-main' +import { NgbModal } from '@ng-bootstrap/ng-bootstrap' +import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' +import { I18n } from '@ngx-translate/i18n-polyfill' +import { abusePredefinedReasonsMap, AbusePredefinedReasonsString } from '@shared/models' +import { AbuseService } from '../abuse.service' + +@Component({ + selector: 'my-account-report', + templateUrl: './report.component.html', + styleUrls: [ './report.component.scss' ] +}) +export class AccountReportComponent extends FormReactive implements OnInit { + @Input() account: Account = null + + @ViewChild('modal', { static: true }) modal: NgbModal + + error: string = null + predefinedReasons: { id: AbusePredefinedReasonsString, label: string, description?: string, help?: string }[] = [] + modalTitle: string + + private openedModal: NgbModalRef + + constructor ( + protected formValidatorService: FormValidatorService, + private modalService: NgbModal, + private abuseValidatorsService: AbuseValidatorsService, + private abuseService: AbuseService, + private notifier: Notifier, + private i18n: I18n + ) { + super() + } + + get currentHost () { + return window.location.host + } + + get originHost () { + if (this.isRemote()) { + return this.account.host + } + + return '' + } + + ngOnInit () { + this.modalTitle = this.i18n('Report {{displayName}}', { displayName: this.account.displayName }) + + this.buildForm({ + reason: this.abuseValidatorsService.ABUSE_REASON, + predefinedReasons: mapValues(abusePredefinedReasonsMap, r => null) + }) + + this.predefinedReasons = this.abuseService.getPrefefinedReasons('account') + } + + show () { + this.openedModal = this.modalService.open(this.modal, { centered: true, keyboard: false, size: 'lg' }) + } + + hide () { + this.openedModal.close() + this.openedModal = null + } + + report () { + const reason = this.form.get('reason').value + const predefinedReasons = Object.keys(pickBy(this.form.get('predefinedReasons').value)) as AbusePredefinedReasonsString[] + + this.abuseService.reportVideo({ + reason, + predefinedReasons, + account: { + id: this.account.id + } + }).subscribe( + () => { + this.notifier.success(this.i18n('Account reported.')) + this.hide() + }, + + err => this.notifier.error(err.message) + ) + } + + isRemote () { + return !this.account.isLocal + } +} diff --git a/client/src/app/shared/shared-moderation/report-modals/comment-report.component.ts b/client/src/app/shared/shared-moderation/report-modals/comment-report.component.ts new file mode 100644 index 000000000..00d7b8d34 --- /dev/null +++ b/client/src/app/shared/shared-moderation/report-modals/comment-report.component.ts @@ -0,0 +1,94 @@ +import { mapValues, pickBy } from 'lodash-es' +import { Component, Input, OnInit, ViewChild } from '@angular/core' +import { Notifier } from '@app/core' +import { AbuseValidatorsService, FormReactive, FormValidatorService } from '@app/shared/shared-forms' +import { VideoComment } from '@app/shared/shared-video-comment' +import { NgbModal } from '@ng-bootstrap/ng-bootstrap' +import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' +import { I18n } from '@ngx-translate/i18n-polyfill' +import { abusePredefinedReasonsMap, AbusePredefinedReasonsString } from '@shared/models' +import { AbuseService } from '../abuse.service' + +@Component({ + selector: 'my-comment-report', + templateUrl: './report.component.html', + styleUrls: [ './report.component.scss' ] +}) +export class CommentReportComponent extends FormReactive implements OnInit { + @Input() comment: VideoComment = null + + @ViewChild('modal', { static: true }) modal: NgbModal + + modalTitle: string + error: string = null + predefinedReasons: { id: AbusePredefinedReasonsString, label: string, description?: string, help?: string }[] = [] + + private openedModal: NgbModalRef + + constructor ( + protected formValidatorService: FormValidatorService, + private modalService: NgbModal, + private abuseValidatorsService: AbuseValidatorsService, + private abuseService: AbuseService, + private notifier: Notifier, + private i18n: I18n + ) { + super() + } + + get currentHost () { + return window.location.host + } + + get originHost () { + if (this.isRemote()) { + return this.comment.account.host + } + + return '' + } + + ngOnInit () { + this.modalTitle = this.i18n('Report comment') + + this.buildForm({ + reason: this.abuseValidatorsService.ABUSE_REASON, + predefinedReasons: mapValues(abusePredefinedReasonsMap, r => null) + }) + + this.predefinedReasons = this.abuseService.getPrefefinedReasons('comment') + } + + show () { + this.openedModal = this.modalService.open(this.modal, { centered: true, keyboard: false, size: 'lg' }) + } + + hide () { + this.openedModal.close() + this.openedModal = null + } + + report () { + const reason = this.form.get('reason').value + const predefinedReasons = Object.keys(pickBy(this.form.get('predefinedReasons').value)) as AbusePredefinedReasonsString[] + + this.abuseService.reportVideo({ + reason, + predefinedReasons, + comment: { + id: this.comment.id + } + }).subscribe( + () => { + this.notifier.success(this.i18n('Comment reported.')) + this.hide() + }, + + err => this.notifier.error(err.message) + ) + } + + isRemote () { + return !this.comment.isLocal + } +} diff --git a/client/src/app/shared/shared-moderation/report-modals/index.ts b/client/src/app/shared/shared-moderation/report-modals/index.ts new file mode 100644 index 000000000..f3c4058ae --- /dev/null +++ b/client/src/app/shared/shared-moderation/report-modals/index.ts @@ -0,0 +1,3 @@ +export * from './account-report.component' +export * from './comment-report.component' +export * from './video-report.component' diff --git a/client/src/app/shared/shared-moderation/report-modals/report.component.html b/client/src/app/shared/shared-moderation/report-modals/report.component.html new file mode 100644 index 000000000..bda62312f --- /dev/null +++ b/client/src/app/shared/shared-moderation/report-modals/report.component.html @@ -0,0 +1,62 @@ + +
+

{{ modalTitle }}

+ +
+ +
+
+ +
+
+ + + +
+ + +
+ + +
+ + + +
+ + +
+ + +
+ +
+ +
+
+ Your report will be sent to moderators of {{ currentHost }} and will be forwarded to the comment origin ({{ originHost }}) too. +
+ +
+ +
+ {{ formErrors.reason }} +
+
+
+
+ +
+ + +
+ +
+
+ diff --git a/client/src/app/shared/shared-moderation/report-modals/report.component.scss b/client/src/app/shared/shared-moderation/report-modals/report.component.scss new file mode 100644 index 000000000..b2606cbd8 --- /dev/null +++ b/client/src/app/shared/shared-moderation/report-modals/report.component.scss @@ -0,0 +1,27 @@ +@import 'variables'; +@import 'mixins'; + +.information { + margin-bottom: 20px; +} + +textarea { + @include peertube-textarea(100%, 100px); +} + +.start-at, +.stop-at { + width: 300px; + display: flex; + align-items: center; + + my-timestamp-input { + margin-left: 10px; + } +} + +.screenratio { + @include large-screen-ratio($selector: 'div, ::ng-deep iframe') { + left: 0; + }; +} diff --git a/client/src/app/shared/shared-moderation/report-modals/video-report.component.html b/client/src/app/shared/shared-moderation/report-modals/video-report.component.html new file mode 100644 index 000000000..4947088d1 --- /dev/null +++ b/client/src/app/shared/shared-moderation/report-modals/video-report.component.html @@ -0,0 +1,100 @@ + +
+

Report video "{{ video.name }}"

+ +
+ +
+
+ +
+
+ + + +
+ + +
+ + +
+ + + +
+ + +
+ + +
+ +
+ +
+
+
+
+
+
+
+
+ +
+ + + + +
+ +
+ + + + +
+ +
+ Your report will be sent to moderators of {{ currentHost }} and will be forwarded to the video origin ({{ originHost }}) too. +
+ +
+ +
+ {{ formErrors.reason }} +
+
+
+
+ +
+ + +
+ +
+
+ diff --git a/client/src/app/shared/shared-moderation/report-modals/video-report.component.ts b/client/src/app/shared/shared-moderation/report-modals/video-report.component.ts new file mode 100644 index 000000000..7d53ea3c9 --- /dev/null +++ b/client/src/app/shared/shared-moderation/report-modals/video-report.component.ts @@ -0,0 +1,122 @@ +import { mapValues, pickBy } from 'lodash-es' +import { buildVideoEmbed, buildVideoLink } from 'src/assets/player/utils' +import { Component, Input, OnInit, ViewChild } from '@angular/core' +import { DomSanitizer, SafeHtml } from '@angular/platform-browser' +import { Notifier } from '@app/core' +import { AbuseValidatorsService, FormReactive, FormValidatorService } from '@app/shared/shared-forms' +import { NgbModal } from '@ng-bootstrap/ng-bootstrap' +import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' +import { I18n } from '@ngx-translate/i18n-polyfill' +import { abusePredefinedReasonsMap, AbusePredefinedReasonsString } from '@shared/models' +import { Video } from '../../shared-main' +import { AbuseService } from '../abuse.service' + +@Component({ + selector: 'my-video-report', + templateUrl: './video-report.component.html', + styleUrls: [ './report.component.scss' ] +}) +export class VideoReportComponent extends FormReactive implements OnInit { + @Input() video: Video = null + + @ViewChild('modal', { static: true }) modal: NgbModal + + error: string = null + predefinedReasons: { id: AbusePredefinedReasonsString, label: string, description?: string, help?: string }[] = [] + embedHtml: SafeHtml + + private openedModal: NgbModalRef + + constructor ( + protected formValidatorService: FormValidatorService, + private modalService: NgbModal, + private abuseValidatorsService: AbuseValidatorsService, + private abuseService: AbuseService, + private notifier: Notifier, + private sanitizer: DomSanitizer, + private i18n: I18n + ) { + super() + } + + get currentHost () { + return window.location.host + } + + get originHost () { + if (this.isRemote()) { + return this.video.account.host + } + + return '' + } + + get timestamp () { + return this.form.get('timestamp').value + } + + getVideoEmbed () { + return this.sanitizer.bypassSecurityTrustHtml( + buildVideoEmbed( + buildVideoLink({ + baseUrl: this.video.embedUrl, + title: false, + warningTitle: false + }) + ) + ) + } + + ngOnInit () { + this.buildForm({ + reason: this.abuseValidatorsService.ABUSE_REASON, + predefinedReasons: mapValues(abusePredefinedReasonsMap, r => null), + timestamp: { + hasStart: null, + startAt: null, + hasEnd: null, + endAt: null + } + }) + + this.predefinedReasons = this.abuseService.getPrefefinedReasons('video') + + this.embedHtml = this.getVideoEmbed() + } + + show () { + this.openedModal = this.modalService.open(this.modal, { centered: true, keyboard: false, size: 'lg' }) + } + + hide () { + this.openedModal.close() + this.openedModal = null + } + + report () { + const reason = this.form.get('reason').value + const predefinedReasons = Object.keys(pickBy(this.form.get('predefinedReasons').value)) as AbusePredefinedReasonsString[] + const { hasStart, startAt, hasEnd, endAt } = this.form.get('timestamp').value + + this.abuseService.reportVideo({ + reason, + predefinedReasons, + video: { + id: this.video.id, + startAt: hasStart && startAt ? startAt : undefined, + endAt: hasEnd && endAt ? endAt : undefined + } + }).subscribe( + () => { + this.notifier.success(this.i18n('Video reported.')) + this.hide() + }, + + err => this.notifier.error(err.message) + ) + } + + isRemote () { + return !this.video.isLocal + } +} diff --git a/client/src/app/shared/shared-moderation/shared-moderation.module.ts b/client/src/app/shared/shared-moderation/shared-moderation.module.ts index ff4021a33..8fa9ee794 100644 --- a/client/src/app/shared/shared-moderation/shared-moderation.module.ts +++ b/client/src/app/shared/shared-moderation/shared-moderation.module.ts @@ -3,22 +3,23 @@ import { NgModule } from '@angular/core' import { SharedFormModule } from '../shared-forms/shared-form.module' import { SharedGlobalIconModule } from '../shared-icons' import { SharedMainModule } from '../shared-main/shared-main.module' +import { SharedVideoCommentModule } from '../shared-video-comment' +import { AbuseService } from './abuse.service' import { BatchDomainsModalComponent } from './batch-domains-modal.component' import { BlocklistService } from './blocklist.service' import { BulkService } from './bulk.service' import { UserBanModalComponent } from './user-ban-modal.component' import { UserModerationDropdownComponent } from './user-moderation-dropdown.component' -import { AbuseService } from './abuse.service' import { VideoBlockComponent } from './video-block.component' import { VideoBlockService } from './video-block.service' -import { VideoReportComponent } from './video-report.component' -import { CommentReportComponent } from './comment-report.component' +import { VideoReportComponent, AccountReportComponent, CommentReportComponent } from './report-modals' @NgModule({ imports: [ SharedMainModule, SharedFormModule, - SharedGlobalIconModule + SharedGlobalIconModule, + SharedVideoCommentModule ], declarations: [ @@ -27,7 +28,8 @@ import { CommentReportComponent } from './comment-report.component' VideoBlockComponent, VideoReportComponent, BatchDomainsModalComponent, - CommentReportComponent + CommentReportComponent, + AccountReportComponent ], exports: [ @@ -36,7 +38,8 @@ import { CommentReportComponent } from './comment-report.component' VideoBlockComponent, VideoReportComponent, BatchDomainsModalComponent, - CommentReportComponent + CommentReportComponent, + AccountReportComponent ], providers: [ diff --git a/client/src/app/shared/shared-moderation/video-report.component.html b/client/src/app/shared/shared-moderation/video-report.component.html deleted file mode 100644 index b724ecb18..000000000 --- a/client/src/app/shared/shared-moderation/video-report.component.html +++ /dev/null @@ -1,100 +0,0 @@ - -
-

Report video "{{ video.name }}"

- -
- -
-
- -
-
- - - -
- - -
- - -
- - - -
- - -
- - -
- -
- -
-
-
-
-
-
-
-
- -
- - - - -
- -
- - - - -
- -
- Your report will be sent to moderators of {{ currentHost }} and will be forwarded to the video origin ({{ originHost }}) too. -
- -
- -
- {{ formErrors.reason }} -
-
-
-
- -
- - -
- -
-
- diff --git a/client/src/app/shared/shared-moderation/video-report.component.scss b/client/src/app/shared/shared-moderation/video-report.component.scss deleted file mode 100644 index b2606cbd8..000000000 --- a/client/src/app/shared/shared-moderation/video-report.component.scss +++ /dev/null @@ -1,27 +0,0 @@ -@import 'variables'; -@import 'mixins'; - -.information { - margin-bottom: 20px; -} - -textarea { - @include peertube-textarea(100%, 100px); -} - -.start-at, -.stop-at { - width: 300px; - display: flex; - align-items: center; - - my-timestamp-input { - margin-left: 10px; - } -} - -.screenratio { - @include large-screen-ratio($selector: 'div, ::ng-deep iframe') { - left: 0; - }; -} diff --git a/client/src/app/shared/shared-moderation/video-report.component.ts b/client/src/app/shared/shared-moderation/video-report.component.ts deleted file mode 100644 index 26e7b62ba..000000000 --- a/client/src/app/shared/shared-moderation/video-report.component.ts +++ /dev/null @@ -1,122 +0,0 @@ -import { mapValues, pickBy } from 'lodash-es' -import { buildVideoEmbed, buildVideoLink } from 'src/assets/player/utils' -import { Component, Input, OnInit, ViewChild } from '@angular/core' -import { DomSanitizer, SafeHtml } from '@angular/platform-browser' -import { Notifier } from '@app/core' -import { AbuseValidatorsService, FormReactive, FormValidatorService } from '@app/shared/shared-forms' -import { NgbModal } from '@ng-bootstrap/ng-bootstrap' -import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' -import { I18n } from '@ngx-translate/i18n-polyfill' -import { abusePredefinedReasonsMap, AbusePredefinedReasonsString } from '@shared/models' -import { Video } from '../shared-main' -import { AbuseService } from './abuse.service' - -@Component({ - selector: 'my-video-report', - templateUrl: './video-report.component.html', - styleUrls: [ './video-report.component.scss' ] -}) -export class VideoReportComponent extends FormReactive implements OnInit { - @Input() video: Video = null - - @ViewChild('modal', { static: true }) modal: NgbModal - - error: string = null - predefinedReasons: { id: AbusePredefinedReasonsString, label: string, description?: string, help?: string }[] = [] - embedHtml: SafeHtml - - private openedModal: NgbModalRef - - constructor ( - protected formValidatorService: FormValidatorService, - private modalService: NgbModal, - private abuseValidatorsService: AbuseValidatorsService, - private abuseService: AbuseService, - private notifier: Notifier, - private sanitizer: DomSanitizer, - private i18n: I18n - ) { - super() - } - - get currentHost () { - return window.location.host - } - - get originHost () { - if (this.isRemoteVideo()) { - return this.video.account.host - } - - return '' - } - - get timestamp () { - return this.form.get('timestamp').value - } - - getVideoEmbed () { - return this.sanitizer.bypassSecurityTrustHtml( - buildVideoEmbed( - buildVideoLink({ - baseUrl: this.video.embedUrl, - title: false, - warningTitle: false - }) - ) - ) - } - - ngOnInit () { - this.buildForm({ - reason: this.abuseValidatorsService.ABUSE_REASON, - predefinedReasons: mapValues(abusePredefinedReasonsMap, r => null), - timestamp: { - hasStart: null, - startAt: null, - hasEnd: null, - endAt: null - } - }) - - this.predefinedReasons = this.abuseService.getPrefefinedReasons('video') - - this.embedHtml = this.getVideoEmbed() - } - - show () { - this.openedModal = this.modalService.open(this.modal, { centered: true, keyboard: false, size: 'lg' }) - } - - hide () { - this.openedModal.close() - this.openedModal = null - } - - report () { - const reason = this.form.get('reason').value - const predefinedReasons = Object.keys(pickBy(this.form.get('predefinedReasons').value)) as AbusePredefinedReasonsString[] - const { hasStart, startAt, hasEnd, endAt } = this.form.get('timestamp').value - - this.abuseService.reportVideo({ - reason, - predefinedReasons, - video: { - id: this.video.id, - startAt: hasStart && startAt ? startAt : undefined, - endAt: hasEnd && endAt ? endAt : undefined - } - }).subscribe( - () => { - this.notifier.success(this.i18n('Video reported.')) - this.hide() - }, - - err => this.notifier.error(err.message) - ) - } - - isRemoteVideo () { - return !this.video.isLocal - } -} diff --git a/client/src/app/shared/shared-video-comment/index.ts b/client/src/app/shared/shared-video-comment/index.ts new file mode 100644 index 000000000..b1195f232 --- /dev/null +++ b/client/src/app/shared/shared-video-comment/index.ts @@ -0,0 +1,5 @@ +export * from './video-comment.service' +export * from './video-comment.model' +export * from './video-comment-thread-tree.model' + +export * from './shared-video-comment.module' diff --git a/client/src/app/shared/shared-video-comment/shared-video-comment.module.ts b/client/src/app/shared/shared-video-comment/shared-video-comment.module.ts new file mode 100644 index 000000000..41b329861 --- /dev/null +++ b/client/src/app/shared/shared-video-comment/shared-video-comment.module.ts @@ -0,0 +1,19 @@ + +import { NgModule } from '@angular/core' +import { SharedMainModule } from '../shared-main/shared-main.module' +import { VideoCommentService } from './video-comment.service' + +@NgModule({ + imports: [ + SharedMainModule + ], + + declarations: [ ], + + exports: [ ], + + providers: [ + VideoCommentService + ] +}) +export class SharedVideoCommentModule { } diff --git a/client/src/app/shared/shared-video-comment/video-comment-thread-tree.model.ts b/client/src/app/shared/shared-video-comment/video-comment-thread-tree.model.ts new file mode 100644 index 000000000..7c2aaeadd --- /dev/null +++ b/client/src/app/shared/shared-video-comment/video-comment-thread-tree.model.ts @@ -0,0 +1,7 @@ +import { VideoCommentThreadTree as VideoCommentThreadTreeServerModel } from '@shared/models' +import { VideoComment } from './video-comment.model' + +export class VideoCommentThreadTree implements VideoCommentThreadTreeServerModel { + comment: VideoComment + children: VideoCommentThreadTree[] +} diff --git a/client/src/app/shared/shared-video-comment/video-comment.model.ts b/client/src/app/shared/shared-video-comment/video-comment.model.ts new file mode 100644 index 000000000..e85443196 --- /dev/null +++ b/client/src/app/shared/shared-video-comment/video-comment.model.ts @@ -0,0 +1,48 @@ +import { getAbsoluteAPIUrl } from '@app/helpers' +import { Actor } from '@app/shared/shared-main' +import { Account as AccountInterface, VideoComment as VideoCommentServerModel } from '@shared/models' + +export class VideoComment implements VideoCommentServerModel { + id: number + url: string + text: string + threadId: number + inReplyToCommentId: number + videoId: number + createdAt: Date | string + updatedAt: Date | string + deletedAt: Date | string + isDeleted: boolean + account: AccountInterface + totalRepliesFromVideoAuthor: number + totalReplies: number + by: string + accountAvatarUrl: string + + isLocal: boolean + + constructor (hash: VideoCommentServerModel) { + this.id = hash.id + this.url = hash.url + this.text = hash.text + this.threadId = hash.threadId + this.inReplyToCommentId = hash.inReplyToCommentId + this.videoId = hash.videoId + this.createdAt = new Date(hash.createdAt.toString()) + this.updatedAt = new Date(hash.updatedAt.toString()) + this.deletedAt = hash.deletedAt ? new Date(hash.deletedAt.toString()) : null + this.isDeleted = hash.isDeleted + this.account = hash.account + this.totalRepliesFromVideoAuthor = hash.totalRepliesFromVideoAuthor + this.totalReplies = hash.totalReplies + + if (this.account) { + this.by = Actor.CREATE_BY_STRING(this.account.name, this.account.host) + this.accountAvatarUrl = Actor.GET_ACTOR_AVATAR_URL(this.account) + + const absoluteAPIUrl = getAbsoluteAPIUrl() + const thisHost = new URL(absoluteAPIUrl).host + this.isLocal = this.account.host.trim() === thisHost + } + } +} diff --git a/client/src/app/shared/shared-video-comment/video-comment.service.ts b/client/src/app/shared/shared-video-comment/video-comment.service.ts new file mode 100644 index 000000000..81c65aa38 --- /dev/null +++ b/client/src/app/shared/shared-video-comment/video-comment.service.ts @@ -0,0 +1,149 @@ +import { Observable } from 'rxjs' +import { catchError, map } from 'rxjs/operators' +import { HttpClient, HttpParams } from '@angular/common/http' +import { Injectable } from '@angular/core' +import { ComponentPaginationLight, RestExtractor, RestService } from '@app/core' +import { objectLineFeedToHtml } from '@app/helpers' +import { + FeedFormat, + ResultList, + VideoComment as VideoCommentServerModel, + VideoCommentCreate, + VideoCommentThreadTree as VideoCommentThreadTreeServerModel +} from '@shared/models' +import { environment } from '../../../environments/environment' +import { VideoCommentThreadTree } from './video-comment-thread-tree.model' +import { VideoComment } from './video-comment.model' + +@Injectable() +export class VideoCommentService { + private static BASE_VIDEO_URL = environment.apiUrl + '/api/v1/videos/' + private static BASE_FEEDS_URL = environment.apiUrl + '/feeds/video-comments.' + + constructor ( + private authHttp: HttpClient, + private restExtractor: RestExtractor, + private restService: RestService + ) {} + + addCommentThread (videoId: number | string, comment: VideoCommentCreate) { + const url = VideoCommentService.BASE_VIDEO_URL + videoId + '/comment-threads' + const normalizedComment = objectLineFeedToHtml(comment, 'text') + + return this.authHttp.post<{ comment: VideoCommentServerModel }>(url, normalizedComment) + .pipe( + map(data => this.extractVideoComment(data.comment)), + catchError(err => this.restExtractor.handleError(err)) + ) + } + + addCommentReply (videoId: number | string, inReplyToCommentId: number, comment: VideoCommentCreate) { + const url = VideoCommentService.BASE_VIDEO_URL + videoId + '/comments/' + inReplyToCommentId + const normalizedComment = objectLineFeedToHtml(comment, 'text') + + return this.authHttp.post<{ comment: VideoCommentServerModel }>(url, normalizedComment) + .pipe( + map(data => this.extractVideoComment(data.comment)), + catchError(err => this.restExtractor.handleError(err)) + ) + } + + getVideoCommentThreads (parameters: { + videoId: number | string, + componentPagination: ComponentPaginationLight, + sort: string + }): Observable> { + const { videoId, componentPagination, sort } = parameters + + const pagination = this.restService.componentPaginationToRestPagination(componentPagination) + + let params = new HttpParams() + params = this.restService.addRestGetParams(params, pagination, sort) + + const url = VideoCommentService.BASE_VIDEO_URL + videoId + '/comment-threads' + return this.authHttp.get>(url, { params }) + .pipe( + map(result => this.extractVideoComments(result)), + catchError(err => this.restExtractor.handleError(err)) + ) + } + + getVideoThreadComments (parameters: { + videoId: number | string, + threadId: number + }): Observable { + const { videoId, threadId } = parameters + const url = `${VideoCommentService.BASE_VIDEO_URL + videoId}/comment-threads/${threadId}` + + return this.authHttp + .get(url) + .pipe( + map(tree => this.extractVideoCommentTree(tree)), + catchError(err => this.restExtractor.handleError(err)) + ) + } + + deleteVideoComment (videoId: number | string, commentId: number) { + const url = `${VideoCommentService.BASE_VIDEO_URL + videoId}/comments/${commentId}` + + return this.authHttp + .delete(url) + .pipe( + map(this.restExtractor.extractDataBool), + catchError(err => this.restExtractor.handleError(err)) + ) + } + + getVideoCommentsFeeds (videoUUID?: string) { + const feeds = [ + { + format: FeedFormat.RSS, + label: 'rss 2.0', + url: VideoCommentService.BASE_FEEDS_URL + FeedFormat.RSS.toLowerCase() + }, + { + format: FeedFormat.ATOM, + label: 'atom 1.0', + url: VideoCommentService.BASE_FEEDS_URL + FeedFormat.ATOM.toLowerCase() + }, + { + format: FeedFormat.JSON, + label: 'json 1.0', + url: VideoCommentService.BASE_FEEDS_URL + FeedFormat.JSON.toLowerCase() + } + ] + + if (videoUUID !== undefined) { + for (const feed of feeds) { + feed.url += '?videoId=' + videoUUID + } + } + + return feeds + } + + private extractVideoComment (videoComment: VideoCommentServerModel) { + return new VideoComment(videoComment) + } + + private extractVideoComments (result: ResultList) { + const videoCommentsJson = result.data + const totalComments = result.total + const comments: VideoComment[] = [] + + for (const videoCommentJson of videoCommentsJson) { + comments.push(new VideoComment(videoCommentJson)) + } + + return { data: comments, total: totalComments } + } + + private extractVideoCommentTree (tree: VideoCommentThreadTreeServerModel) { + if (!tree) return tree as VideoCommentThreadTree + + tree.comment = new VideoComment(tree.comment) + tree.children.forEach(c => this.extractVideoCommentTree(c)) + + return tree as VideoCommentThreadTree + } +} -- cgit v1.2.3