Infinite scroll to list our subscriptions

2 files changed, 13 insertions, 3 deletions

diff --git a/client/src/app/search/search.component.html b/client/src/app/search/search.component.html
index 128cc52f5..83d014987 100644
--- a/client/src/app/search/search.component.html
+++ b/client/src/app/search/search.component.html
@@ -1,4 +1,4 @@
-<div myInfiniteScroller [autoLoading]="true" (nearOfBottom)="onNearOfBottom()" class="search-result">
+<div myInfiniteScroller [autoInit]="true" (nearOfBottom)="onNearOfBottom()" class="search-result">
   <div class="results-header">
     <div class="first-line">
       <div class="results-counter" *ngIf="pagination.totalItems">
diff --git a/client/src/app/search/search.component.ts b/client/src/app/search/search.component.ts
index f88df6391..ed84e24d9 100644
--- a/client/src/app/search/search.component.ts
+++ b/client/src/app/search/search.component.ts
@@ -87,9 +87,17 @@ export class SearchComponent implements OnInit, OnDestroy {
       .subscribe(
         ([ videosResult, videoChannelsResult ]) => {
           this.videos = this.videos.concat(videosResult.videos)
-          this.pagination.totalItems = videosResult.totalVideos
+          this.pagination.totalItems = videosResult.totalVideos + videoChannelsResult.total
 
-          this.videoChannels = videoChannelsResult.data
+          this.videoChannels = this.videoChannels.concat(videoChannelsResult.data)
+
+          // Focus on channels
+          if (this.channelsPerPage !== 10 && this.videos.length < this.pagination.itemsPerPage) {
+            this.resetPagination()
+
+            this.channelsPerPage = 10
+            this.search()
+          }
         },
 
         error => {
@@ -116,8 +124,10 @@ export class SearchComponent implements OnInit, OnDestroy {
   private resetPagination () {
     this.pagination.currentPage = 1
     this.pagination.totalItems = null
+    this.channelsPerPage = 2
 
     this.videos = []
+    this.videoChannels = []
   }
 
   private updateTitle () {