From 6df5e58f7b86ce476a768794492f482fff5c72fe Mon Sep 17 00:00:00 2001
From: James Turley <jamesturley@gocardless.com>
Date: Fri, 5 Nov 2021 12:46:49 +0000
Subject: [PATCH] Modify exported getProgressColor to accept arguments object

Signed-off-by: James Turley <jamesturley@gocardless.com>
---
 .../components/ProgressBars/Gauge.test.tsx    | 26 +++++++++++-----
 .../src/components/ProgressBars/Gauge.tsx     | 31 +++++++++----------
 .../components/ProgressBars/LinearGauge.tsx   |  4 +--
 3 files changed, 34 insertions(+), 27 deletions(-)

diff --git a/packages/core-components/src/components/ProgressBars/Gauge.test.tsx b/packages/core-components/src/components/ProgressBars/Gauge.test.tsx
index 066e1233a0..2d9e852e6c 100644
--- a/packages/core-components/src/components/ProgressBars/Gauge.test.tsx
+++ b/packages/core-components/src/components/ProgressBars/Gauge.test.tsx
@@ -56,16 +56,26 @@ describe('<Gauge />', () => {
   };
 
   it('colors the progress correctly', () => {
-    expect(getProgressColor(palette, 'Not a Number' as any)).toBe('#ddd');
-    expect(getProgressColor(palette, 10)).toBe(error);
-    expect(getProgressColor(palette, 50)).toBe(warning);
-    expect(getProgressColor(palette, 90)).toBe(ok);
+    expect(getProgressColor({ palette, value: 'Not a Number' as any })).toBe(
+      '#ddd',
+    );
+    expect(getProgressColor({ palette, value: 10 })).toBe(error);
+    expect(getProgressColor({ palette, value: 50 })).toBe(warning);
+    expect(getProgressColor({ palette, value: 90 })).toBe(ok);
   });
 
   it('colors the inverse progress correctly', () => {
-    expect(getProgressColor(palette, 'Not a Number' as any)).toBe('#ddd');
-    expect(getProgressColor(palette, 10, true)).toBe(ok);
-    expect(getProgressColor(palette, 50, true)).toBe(warning);
-    expect(getProgressColor(palette, 90, true)).toBe(error);
+    expect(
+      getProgressColor({
+        palette,
+        value: 'Not a Number' as any,
+        inverse: true,
+      }),
+    ).toBe('#ddd');
+    expect(getProgressColor({ palette, value: 10, inverse: true })).toBe(ok);
+    expect(getProgressColor({ palette, value: 50, inverse: true })).toBe(
+      warning,
+    );
+    expect(getProgressColor({ palette, value: 90, inverse: true })).toBe(error);
   });
 });
diff --git a/packages/core-components/src/components/ProgressBars/Gauge.tsx b/packages/core-components/src/components/ProgressBars/Gauge.tsx
index 097fc9419d..2bcc0c3976 100644
--- a/packages/core-components/src/components/ProgressBars/Gauge.tsx
+++ b/packages/core-components/src/components/ProgressBars/Gauge.tsx
@@ -55,12 +55,16 @@ type Props = {
   getColor?: GetColor;
 };
 
-export type GetColor = (args: {
+type GetColorArgs = {
   palette: BackstageTheme['palette'];
   value: number;
   inverse?: boolean;
   max?: number;
-}) => string | BackstageTheme['palette']['error'];
+};
+
+export type GetColor = (
+  args: GetColorArgs,
+) => string | BackstageTheme['palette']['error'];
 
 const defaultProps = {
   fractional: true,
@@ -69,12 +73,12 @@ const defaultProps = {
   max: 100,
 };
 
-export function getProgressColor(
-  palette: BackstageTheme['palette'],
-  value: number,
-  inverse?: boolean,
-  max?: number,
-) {
+export const getProgressColor: GetColor = ({
+  palette,
+  value,
+  inverse,
+  max,
+}) => {
   if (isNaN(value)) {
     return '#ddd';
   }
@@ -89,18 +93,11 @@ export function getProgressColor(
   }
 
   return palette.status.ok;
-}
-
-export const defaultGetProgressColor: GetColor = ({
-  palette,
-  value,
-  inverse,
-  max,
-}) => getProgressColor(palette, value, inverse, max);
+};
 
 /** @public */
 export function Gauge(props: Props) {
-  const { getColor = defaultGetProgressColor } = props;
+  const { getColor = getProgressColor } = props;
   const classes = useStyles(props);
   const { palette } = useTheme<BackstageTheme>();
   const { value, fractional, inverse, unit, max } = {
diff --git a/packages/core-components/src/components/ProgressBars/LinearGauge.tsx b/packages/core-components/src/components/ProgressBars/LinearGauge.tsx
index ac6097195d..e331ed1fa5 100644
--- a/packages/core-components/src/components/ProgressBars/LinearGauge.tsx
+++ b/packages/core-components/src/components/ProgressBars/LinearGauge.tsx
@@ -20,7 +20,7 @@ import Tooltip from '@material-ui/core/Tooltip';
 // @ts-ignore
 import { Line } from 'rc-progress';
 import { BackstageTheme } from '@backstage/theme';
-import { defaultGetProgressColor, GetColor } from './Gauge';
+import { getProgressColor, GetColor } from './Gauge';
 
 type Props = {
   /**
@@ -31,7 +31,7 @@ type Props = {
 };
 
 export function LinearGauge(props: Props) {
-  const { value, getColor = defaultGetProgressColor } = props;
+  const { value, getColor = getProgressColor } = props;
   const { palette } = useTheme<BackstageTheme>();
   if (isNaN(value)) {
     return null;