2 files changed, 13 insertions, 10 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 fd4109416..37571dfa4 100644
--- a/client/src/app/+about/about-follows/about-follows.component.html
+++ b/client/src/app/+about/about-follows/about-follows.component.html
@@ -6,8 +6,8 @@
 
     <div i18n class="no-results" *ngIf="followersPagination.totalItems === 0">{{ instanceName }} does not have followers.</div>
 
-    <a *ngFor="let follower of followers" [href]="buildLink(follower)" target="_blank" rel="noopener noreferrer">
-      {{ follower }}
+    <a *ngFor="let follower of followers" [href]="follower.url" target="_blank" rel="noopener noreferrer">
+      {{ follower.name }}
     </a>
 
     <button i18n class="peertube-button-link grey-button mt-1" *ngIf="!loadedAllFollowers && canLoadMoreFollowers()" (click)="loadAllFollowers()">Show full list</button>
@@ -18,8 +18,8 @@
 
     <div i18n class="no-results" *ngIf="followingsPagination.totalItems === 0">{{ instanceName }} does not have subscriptions.</div>
 
-    <a *ngFor="let following of followings" [href]="buildLink(following)" target="_blank" rel="noopener noreferrer">
-      {{ following }}
+    <a *ngFor="let following of followings" [href]="following.url" target="_blank" rel="noopener noreferrer">
+      {{ following.name }}
     </a>
 
     <button i18n class="peertube-button-link grey-button mt-1" *ngIf="!loadedAllFollowings && canLoadMoreFollowings()" (click)="loadAllFollowings()">Show full list</button>
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 35d810388..e1df8b813 100644
--- a/client/src/app/+about/about-follows/about-follows.component.ts
+++ b/client/src/app/+about/about-follows/about-follows.component.ts
@@ -13,8 +13,8 @@ import { Actor } from '@shared/models/actors'
 export class AboutFollowsComponent implements OnInit {
   instanceName: string
 
-  followers: string[] = []
-  followings: string[] = []
+  followers: { name: string, url: string }[] = []
+  followings: { name: string, url: string }[] = []
 
   loadedAllFollowers = false
   loadedAllFollowings = false
@@ -130,10 +130,13 @@ export class AboutFollowsComponent implements OnInit {
   }
 
   private formatFollow (actor: Actor) {
-    // Instance follow, only display host
-    if (actor.name === 'peertube') return actor.host
+    return {
+      // Instance follow, only display host
+      name: actor.name === 'peertube'
+        ? actor.host
+        : actor.name + '@' + actor.host,
 
-    return actor.name + '@' + actor.host
+      url: actor.url
+    }
   }
-
 }