From 051f64d5f015ff9c0532b18f3668b481c02a8b02 Mon Sep 17 00:00:00 2001
From: Matthias <xmatthias@outlook.com>
Date: Sun, 10 Oct 2021 15:16:27 +0200
Subject: [PATCH] Move Strategy name to above candlechart

---
 src/components/charts/CandleChart.vue         |  4 +--
 .../charts/CandleChartContainer.vue           | 26 ++++++++++++-------
 2 files changed, 19 insertions(+), 11 deletions(-)

diff --git a/src/components/charts/CandleChart.vue b/src/components/charts/CandleChart.vue
index 35f6a522..ac0aaf65 100644
--- a/src/components/charts/CandleChart.vue
+++ b/src/components/charts/CandleChart.vue
@@ -140,8 +140,8 @@ export default class CandleChart extends Vue {
     this.chartOptions = {
       title: [
         {
-          text: this.chartTitle,
-          show: true,
+          // text: this.chartTitle,
+          show: false,
         },
       ],
       backgroundColor: 'rgba(0, 0, 0, 0)',
diff --git a/src/components/charts/CandleChartContainer.vue b/src/components/charts/CandleChartContainer.vue
index 818fd1dc..a6598c14 100644
--- a/src/components/charts/CandleChartContainer.vue
+++ b/src/components/charts/CandleChartContainer.vue
@@ -13,16 +13,20 @@
       </b-modal>
 
       <div class="row mr-0">
-        <div class="col-mb-2 ml-2">
-          <b-select v-model="pair" :options="availablePairs" size="sm" @change="refresh">
+        <div class="col-mb-2 ml-2 d-flex align-items-center">
+          <span class="ml-2 text-nowrap">{{ strategyName }} | {{ timeframe || '' }}</span>
+          <b-select
+            v-model="pair"
+            class="ml-2"
+            :options="availablePairs"
+            size="sm"
+            @change="refresh"
+          >
           </b-select>
-        </div>
-        <div class="col-mb-2 ml-2 mr-2">
-          <b-button :disabled="!!!pair" size="sm" @click="refresh">&#x21bb;</b-button>
-        </div>
-        <div v-if="hasDataset" class="col-mb-2 ml-2 mr-2">
-          <small>Buysignals: {{ dataset.buy_signals }}</small>
-          <small class="ml-2">SellSignals: {{ dataset.sell_signals }}</small>
+
+          <b-button class="ml-2" :disabled="!!!pair" size="sm" @click="refresh">&#x21bb;</b-button>
+          <small class="ml-2 text-nowrap">Buysignals: {{ dataset.buy_signals }}</small>
+          <small class="ml-2 text-nowrap">SellSignals: {{ dataset.sell_signals }}</small>
         </div>
         <div class="col-mb-2 ml-auto mr-2">
           <b-select
@@ -134,6 +138,10 @@ export default class CandleChartContainer extends Vue {
     return this.candleData[`${this.pair}__${this.timeframe}`];
   }
 
+  get strategyName() {
+    return this.strategy || this.dataset?.strategy || '';
+  }
+
   get datasetColumns() {
     return this.dataset ? this.dataset.columns : [];
   }