Add hide list

2 files changed, 25 insertions, 7 deletions

diff --git a/client/src/app/+about/about-follows/about-follows.component.html b/client/src/app/+about/about-follows/about-follows.component.html
index 50e00b651..a05c40184 100644
--- a/client/src/app/+about/about-follows/about-follows.component.html
+++ b/client/src/app/+about/about-follows/about-follows.component.html
@@ -6,10 +6,16 @@
     <div i18n class="no-results" *ngIf="followersPagination.totalItems === 0">This instance does not have instances followers.</div>
 
     <a *ngFor="let follower of followers" [href]="buildLink(follower)" target="_blank" rel="noopener noreferrer">
-      {{ follower }}
+      {{follower}}
     </a>
-
-    <a i18n class="showMore" *ngIf="!showMoreFollowers" (click)="loadAllFollowers()" (click)= "showMoreFollowers=true">Show full list</a>
+    <ng-container *ngIf="showMoreFollowers">
+      <a *ngFor="let follower of moreFollowers" [href]="buildLink(follower)" target="_blank" rel="noopener noreferrer">
+        {{ follower }}
+      </a>
+    </ng-container>
+    
+    <a i18n class="showMore" *ngIf="!showMoreFollowers" (click)="loadAllFollowers()" (click)="showMoreFollowers=true">Show full list</a>
+    <a i18n class="showMore" *ngIf="showMoreFollowers" (click)= "showMoreFollowers=false">Show less</a>
   </div>
 
   <div class="col-xl-6 col-md-12">
@@ -28,8 +34,14 @@
     <a *ngFor="let following of followings" [href]="buildLink(following)" target="_blank" rel="noopener noreferrer">
       {{ following }}
     </a>
-
-    <a i18n class="showMore" *ngIf="!showMoreFollowings" (click)="loadAllFollowings()" (click)= "showMoreFollowings=true">Show full list</a>
+    <ng-container *ngIf="showMoreFollowings">
+      <a *ngFor="let following of moreFollowings" [href]="buildLink(following)" target="_blank" rel="noopener noreferrer">
+        {{ following }}
+      </a>
+    </ng-container>
+
+    <a i18n class="showMore" *ngIf="!showMoreFollowings" (click)="loadAllFollowings()" (click)="showMoreFollowings=true">Show full list</a>
+    <a i18n class="showMore" *ngIf="showMoreFollowings" (click)="showMoreFollowings=false">Show less</a>
   </div>
 
 </div>
diff --git a/client/src/app/+about/about-follows/about-follows.component.ts b/client/src/app/+about/about-follows/about-follows.component.ts
index e5526248c..00bd48c9c 100644
--- a/client/src/app/+about/about-follows/about-follows.component.ts
+++ b/client/src/app/+about/about-follows/about-follows.component.ts
@@ -13,6 +13,8 @@ import { InstanceFollowService } from '@app/shared/shared-instance'
 export class AboutFollowsComponent implements OnInit {
   followers: string[] = []
   followings: string[] = []
+  moreFollowers: string[] = []
+  moreFollowings: string[] = []
 
   showMoreFollowers = false
   showMoreFollowings = false
@@ -75,7 +77,9 @@ export class AboutFollowsComponent implements OnInit {
         .subscribe(
           resultList => {
             const newFollowers = resultList.data.map(r => r.follower.host)
-            this.followers = this.followers.concat(newFollowers)
+            if (this.followers.length === 0) this.followers = this.followers.concat(newFollowers)
+
+            else this.moreFollowers = this.moreFollowers.concat(newFollowers)
 
             this.followersPagination.totalItems = resultList.total
 
@@ -93,7 +97,9 @@ export class AboutFollowsComponent implements OnInit {
         .subscribe(
           resultList => {
             const newFollowings = resultList.data.map(r => r.following.host)
-            this.followings = this.followings.concat(newFollowings)
+            if (this.followings.length===0) this.followings = this.followings.concat(newFollowings)
+
+            else this.moreFollowings = this.moreFollowings.concat(newFollowings)
 
             this.followingsPagination.totalItems = resultList.total