import * as debug from 'debug'
import { fromEvent, Observable, Subject, Subscription } from 'rxjs'
-import { debounceTime, switchMap } from 'rxjs/operators'
+import { concatMap, debounceTime, map, switchMap } from 'rxjs/operators'
import { Component, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges } from '@angular/core'
import { ActivatedRoute } from '@angular/router'
import {
@Input() disabled = false
@Output() filtersChanged = new EventEmitter<VideoFilters>()
+ @Output() videosLoaded = new EventEmitter<Video[]>()
videos: Video[] = []
filters: VideoFilters
private lastQueryLength: number
+ private videoRequests = new Subject<{ reset: boolean, obs: Observable<ResultList<Video>> }>()
+
constructor (
private notifier: Notifier,
private authService: AuthService,
}
ngOnInit () {
+ this.subscribeToVideoRequests()
+
const hiddenFilters = this.hideScopeFilter
? [ 'scope' ]
: []
}
loadMoreVideos (reset = false) {
- if (reset) this.hasDoneFirstQuery = false
-
- this.getVideosObservableFunction(this.pagination, this.filters)
- .subscribe({
- next: ({ data }) => {
- this.hasDoneFirstQuery = true
- this.lastQueryLength = data.length
-
- if (reset) this.videos = []
- this.videos = this.videos.concat(data)
-
- if (this.groupByDate) this.buildGroupedDateLabels()
-
- this.onDataSubject.next(data)
- },
-
- error: err => {
- const message = $localize`Cannot load more videos. Try again later.`
+ if (reset) {
+ this.hasDoneFirstQuery = false
+ this.videos = []
+ }
- logger.error(message, err)
- this.notifier.error(message)
- }
- })
+ this.videoRequests.next({ reset, obs: this.getVideosObservableFunction(this.pagination, this.filters) })
}
reloadVideos () {
this.onFiltersChanged(true)
})
}
+
+ private subscribeToVideoRequests () {
+ this.videoRequests
+ .pipe(concatMap(({ reset, obs }) => obs.pipe(map(({ data }) => ({ data, reset })))))
+ .subscribe({
+ next: ({ data, reset }) => {
+ this.hasDoneFirstQuery = true
+ this.lastQueryLength = data.length
+
+ if (reset) this.videos = []
+ this.videos = this.videos.concat(data)
+
+ if (this.groupByDate) this.buildGroupedDateLabels()
+
+ this.onDataSubject.next(data)
+ this.videosLoaded.emit(this.videos)
+ },
+
+ error: err => {
+ const message = $localize`Cannot load more videos. Try again later.`
+
+ logger.error(message, err)
+ this.notifier.error(message)
+ }
+ })
+ }
}