X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2F%2Bvideo-watch%2Fcomment%2Fvideo-comments.component.ts;h=bba9f13721f52cc7c24497d6911f4bcf39840b52;hb=0c4bacbff53bc732f5a2677d62a6ead7752e2405;hp=cc8b98b4e93b9df0d69935a10cfae791efc08e0b;hpb=69222afac8f8c41d90295b33f0695bbff352851e;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/videos/+video-watch/comment/video-comments.component.ts b/client/src/app/videos/+video-watch/comment/video-comments.component.ts index cc8b98b4e..bba9f1372 100644 --- a/client/src/app/videos/+video-watch/comment/video-comments.component.ts +++ b/client/src/app/videos/+video-watch/comment/video-comments.component.ts @@ -1,18 +1,18 @@ -import { Component, ElementRef, Input, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewChild } from '@angular/core' +import { Component, ElementRef, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core' import { ActivatedRoute } from '@angular/router' import { ConfirmService, Notifier } from '@app/core' import { Subject, Subscription } from 'rxjs' -import { VideoCommentThreadTree } from '../../../../../../shared/models/videos/video-comment.model' import { AuthService } from '../../../core/auth' import { ComponentPagination, hasMoreItems } from '../../../shared/rest/component-pagination.model' import { User } from '../../../shared/users' -import { VideoSortField } from '../../../shared/video/sort-field.type' +import { CommentSortField } from '../../../shared/video/sort-field.type' import { VideoDetails } from '../../../shared/video/video-details.model' import { VideoComment } from './video-comment.model' import { VideoCommentService } from './video-comment.service' import { I18n } from '@ngx-translate/i18n-polyfill' import { Syndication } from '@app/shared/video/syndication.model' import { HooksService } from '@app/core/plugins/hooks.service' +import { VideoCommentThreadTree } from '@app/videos/+video-watch/comment/video-comment-thread-tree.model' @Component({ selector: 'my-video-comments', @@ -20,13 +20,15 @@ import { HooksService } from '@app/core/plugins/hooks.service' styleUrls: ['./video-comments.component.scss'] }) export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { - @ViewChild('commentHighlightBlock', { static: false }) commentHighlightBlock: ElementRef + @ViewChild('commentHighlightBlock') commentHighlightBlock: ElementRef @Input() video: VideoDetails @Input() user: User + @Output() timestampClicked = new EventEmitter() + comments: VideoComment[] = [] highlightedThread: VideoComment - sort: VideoSortField = '-createdAt' + sort: CommentSortField = '-createdAt' componentPagination: ComponentPagination = { currentPage: 1, itemsPerPage: 10, @@ -94,6 +96,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { res => { this.threadComments[commentId] = res this.threadLoading[commentId] = false + this.hooks.runAction('action:video-watch.video-thread-replies.loaded', 'video-watch', { data: res }) if (highlightThread) { this.highlightedThread = new VideoComment(res.comment) @@ -128,6 +131,7 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { this.componentPagination.totalItems = res.total this.onDataSubject.next(res.data) + this.hooks.runAction('action:video-watch.video-threads.loaded', 'video-watch', { data: this.componentPagination }) }, err => this.notifier.error(err.message) @@ -150,11 +154,22 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { this.viewReplies(commentTree.comment.id) } + handleSortChange (sort: CommentSortField) { + if (this.sort === sort) return + + this.sort = sort + this.resetVideo() + } + + handleTimestampClicked (timestamp: number) { + this.timestampClicked.emit(timestamp) + } + async onWantedToDelete (commentToDelete: VideoComment) { let message = 'Do you really want to delete this comment?' - if (commentToDelete.isLocal) { - message += this.i18n(' The deletion will be sent to remote instances, so they remove the comment too.') + if (commentToDelete.isLocal || this.video.isLocal) { + message += this.i18n(' The deletion will be sent to remote instances so they can reflect the change.') } else { message += this.i18n(' It is a remote comment, so the deletion will only be effective on your instance.') } @@ -165,10 +180,14 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { this.videoCommentService.deleteVideoComment(commentToDelete.videoId, commentToDelete.id) .subscribe( () => { + if (this.highlightedThread?.id === commentToDelete.id) { + commentToDelete = this.comments.find(c => c.id === commentToDelete.id) + + this.highlightedThread = undefined + } + // Mark the comment as deleted this.softDeleteComment(commentToDelete) - - if (this.highlightedThread.id === commentToDelete.id) this.highlightedThread = undefined }, err => this.notifier.error(err.message) @@ -180,9 +199,8 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { } onNearOfBottom () { - this.componentPagination.currentPage++ - if (hasMoreItems(this.componentPagination)) { + this.componentPagination.currentPage++ this.loadMoreThreads() } } @@ -206,7 +224,6 @@ export class VideoCommentsComponent implements OnInit, OnChanges, OnDestroy { this.componentPagination.totalItems = null this.syndicationItems = this.videoCommentService.getVideoCommentsFeeds(this.video.uuid) - this.loadMoreThreads() } }