feat(MCDA): 19032 Append units to custom axis labels in MCDA dropdown

src/utils/bivariate/helpers/converters/axisDTOtoAxis.ts

@@ -1,11 +1,16 @@
-import { formatBivariateAxisLabel } from '~utils/bivariate/labelFormatters';
+import {
+  formatBivariateAxisLabel,
+  formatCustomLabelForBivariateAxis,
+} from '~utils/bivariate/labelFormatters';
 import type { AxisDTO } from '~core/resources/bivariateStatisticsResource/types';
 import type { Axis } from '~utils/bivariate/types/stat.types';
 
 export function axisDTOtoAxis(dto: AxisDTO): Axis {
   return {
     ...dto,
     id: dto.quotient.join('|'),
-    label: dto.label || formatBivariateAxisLabel(dto.quotients),
+    label: dto.label
+      ? formatCustomLabelForBivariateAxis(dto.label, dto.quotients)
+      : formatBivariateAxisLabel(dto.quotients),
   };
 }

src/utils/bivariate/labelFormatters.test.ts

@@ -1,5 +1,9 @@
 import { expect, describe, it } from 'vitest';
-import { hasUnits, formatBivariateAxisLabel } from './labelFormatters';
+import {
+  hasUnits,
+  formatBivariateAxisLabel,
+  formatCustomLabelForBivariateAxis,
+} from './labelFormatters';
 import type { Axis } from '~utils/bivariate';
 
 describe('BivariateLegend labels formatting', () => {
@@ -118,4 +122,64 @@ describe('BivariateLegend labels formatting', () => {
       );
     });
   });
+
+  describe('formatCustomLabelForBivariateAxis', () => {
+    it('must return customLabel with units from quotients', () => {
+      const quotients: Axis['quotients'] = [
+        {
+          name: 'total_road_length',
+          label: 'Total road length',
+          direction: [['unimportant'], ['important']],
+          unit: {
+            id: 'km',
+            shortName: 'km',
+            longName: 'kilometers',
+          },
+        },
+        {
+          name: 'population',
+          label: 'Population',
+          direction: [['unimportant'], ['important']],
+          unit: {
+            id: 'ppl',
+            shortName: 'ppl',
+            longName: 'people',
+          },
+        },
+      ];
+      const customLabel = 'Custom man-distance label';
+      expect(formatCustomLabelForBivariateAxis(customLabel, quotients)).toEqual(
+        'Custom man-distance label (km/ppl)',
+      );
+    });
+
+    it('must return customLabel without units if numerator has no unit', () => {
+      const quotients: Axis['quotients'] = [
+        {
+          name: 'total_road_length',
+          label: 'Total road length',
+          direction: [['unimportant'], ['important']],
+          unit: {
+            id: null,
+            shortName: null,
+            longName: null,
+          },
+        },
+        {
+          name: 'population',
+          label: 'Population',
+          direction: [['unimportant'], ['important']],
+          unit: {
+            id: 'ppl',
+            shortName: 'ppl',
+            longName: 'people',
+          },
+        },
+      ];
+      const customLabel = 'Custom man-distance label';
+      expect(formatCustomLabelForBivariateAxis(customLabel, quotients)).toEqual(
+        'Custom man-distance label',
+      );
+    });
+  });
 });

src/utils/bivariate/labelFormatters.ts

@@ -10,6 +10,17 @@ export const convertDirectionsArrayToLabel = (directions: string[][]) => {
   return `${formatSentimentDirection(from)} → ${formatSentimentDirection(to)}`;
 };
 
+export const formatCustomLabelForBivariateAxis = (
+  customLabel: string,
+  quotients: Axis['quotients'],
+): string => {
+  const units = formatBivariateAxisUnit(quotients);
+  if (units) {
+    return `${customLabel} (${units})`;
+  }
+  return customLabel;
+};
+
 export const formatBivariateAxisLabel = (quotients: Axis['quotients']): string => {
   if (!quotients) return '';
   const [numerator, denominator] = quotients;