From 6b064318be273257862bec13d1741a9ec0dd70e4 Mon Sep 17 00:00:00 2001
From: bptrgx <47859535+bptrgx@users.noreply.github.com>
Date: Wed, 5 Jul 2023 20:39:13 +0200
Subject: [PATCH] replace average unit price by null if zero ; line-chart don't
 show null values

---
 .../position-detail-dialog.component.ts       | 15 ++++++++++----
 .../lib/line-chart/line-chart.component.ts    | 20 +++++++++++++++----
 2 files changed, 27 insertions(+), 8 deletions(-)

diff --git a/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.component.ts b/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.component.ts
index 9c4d3c6e3..f914d0c16 100644
--- a/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.component.ts
+++ b/apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.component.ts
@@ -113,10 +113,17 @@ export class PositionDetailDialog implements OnDestroy, OnInit {
           this.grossPerformancePercent = grossPerformancePercent;
           this.historicalDataItems = historicalData.map(
             (historicalDataItem) => {
-              this.benchmarkDataItems.push({
-                date: historicalDataItem.date,
-                value: historicalDataItem.averagePrice
-              });
+              if (historicalDataItem.averagePrice) {
+                this.benchmarkDataItems.push({
+                  date: historicalDataItem.date,
+                  value: historicalDataItem.averagePrice
+                });
+              } else {
+                this.benchmarkDataItems.push({
+                  date: historicalDataItem.date,
+                  value: null
+                });
+              }
 
               return {
                 date: historicalDataItem.date,
diff --git a/libs/ui/src/lib/line-chart/line-chart.component.ts b/libs/ui/src/lib/line-chart/line-chart.component.ts
index be43f9394..a402f3b39 100644
--- a/libs/ui/src/lib/line-chart/line-chart.component.ts
+++ b/libs/ui/src/lib/line-chart/line-chart.component.ts
@@ -118,12 +118,10 @@ export class LineChartComponent implements AfterViewInit, OnChanges, OnDestroy {
 
   private initialize() {
     this.isLoading = true;
-    const benchmarkPrices = [];
     const labels: string[] = [];
     const marketPrices = [];
 
-    this.historicalDataItems?.forEach((historicalDataItem, index) => {
-      benchmarkPrices.push(this.benchmarkDataItems?.[index]?.value);
+    this.historicalDataItems?.forEach((historicalDataItem) => {
       labels.push(historicalDataItem.date);
       marketPrices.push(historicalDataItem.value);
     });
@@ -151,7 +149,7 @@ export class LineChartComponent implements AfterViewInit, OnChanges, OnDestroy {
         {
           borderColor: `rgb(${secondaryColorRgb.r}, ${secondaryColorRgb.g}, ${secondaryColorRgb.b})`,
           borderWidth: 1,
-          data: benchmarkPrices,
+          data: [],
           fill: false,
           label: this.benchmarkLabel,
           pointRadius: 0
@@ -168,6 +166,20 @@ export class LineChartComponent implements AfterViewInit, OnChanges, OnDestroy {
       ]
     };
 
+    this.historicalDataItems?.forEach((historicalDataItem, index) => {
+      data.datasets[0].data.push(this.benchmarkDataItems?.[index]?.value);
+      if (this.benchmarkDataItems?.[index]?.value === null) {
+        data.datasets.unshift({
+          borderColor: `rgb(${secondaryColorRgb.r}, ${secondaryColorRgb.g}, ${secondaryColorRgb.b})`,
+          borderWidth: 1,
+          data: Array(data.datasets[0].data.length).fill(null),
+          fill: false,
+          label: this.benchmarkLabel,
+          pointRadius: 0
+        });
+      }
+    });
+
     if (this.chartCanvas) {
       if (this.chart) {
         this.chart.data = data;