From 7bcc2e44acad743f9be0704bf5800be7835c4e0c Mon Sep 17 00:00:00 2001
From: Matthias <xmatthias@outlook.com>
Date: Sat, 25 Dec 2021 19:50:00 +0100
Subject: [PATCH] CustomTradeList - support pagination

---
 src/components/ftbot/CustomTradeList.vue | 21 +++++++++------------
 1 file changed, 9 insertions(+), 12 deletions(-)

diff --git a/src/components/ftbot/CustomTradeList.vue b/src/components/ftbot/CustomTradeList.vue
index 3891f77c..3c16cd37 100644
--- a/src/components/ftbot/CustomTradeList.vue
+++ b/src/components/ftbot/CustomTradeList.vue
@@ -2,7 +2,7 @@
   <div class="h-100 overflow-auto w-100 m-1">
     <b-list-group>
       <b-list-group-item
-        v-for="trade in trades"
+        v-for="trade in filteredTrades"
         :key="trade.trade_id"
         class="border border-secondary rounded my-05 px-2"
       >
@@ -105,7 +105,14 @@ export default class CustomTradeList extends Vue {
     return this.trades.length;
   }
 
-  perPage = this.activeTrades ? 200 : 15;
+  perPage = this.activeTrades ? 200 : 25;
+
+  get filteredTrades() {
+    return this.trades.slice(
+      (this.currentPage - 1) * this.perPage,
+      this.currentPage * this.perPage,
+    );
+  }
 
   formatPriceWithDecimals(price) {
     return formatPrice(price, this.stakeCurrencyDecimals);
@@ -188,14 +195,4 @@ export default class CustomTradeList extends Vue {
   margin-top: 0.125rem;
   margin-bottom: 0.125rem;
 }
-.card-body {
-  padding: 0 0.2em;
-}
-.table-sm {
-  font-size: $fontsize-small;
-}
-.btn-xs {
-  padding: 0.1rem 0.25rem;
-  font-size: 0.75rem;
-}
 </style>