Fix infinite scroll on big screens

4 files changed, 11 insertions, 2 deletions

diff --git a/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.html b/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.html
index 6d2155332..4526aaf66 100644
--- a/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.html
+++ b/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.html
@@ -6,7 +6,7 @@
   {{ getNoResultMessage() }}
 </div>
 
-<div class="plugins" myInfiniteScroller (nearOfBottom)="onNearOfBottom()" [autoInit]="true">
+<div class="plugins" myInfiniteScroller (nearOfBottom)="onNearOfBottom()" [autoInit]="true" [dataObservable]="onDataSubject.asObservable()">
   <div class="card plugin" *ngFor="let plugin of plugins">
     <div class="card-body">
       <div class="first-row">
diff --git a/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.ts b/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.ts
index dced14dee..b30b136bd 100644
--- a/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.ts
+++ b/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.ts
@@ -8,6 +8,7 @@ import { PeerTubePlugin } from '@shared/models/plugins/peertube-plugin.model'
 import { ActivatedRoute, Router } from '@angular/router'
 import { compareSemVer } from '@shared/core-utils/miscs/miscs'
 import { PluginService } from '@app/core/plugins/plugin.service'
+import { Subject } from 'rxjs'
 
 @Component({
   selector: 'my-plugin-list-installed',
@@ -33,6 +34,8 @@ export class PluginListInstalledComponent implements OnInit {
 
   PluginType = PluginType
 
+  onDataSubject = new Subject<any[]>()
+
   constructor (
     private i18n: I18n,
     private pluginService: PluginService,
@@ -67,6 +70,8 @@ export class PluginListInstalledComponent implements OnInit {
           res => {
             this.plugins = this.plugins.concat(res.data)
             this.pagination.totalItems = res.total
+
+            this.onDataSubject.next(res.data)
           },
 
           err => this.notifier.error(err.message)
diff --git a/client/src/app/+admin/plugins/plugin-search/plugin-search.component.html b/client/src/app/+admin/plugins/plugin-search/plugin-search.component.html
index 87f1c86ee..6ec6301b1 100644
--- a/client/src/app/+admin/plugins/plugin-search/plugin-search.component.html
+++ b/client/src/app/+admin/plugins/plugin-search/plugin-search.component.html
@@ -29,7 +29,7 @@
   No results.
 </div>
 
-<div class="plugins" myInfiniteScroller (nearOfBottom)="onNearOfBottom()" [autoInit]="true">
+<div class="plugins" myInfiniteScroller (nearOfBottom)="onNearOfBottom()" [autoInit]="true" [dataObservable]="onDataSubject.asObservable()">
   <div class="card plugin" *ngFor="let plugin of plugins">
     <div class="card-body">
       <div class="first-row">
diff --git a/client/src/app/+admin/plugins/plugin-search/plugin-search.component.ts b/client/src/app/+admin/plugins/plugin-search/plugin-search.component.ts
index a6fbeed84..65566ab79 100644
--- a/client/src/app/+admin/plugins/plugin-search/plugin-search.component.ts
+++ b/client/src/app/+admin/plugins/plugin-search/plugin-search.component.ts
@@ -36,6 +36,8 @@ export class PluginSearchComponent implements OnInit {
   installing: { [name: string]: boolean } = {}
   pluginInstalled = false
 
+  onDataSubject = new Subject<any[]>()
+
   private searchSubject = new Subject<string>()
 
   constructor (
@@ -90,6 +92,8 @@ export class PluginSearchComponent implements OnInit {
 
             this.plugins = this.plugins.concat(res.data)
             this.pagination.totalItems = res.total
+
+            this.onDataSubject.next(res.data)
           },
 
           err => {