Fix no other videos displayed on some videos

3 files changed, 18 insertions, 25 deletions

diff --git a/client/src/app/videos/recommendations/recent-videos-recommendation.service.ts b/client/src/app/videos/recommendations/recent-videos-recommendation.service.ts
index 59acf17bc..6d7b159da 100644
--- a/client/src/app/videos/recommendations/recent-videos-recommendation.service.ts
+++ b/client/src/app/videos/recommendations/recent-videos-recommendation.service.ts
@@ -3,8 +3,8 @@ import { RecommendationService } from '@app/videos/recommendations/recommendatio
 import { Video } from '@app/shared/video/video.model'
 import { RecommendationInfo } from '@app/shared/video/recommendation-info.model'
 import { VideoService } from '@app/shared/video/video.service'
-import { map } from 'rxjs/operators'
-import { Observable } from 'rxjs'
+import { map, switchMap } from 'rxjs/operators'
+import { Observable, of } from 'rxjs'
 import { SearchService } from '@app/search/search.service'
 import { AdvancedSearch } from '@app/search/advanced-search.model'
 
@@ -13,7 +13,6 @@ import { AdvancedSearch } from '@app/search/advanced-search.model'
  */
 @Injectable()
 export class RecentVideosRecommendationService implements RecommendationService {
-
   readonly pageSize = 5
 
   constructor (
@@ -32,24 +31,22 @@ export class RecentVideosRecommendationService implements RecommendationService
   }
 
   private fetchPage (page: number, recommendation: RecommendationInfo): Observable<Video[]> {
-    let pagination = { currentPage: page, itemsPerPage: this.pageSize + 1 }
-    if (!recommendation.tags) {
-      return this.videos.getVideos(pagination, '-createdAt')
-        .pipe(
-          map(v => v.videos)
-        )
-    }
-    if (recommendation.tags.length === 0) {
-      return this.videos.getVideos(pagination, '-createdAt')
-        .pipe(
-          map(v => v.videos)
-        )
-    }
+    const pagination = { currentPage: page, itemsPerPage: this.pageSize + 1 }
+    const defaultSubscription = this.videos.getVideos(pagination, '-createdAt')
+                                    .pipe(map(v => v.videos))
+
+    if (!recommendation.tags || recommendation.tags.length === 0) return defaultSubscription
+
     return this.searchService.searchVideos('',
       pagination,
       new AdvancedSearch({ tagsOneOf: recommendation.tags.join(','), sort: '-createdAt' })
     ).pipe(
-      map(v => v.videos)
+      map(v => v.videos),
+      switchMap(videos => {
+        if (videos.length <= 1) return defaultSubscription
+
+        return of(videos)
+      })
     )
   }
 }
diff --git a/client/src/app/videos/recommendations/recommendations.service.ts b/client/src/app/videos/recommendations/recommendations.service.ts
index 114a808b5..a547e289d 100644
--- a/client/src/app/videos/recommendations/recommendations.service.ts
+++ b/client/src/app/videos/recommendations/recommendations.service.ts
@@ -2,8 +2,6 @@ import { Video } from '@app/shared/video/video.model'
 import { RecommendationInfo } from '@app/shared/video/recommendation-info.model'
 import { Observable } from 'rxjs'
 
-export type UUID = string
-
 export interface RecommendationService {
   getRecommendations (recommendation: RecommendationInfo): Observable<Video[]>
 }
diff --git a/client/src/app/videos/recommendations/recommended-videos.component.html b/client/src/app/videos/recommendations/recommended-videos.component.html
index 7cfaffec2..73f9f0fe1 100644
--- a/client/src/app/videos/recommendations/recommended-videos.component.html
+++ b/client/src/app/videos/recommendations/recommended-videos.component.html
@@ -1,11 +1,9 @@
-<div class="other-videos">
+<div *ngIf="hasVideos$ | async" class="other-videos">
     <div i18n class="title-page title-page-single">
         Other videos
     </div>
 
-    <ng-container *ngIf="hasVideos$ | async">
-        <div *ngFor="let video of (videos$ | async)">
-            <my-video-miniature [video]="video" [user]="user"></my-video-miniature>
-        </div>
-    </ng-container>
+    <div *ngFor="let video of (videos$ | async)">
+        <my-video-miniature [video]="video" [user]="user"></my-video-miniature>
+    </div>
 </div>