From 7b97e8a5656ec4f0dee64aadd1befaef82614bdb Mon Sep 17 00:00:00 2001
From: Matthias <xmatthias@outlook.com>
Date: Sun, 19 Jun 2022 17:42:24 +0200
Subject: [PATCH] Add closed trades for all bots to dashboard

closes #763
---
 src/stores/ftbotwrapper.ts | 14 ++++++++++++++
 src/stores/layout.ts       |  5 ++++-
 src/views/Dashboard.vue    | 29 ++++++++++++++++++++++++-----
 src/views/Trading.vue      |  2 +-
 4 files changed, 43 insertions(+), 7 deletions(-)

diff --git a/src/stores/ftbotwrapper.ts b/src/stores/ftbotwrapper.ts
index 78a7edc1..ca22e21c 100644
--- a/src/stores/ftbotwrapper.ts
+++ b/src/stores/ftbotwrapper.ts
@@ -97,6 +97,20 @@ export const useBotStore = defineStore('wrapper', {
       });
       return result;
     },
+    allClosedTradesSelectedBots: (state): Trade[] => {
+      const result: Trade[] = [];
+      Object.entries(state.botStores).forEach(([, botStore]) => {
+        if (botStore.isSelected) {
+          result.push(...botStore.trades);
+        }
+      });
+      return result.sort((a, b) =>
+        // Sort by close timestamp, then by tradeid
+        b.close_timestamp && a.close_timestamp
+          ? b.close_timestamp - a.close_timestamp
+          : b.trade_id - a.trade_id,
+      );
+    },
     allTradesSelectedBots: (state): ClosedTrade[] => {
       const result: ClosedTrade[] = [];
       Object.entries(state.botStores).forEach(([, botStore]) => {
diff --git a/src/stores/layout.ts b/src/stores/layout.ts
index 3cbc23a4..872ab798 100644
--- a/src/stores/layout.ts
+++ b/src/stores/layout.ts
@@ -14,6 +14,7 @@ export enum DashboardLayout {
   botComparison = 'g-botComparison',
   allOpenTrades = 'g-allOpenTrades',
   cumChartChart = 'g-cumChartChart',
+  allClosedTrades = 'g-allClosedTrades',
   tradesLogChart = 'g-TradesLogChart',
 }
 
@@ -40,7 +41,8 @@ const DEFAULT_DASHBOARD_LAYOUT: GridItemData[] = [
   { i: DashboardLayout.dailyChart, x: 8, y: 0, w: 4, h: 6 },
   { i: DashboardLayout.allOpenTrades, x: 0, y: 6, w: 8, h: 6 },
   { i: DashboardLayout.cumChartChart, x: 8, y: 6, w: 4, h: 6 },
-  { i: DashboardLayout.tradesLogChart, x: 0, y: 12, w: 12, h: 4 },
+  { i: DashboardLayout.allClosedTrades, x: 0, y: 12, w: 8, h: 6 },
+  { i: DashboardLayout.tradesLogChart, x: 0, y: 18, w: 12, h: 4 },
 ];
 
 const DEFAULT_DASHBOARD_LAYOUT_SM: GridItemData[] = [
@@ -49,6 +51,7 @@ const DEFAULT_DASHBOARD_LAYOUT_SM: GridItemData[] = [
   { i: DashboardLayout.dailyChart, x: 0, y: 14, w: 12, h: 6 },
   { i: DashboardLayout.cumChartChart, x: 0, y: 20, w: 12, h: 6 },
   { i: DashboardLayout.tradesLogChart, x: 0, y: 26, w: 12, h: 4 },
+  { i: DashboardLayout.allClosedTrades, x: 0, y: 30, w: 12, h: 8 },
 ];
 
 const STORE_LAYOUTS = 'ftLayoutSettings';
diff --git a/src/views/Dashboard.vue b/src/views/Dashboard.vue
index 880e4f9a..8e193cfc 100644
--- a/src/views/Dashboard.vue
+++ b/src/views/Dashboard.vue
@@ -57,11 +57,7 @@
       drag-allow-from=".drag-header"
     >
       <DraggableContainer header="Open Trades">
-        <trade-list
-          :active-trades="true"
-          :trades="botStore.allOpenTradesSelectedBots"
-          multi-bot-view
-        />
+        <trade-list active-trades :trades="botStore.allOpenTradesSelectedBots" multi-bot-view />
       </DraggableContainer>
     </GridItem>
     <GridItem
@@ -78,6 +74,25 @@
         <CumProfitChart :trades="botStore.allTradesSelectedBots" :show-title="false" />
       </DraggableContainer>
     </GridItem>
+    <GridItem
+      :i="gridLayoutAllClosedTrades.i"
+      :x="gridLayoutAllClosedTrades.x"
+      :y="gridLayoutAllClosedTrades.y"
+      :w="gridLayoutAllClosedTrades.w"
+      :h="gridLayoutAllClosedTrades.h"
+      :min-w="3"
+      :min-h="4"
+      drag-allow-from=".drag-header"
+    >
+      <DraggableContainer header="Closed Trades">
+        <trade-list
+          :active-trades="false"
+          show-filter
+          :trades="botStore.allClosedTradesSelectedBots"
+          multi-bot-view
+        />
+      </DraggableContainer>
+    </GridItem>
     <GridItem
       :i="gridLayoutTradesLogChart.i"
       :x="gridLayoutTradesLogChart.x"
@@ -166,6 +181,9 @@ export default defineComponent({
     const gridLayoutAllOpenTrades = computed((): GridItemData => {
       return findGridLayout(gridLayout.value, DashboardLayout.allOpenTrades);
     });
+    const gridLayoutAllClosedTrades = computed((): GridItemData => {
+      return findGridLayout(gridLayout.value, DashboardLayout.allClosedTrades);
+    });
 
     const gridLayoutCumChart = computed((): GridItemData => {
       return findGridLayout(gridLayout.value, DashboardLayout.cumChartChart);
@@ -198,6 +216,7 @@ export default defineComponent({
       gridLayoutDaily,
       gridLayoutBotComparison,
       gridLayoutAllOpenTrades,
+      gridLayoutAllClosedTrades,
       gridLayoutCumChart,
       gridLayoutTradesLogChart,
       responsiveGridLayouts,
diff --git a/src/views/Trading.vue b/src/views/Trading.vue
index acf76bc4..620c34c6 100644
--- a/src/views/Trading.vue
+++ b/src/views/Trading.vue
@@ -85,7 +85,7 @@
       drag-allow-from=".card-header"
     >
       <DraggableContainer header="Closed Trades">
-        <TradeList
+        <trade-list
           class="trade-history"
           :trades="botStore.activeBot.closedTrades"
           title="Trade history"