X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fshared%2Fvideo-playlist%2Fvideo-playlist.service.ts;h=38d915c6b626e23a34ce635d74e9e25c72a44966;hb=45c14ae1b2884e75c6341117489ea39ae0e1a3bc;hp=7eddf81e186bfa81366c8c209086c87d9b14bdb7;hpb=93d54cc769d88ecb2d7ead3ca293dac52653c13f;p=github%2FChocobozzz%2FPeerTube.git

diff --git a/client/src/app/shared/video-playlist/video-playlist.service.ts b/client/src/app/shared/video-playlist/video-playlist.service.ts
index 7eddf81e1..38d915c6b 100644
--- a/client/src/app/shared/video-playlist/video-playlist.service.ts
+++ b/client/src/app/shared/video-playlist/video-playlist.service.ts
@@ -1,6 +1,6 @@
-import { bufferTime, catchError, filter, map, share, switchMap, tap } from 'rxjs/operators'
-import { Injectable } from '@angular/core'
-import { merge, Observable, of, ReplaySubject, Subject } from 'rxjs'
+import { bufferTime, catchError, filter, map, observeOn, share, switchMap, tap } from 'rxjs/operators'
+import { Injectable, NgZone } from '@angular/core'
+import { asyncScheduler, merge, Observable, of, ReplaySubject, Subject } from 'rxjs'
 import { RestExtractor } from '../rest/rest-extractor.service'
 import { HttpClient, HttpParams } from '@angular/common/http'
 import { ResultList, VideoPlaylistElementCreate, VideoPlaylistElementUpdate } from '../../../../../shared'
@@ -18,11 +18,12 @@ import { Account } from '@app/shared/account/account.model'
 import { RestService } from '@app/shared/rest'
 import { VideoExistInPlaylist, VideosExistInPlaylists } from '@shared/models/videos/playlist/video-exist-in-playlist.model'
 import { VideoPlaylistReorder } from '@shared/models/videos/playlist/video-playlist-reorder.model'
-import { ComponentPagination } from '@app/shared/rest/component-pagination.model'
+import { ComponentPaginationLight } from '@app/shared/rest/component-pagination.model'
 import { VideoPlaylistElement as ServerVideoPlaylistElement } from '@shared/models/videos/playlist/video-playlist-element.model'
 import { VideoPlaylistElement } from '@app/shared/video-playlist/video-playlist-element.model'
 import { uniq } from 'lodash-es'
 import * as debug from 'debug'
+import { enterZone, leaveZone } from '@app/shared/rxjs/zone'
 
 const logger = debug('peertube:playlists:VideoPlaylistService')
 
@@ -42,19 +43,23 @@ export class VideoPlaylistService {
   private videoExistsCache: { [ id: number ]: VideoExistInPlaylist[] } = {}
 
   private myAccountPlaylistCache: ResultList<CachedPlaylist> = undefined
+  private myAccountPlaylistCacheRunning: Observable<ResultList<CachedPlaylist>>
   private myAccountPlaylistCacheSubject = new Subject<ResultList<CachedPlaylist>>()
 
   constructor (
     private authHttp: HttpClient,
     private serverService: ServerService,
     private restExtractor: RestExtractor,
-    private restService: RestService
+    private restService: RestService,
+    private ngZone: NgZone
   ) {
     this.videoExistsInPlaylistObservable = merge(
       this.videoExistsInPlaylistNotifier.pipe(
-        bufferTime(500),
+        // We leave Angular zone so Protractor does not get stuck
+        bufferTime(500, leaveZone(this.ngZone, asyncScheduler)),
         filter(videoIds => videoIds.length !== 0),
         map(videoIds => uniq(videoIds)),
+        observeOn(enterZone(this.ngZone, asyncScheduler)),
         switchMap(videoIds => this.doVideosExistInPlaylist(videoIds)),
         share()
       ),
@@ -63,7 +68,7 @@ export class VideoPlaylistService {
     )
   }
 
-  listChannelPlaylists (videoChannel: VideoChannel, componentPagination: ComponentPagination): Observable<ResultList<VideoPlaylist>> {
+  listChannelPlaylists (videoChannel: VideoChannel, componentPagination: ComponentPaginationLight): Observable<ResultList<VideoPlaylist>> {
     const url = VideoChannelService.BASE_VIDEO_CHANNEL_URL + videoChannel.nameWithHost + '/video-playlists'
     const pagination = this.restService.componentPaginationToRestPagination(componentPagination)
 
@@ -78,19 +83,29 @@ export class VideoPlaylistService {
   }
 
   listMyPlaylistWithCache (user: AuthUser, search?: string) {
-    if (!search && this.myAccountPlaylistCache) return of(this.myAccountPlaylistCache)
+    if (!search) {
+      if (this.myAccountPlaylistCacheRunning) return this.myAccountPlaylistCacheRunning
+      if (this.myAccountPlaylistCache) return of(this.myAccountPlaylistCache)
+    }
 
-    return this.listAccountPlaylists(user.account, undefined, '-updatedAt', search)
+    const obs = this.listAccountPlaylists(user.account, undefined, '-updatedAt', search)
                .pipe(
                  tap(result => {
-                   if (!search) this.myAccountPlaylistCache = result
-                 })
+                   if (!search) {
+                     this.myAccountPlaylistCacheRunning = undefined
+                     this.myAccountPlaylistCache = result
+                   }
+                 }),
+                 share()
                )
+
+    if (!search) this.myAccountPlaylistCacheRunning = obs
+    return obs
   }
 
   listAccountPlaylists (
     account: Account,
-    componentPagination: ComponentPagination,
+    componentPagination: ComponentPaginationLight,
     sort: string,
     search?: string
   ): Observable<ResultList<VideoPlaylist>> {
@@ -126,6 +141,8 @@ export class VideoPlaylistService {
     return this.authHttp.post<{ videoPlaylist: { id: number } }>(VideoPlaylistService.BASE_VIDEO_PLAYLIST_URL, data)
                .pipe(
                  tap(res => {
+                   if (!this.myAccountPlaylistCache) return
+
                    this.myAccountPlaylistCache.total++
 
                    this.myAccountPlaylistCache.data.push({
@@ -146,6 +163,8 @@ export class VideoPlaylistService {
                .pipe(
                  map(this.restExtractor.extractDataBool),
                  tap(() => {
+                   if (!this.myAccountPlaylistCache) return
+
                    const playlist = this.myAccountPlaylistCache.data.find(p => p.id === videoPlaylist.id)
                    playlist.displayName = body.displayName
 
@@ -160,6 +179,8 @@ export class VideoPlaylistService {
                .pipe(
                  map(this.restExtractor.extractDataBool),
                  tap(() => {
+                   if (!this.myAccountPlaylistCache) return
+
                    this.myAccountPlaylistCache.total--
                    this.myAccountPlaylistCache.data = this.myAccountPlaylistCache.data
                                                           .filter(p => p.id !== videoPlaylist.id)
@@ -236,7 +257,7 @@ export class VideoPlaylistService {
 
   getPlaylistVideos (
     videoPlaylistId: number | string,
-    componentPagination: ComponentPagination
+    componentPagination: ComponentPaginationLight
   ): Observable<ResultList<VideoPlaylistElement>> {
     const path = VideoPlaylistService.BASE_VIDEO_PLAYLIST_URL + videoPlaylistId + '/videos'
     const pagination = this.restService.componentPaginationToRestPagination(componentPagination)