fix(dashboard): adds resolution and aggregation to new proeprty in ga…

…uge widget

packages/dashboard/src/customization/widgets/gauge/plugin.tsx

@@ -21,6 +21,7 @@ export const gaugePlugin: DashboardPlugin = {
           source: 'iotsitewise',
           query: undefined,
         },
+        resolution: '0',
         showName: true,
         showUnit: true,
         fontSize: 40,

packages/dashboard/src/customization/widgets/utils/widgetAggregationUtils.ts

@@ -13,6 +13,7 @@ export const WidgetDefaultAggregation: Record<
   kpi: undefined,
   status: undefined,
   table: undefined,
+  gauge: undefined,
 };
 
 export const WidgetDefaultResolution: Record<string, string | undefined> = {
@@ -24,6 +25,7 @@ export const WidgetDefaultResolution: Record<string, string | undefined> = {
   kpi: '0',
   status: '0',
   table: '0',
+  gauge: '0',
 };
 
 export const getCurrentAggregationResolution = (

packages/react-components/src/components/gauge/converters/convertSeries.ts

@@ -8,6 +8,7 @@ import {
   DEFAULT_PROGRESS_SERIES,
   DEFAULT_THRESHOLD_SERIES,
 } from '../constants';
+import { calculatePadding } from '../utils/calculatePadding';
 
 export const convertSeries = ({
   unit,
@@ -36,6 +37,16 @@ export const convertSeries = ({
     }`;
   };
 
+  const unitPadding = [
+    0,
+    0,
+    calculatePadding({
+      fontSize: settings?.fontSize,
+      unitFontSize: settings?.unitFontSize,
+    }),
+    -10,
+  ];
+
   const emptySeries = {
     ...DEFAULT_EMPTY_SERIES,
     min: settings?.yMin ?? 0,
@@ -76,8 +87,8 @@ export const convertSeries = ({
         },
         unit: {
           fontWeight: 'bolder', // font weight of the unit value
-          padding: [0, 0, -15, -5],
           fontSize: settings?.unitFontSize,
+          padding: unitPadding,
         },
       },
     },
@@ -112,9 +123,9 @@ export const convertSeries = ({
           fontSize: settings?.fontSize,
         },
         unit: {
+          padding: unitPadding,
           fontWeight: 'bolder', //font weight of the unit
           fontSize: settings?.unitFontSize,
-          padding: [0, 0, -15, -5],
         },
       },
     },

packages/react-components/src/components/gauge/utils/calculatePadding.ts

@@ -0,0 +1,15 @@
+export const calculatePadding = ({
+  fontSize = 0,
+  unitFontSize = 0,
+}: {
+  fontSize?: number;
+  unitFontSize?: number;
+}) => {
+  if (fontSize > unitFontSize) {
+    return -1 * ((fontSize - unitFontSize) / 2);
+  } else if (fontSize < unitFontSize) {
+    return (unitFontSize - fontSize) / 2;
+  } else {
+    return 0;
+  }
+};