Merge branch 'mw-productivity-analytics-yaxis-formatter' into 'master'

Productivity Analytics: Add yAxis formatter to column charts

See merge request gitlab-org/gitlab!16744

ee/app/assets/javascripts/analytics/productivity_analytics/components/app.vue

@@ -58,7 +58,7 @@ export default {
     ...mapGetters('charts', [
       'chartLoading',
       'getChartData',
-      'getColumnChartOption',
+      'getColumnChartDatazoomOption',
       'getMetricDropdownLabel',
       'isSelectedMetric',
     ]),
@@ -95,6 +95,16 @@ export default {
     getMetricTypes(chartKey) {
       return metricTypes.filter(m => m.chart === chartKey);
     },
+    getColumnChartOption(chartKey) {
+      return {
+        yAxis: {
+          axisLabel: {
+            formatter: value => value,
+          },
+        },
+        ...this.getColumnChartDatazoomOption(chartKey),
+      };
+    },
   },
 };
 </script>

ee/app/assets/javascripts/analytics/productivity_analytics/store/modules/charts/getters.js

@@ -78,8 +78,9 @@ export const getFilterParams = (state, getters, rootState, rootGetters) => chart
  *
  * If the number of data items being displayed is below the MAX_ITEMS_PER_PAGE threshold,
  * it will return an empty dataZoom property.
+ *
  */
-export const getColumnChartOption = state => chartKey => {
+export const getColumnChartDatazoomOption = state => chartKey => {
   const { data } = state.charts[chartKey];
   const totalItems = Object.keys(data).length;
   const MAX_ITEMS_PER_PAGE = maxColumnChartItemsPerPage[chartKey]

ee/spec/frontend/analytics/productivity_analytics/store/modules/charts/getters_spec.js

@@ -142,7 +142,7 @@ describe('Productivity analytics chart getters', () => {
     });
   });
 
-  describe('getColumnChartOption', () => {
+  describe('getColumnChartDatazoomOption', () => {
     const chartKey = chartKeys.main;
 
     describe(`data exceeds threshold of ${maxColumnChartItemsPerPage[chartKey]} items`, () => {
@@ -167,7 +167,7 @@ describe('Productivity analytics chart getters', () => {
           ],
         };
 
-        expect(getters.getColumnChartOption(state)(chartKeys.main)).toEqual(expected);
+        expect(getters.getColumnChartDatazoomOption(state)(chartKeys.main)).toEqual(expected);
       });
     });
 
@@ -175,7 +175,7 @@ describe('Productivity analytics chart getters', () => {
       it('returns an empty dataZoom property', () => {
         state.charts[chartKey].data = { '1': 1, '2': 2, '3': 3 };
 
-        expect(getters.getColumnChartOption(state)(chartKeys.main)).toEqual({});
+        expect(getters.getColumnChartDatazoomOption(state)(chartKeys.main)).toEqual({});
       });
     });
   });