From dd0b67716fa3936f76e29076640b3472d27f02f2 Mon Sep 17 00:00:00 2001
From: softsimon <softsimon@protonmail.com>
Date: Tue, 11 Aug 2020 00:43:24 +0700
Subject: [PATCH] Optimization for bisq transaction table rendering

---
 frontend/src/app/bisq/bisq-icon/bisq-icon.component.ts        | 2 ++
 .../bisq/bisq-transactions/bisq-transactions.component.html   | 2 +-
 .../app/bisq/bisq-transactions/bisq-transactions.component.ts | 4 ++++
 3 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/bisq/bisq-icon/bisq-icon.component.ts b/frontend/src/app/bisq/bisq-icon/bisq-icon.component.ts
index 455b6b2ef..ff6aad941 100644
--- a/frontend/src/app/bisq/bisq-icon/bisq-icon.component.ts
+++ b/frontend/src/app/bisq/bisq-icon/bisq-icon.component.ts
@@ -77,5 +77,7 @@ export class BisqIconComponent implements OnChanges {
         this.iconProp[1] = 'question';
         this.color = 'ffac00';
     }
+    // @ts-ignore
+    this.iconProp = this.iconProp.slice();
   }
 }
diff --git a/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.html b/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.html
index 17c90e44f..371cc9edd 100644
--- a/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.html
+++ b/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.html
@@ -22,7 +22,7 @@
       <th class="d-none d-md-block">Height</th>
     </thead>
     <tbody *ngIf="transactions.value; else loadingTmpl">
-      <tr *ngFor="let tx of transactions.value[0]">
+      <tr *ngFor="let tx of transactions.value[0]; trackBy: trackByFn">
         <td><a [routerLink]="['/tx/' | relativeUrl, tx.id]" [state]="{ data: tx }">{{ tx.id | slice : 0 : 8 }}</a></td>
         <td class="d-none d-md-block">
           <app-bisq-icon class="mr-1" [txType]="tx.txType"></app-bisq-icon>
diff --git a/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.ts b/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.ts
index 5a6039bbb..33f431275 100644
--- a/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.ts
+++ b/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.ts
@@ -173,4 +173,8 @@ export class BisqTransactionsComponent implements OnInit {
   calculateTotalOutput(outputs: BisqOutput[]): number {
     return outputs.reduce((acc: number, output: BisqOutput) => acc + output.bsqAmount, 0);
   }
+
+  trackByFn(index: number) {
+    return index;
+  }
 }