import { finalize } from 'rxjs/operators'
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
import { AuthService, Notifier } from '@app/core'
-import { VideoFilter, VideoSortField } from '@shared/models'
+import { VideoSortField } from '@shared/models'
import { Video, VideoService } from '../../shared-main'
import { MiniatureDisplayOptions } from '../../shared-video-miniature'
import { CustomMarkupComponent } from './shared'
/*
- * Markup component list videos depending on criterias
+ * Markup component list videos depending on criteria
*/
@Component({
selector: 'my-videos-list-markup',
templateUrl: 'videos-list-markup.component.html',
- styleUrls: [ 'videos-list-markup.component.scss' ]
+ styleUrls: [ 'videos-list-markup.component.scss' ],
+ changeDetection: ChangeDetectionStrategy.OnPush
})
export class VideosListMarkupComponent implements CustomMarkupComponent, OnInit {
@Input() sort: string
@Input() languageOneOf: string[]
@Input() count: number
@Input() onlyDisplayTitle: boolean
- @Input() filter: VideoFilter
+ @Input() isLocal: boolean
@Input() isLive: boolean
@Input() maxRows: number
@Input() channelHandle: string
constructor (
private auth: AuthService,
private videoService: VideoService,
- private notifier: Notifier
+ private notifier: Notifier,
+ private cd: ChangeDetectorRef
) { }
getUser () {
return this.getVideosObservable()
.pipe(finalize(() => this.loaded.emit(true)))
- .subscribe(
- ({ data }) => this.videos = data,
+ .subscribe({
+ next: ({ data }) => {
+ this.videos = data
+ this.cd.markForCheck()
+ },
- err => this.notifier.error($localize`Error in videos list component: ${err.message}`)
- )
+ error: err => this.notifier.error($localize`Error in videos list component: ${err.message}`)
+ })
}
getVideosObservable () {
},
categoryOneOf: this.categoryOneOf,
languageOneOf: this.languageOneOf,
- filter: this.filter,
+ isLocal: this.isLocal,
isLive: this.isLive,
sort: this.sort as VideoSortField,
account: { nameWithHost: this.accountHandle },