1 files changed, 8 insertions, 5 deletions

diff --git a/client/src/app/+admin/friends/friend-list/friend-list.component.html b/client/src/app/+admin/friends/friend-list/friend-list.component.html
index 7887bc5e3..7e92ced54 100644
--- a/client/src/app/+admin/friends/friend-list/friend-list.component.html
+++ b/client/src/app/+admin/friends/friend-list/friend-list.component.html
@@ -2,12 +2,15 @@
   <div class="content-padding">
     <h3>Friends list</h3>
 
-    <p-dataTable [value]="friends">
-      <p-column field="id" header="ID"></p-column>
-      <p-column field="host" header="Host"></p-column>
+    <p-dataTable
+        [value]="friends" [lazy]="true" [paginator]="true" [totalRecords]="totalRecords" [rows]="rowsPerPage"
+        sortField="id" (onLazyLoad)="loadLazy($event)"
+    >
+      <p-column field="id" header="ID" [sortable]="true"></p-column>
+      <p-column field="host" header="Host" [sortable]="true"></p-column>
       <p-column field="email" header="Email"></p-column>
-      <p-column field="score" header="Score"></p-column>
-      <p-column field="createdAt" header="Created date"></p-column>
+      <p-column field="score" header="Score" [sortable]="true"></p-column>
+      <p-column field="createdAt" header="Created date" [sortable]="true"></p-column>
       <p-column header="Delete" styleClass="action-cell">
         <ng-template pTemplate="body" let-pod="rowData">
           <span (click)="removeFriend(pod)" class="glyphicon glyphicon-remove glyphicon-black" title="Remove this pod"></span>