From 7fda6999acab8eb369c8ed6d53fb0813e8d70c66 Mon Sep 17 00:00:00 2001
From: Philipp S <philipp.schofer@shopify.com>
Date: Thu, 30 Nov 2023 13:36:04 -0500
Subject: [PATCH] Introduce optional fillValue property on DataSeries

---
 packages/polaris-viz-core/src/types.ts        |  1 +
 .../src/utilities/fillMissingDataPoints.ts    |  8 +--
 .../tests/fillMissingDataPoints.test.ts       | 70 +++++++++++++++++++
 3 files changed, 75 insertions(+), 4 deletions(-)

diff --git a/packages/polaris-viz-core/src/types.ts b/packages/polaris-viz-core/src/types.ts
index c24bfaa406..28becfd610 100644
--- a/packages/polaris-viz-core/src/types.ts
+++ b/packages/polaris-viz-core/src/types.ts
@@ -15,6 +15,7 @@ export interface DataSeries {
   name?: string;
   metadata?: {[key: string]: any};
   styleOverride?: StyleOverride;
+  fillValue?: number | null;
 }
 
 interface StyleOverride {
diff --git a/packages/polaris-viz/src/utilities/fillMissingDataPoints.ts b/packages/polaris-viz/src/utilities/fillMissingDataPoints.ts
index 6114c9f5fe..e4171658da 100644
--- a/packages/polaris-viz/src/utilities/fillMissingDataPoints.ts
+++ b/packages/polaris-viz/src/utilities/fillMissingDataPoints.ts
@@ -1,11 +1,11 @@
 import type {DataSeries} from '@shopify/polaris-viz-core';
 
 export function fillMissingDataPoints(dataSeries: DataSeries[]) {
-  const areAnyComparrison = dataSeries.some(
+  const areAnyComparison = dataSeries.some(
     ({isComparison}) => isComparison === true,
   );
 
-  if (areAnyComparrison) {
+  if (areAnyComparison) {
     return dataSeries;
   }
 
@@ -27,10 +27,10 @@ export function fillMissingDataPoints(dataSeries: DataSeries[]) {
   return dataSeries.map((series, index) => {
     const newData = [...allKeys].map((key) => {
       const dataValue = dataValueMap[index];
-
+      const fillValue = series.fillValue ? series.fillValue : null;
       return {
         key,
-        value: dataValue == null ? null : dataValue[key] ?? null,
+        value: dataValue == null ? null : dataValue[key] ?? fillValue,
       };
     });
     return {...series, data: newData};
diff --git a/packages/polaris-viz/src/utilities/tests/fillMissingDataPoints.test.ts b/packages/polaris-viz/src/utilities/tests/fillMissingDataPoints.test.ts
index b7ac745e7e..5e612528a6 100644
--- a/packages/polaris-viz/src/utilities/tests/fillMissingDataPoints.test.ts
+++ b/packages/polaris-viz/src/utilities/tests/fillMissingDataPoints.test.ts
@@ -102,6 +102,76 @@ describe('fillMissingDataPoints', () => {
     ]);
   });
 
+  it('fills data with null by default', () => {
+    const mockData = [
+      {
+        name: 'Canada',
+        data: [
+          {key: 'Mice', value: 13.28},
+          {key: 'Dogs', value: 23.43},
+          {key: 'Cats', value: 6.64},
+          {key: 'Birds', value: 54.47},
+        ],
+      },
+      {
+        name: 'China',
+        data: [
+          {key: 'Snakes', value: 0},
+          {key: 'Dogs', value: 0},
+        ],
+      },
+    ];
+
+    const result = fillMissingDataPoints(mockData);
+
+    expect(result).toMatchObject(
+      expect.arrayContaining([
+        expect.objectContaining({
+          data: expect.arrayContaining([
+            expect.objectContaining({
+              value: null,
+            }),
+          ]),
+        }),
+      ]),
+    );
+  });
+
+  it('fills data with provided fill value', () => {
+    const mockData = [
+      {
+        name: 'Canada',
+        data: [
+          {key: 'Mice', value: 13.28},
+          {key: 'Dogs', value: 23.43},
+          {key: 'Cats', value: 6.64},
+          {key: 'Birds', value: 54.47},
+        ],
+      },
+      {
+        name: 'China',
+        data: [
+          {key: 'Snakes', value: 10},
+          {key: 'Dogs', value: 10},
+        ],
+      },
+    ];
+
+    const result = fillMissingDataPoints(mockData);
+
+    expect(result).toMatchObject(
+      expect.arrayContaining([
+        expect.objectContaining({
+          data: expect.arrayContaining([
+            expect.objectContaining({
+              value: 0,
+            }),
+          ]),
+        }),
+      ]),
+    );
+  });
+
   it('returns the original data series if any are comparison', () => {
     const mockData = [
       {