@datarailsshared/dr_renderer 1.2.317-rocket → 1.2.320

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datarailsshared/dr_renderer",
-  "version": "1.2.317-rocket",
+  "version": "1.2.320",
   "description": "DataRails charts and tables renderer",
   "keywords": [
     "datarails",

package/src/highcharts_renderer.js

@@ -139,6 +139,11 @@ const CHART_AXIS_DEFAULT_LABEL = 'Axis (Category)';
 
 const CHART_LEGEND_DEFAULT_LABEL = 'Legend (Series)';
 
+const FEATURES = {
+    ENABLE_NEW_WIDGET_VALUE_FORMATTING: 'enable_new_widget_value_formatting',
+    ENABLE_SERVER_TOTALS_CALCULATION: 'enable_server_totals_calculation',
+}
+
 let getHighchartsRenderer = function ($, document, Highcharts, default_colors, highchartsRenderer,
                                       DataFormatter, lodash, moment_lib, isNewAngular) {
 
@@ -166,10 +171,12 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
     lodash.assign(highchartsRenderer, HIGHCHARTS_CONSTANTS);
 
     highchartsRenderer.useTotalsCalculation = false;
+    highchartsRenderer.enabledNewWidgetValueFormatting = false;
     let disableAnimation = false;
     if (document.ReportHippo && document.ReportHippo && document.ReportHippo.user) {
-        highchartsRenderer.useTotalsCalculation = lodash.includes(document.ReportHippo.user.features, 'enable_server_totals_calculation');
+        highchartsRenderer.useTotalsCalculation = lodash.includes(document.ReportHippo.user.features, FEATURES.ENABLE_SERVER_TOTALS_CALCULATION);
         disableAnimation = document.ReportHippo.user.organization && document.ReportHippo.user.organization.settings && document.ReportHippo.user.organization.settings.disable_animation
+        highchartsRenderer.enabledNewWidgetValueFormatting = lodash.includes(document.ReportHippo.user.features, FEATURES.ENABLE_NEW_WIDGET_VALUE_FORMATTING);
     }
 
     // fix issue of use tootip.stickOnContact with tooltip.outside , source: https://github.com/highcharts/highcharts/pull/15960
@@ -628,7 +635,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     // do nothing
                 }
             }
-            return $.pivotUtilities.getFormattedNumber(value, null, opts);
+            return $.pivotUtilities.getFormattedNumber(value, null, opts).replace(/\u00A0/g, " ");
         };
         return func;
     };
@@ -3883,6 +3890,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
 
     highchartsRenderer.rhPivotCount = function (arg, widget_values_format, is_graph, render_options, calculated_info) {
         var attr = arg[0];
+        // isCustomValues format need for check in case when customer apply SecondaryAxis and one of them is true
+        // in that case we take formats from seriesOptions and apply those format to each one of them their format from the table
+        // method isCustomValuesFormat check if format was added custom format by self or it's a default format from table
+        const isCustomValuesFormat = highchartsRenderer.isCustomValuesFormat(render_options, widget_values_format);
+
         return function (data, rowKey, colKey) {
             return {
                 sum: 0,
@@ -3894,6 +3906,10 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                 calculated_formats: calculated_info.formats,
                 isChangeable: false,
                 push: function (record) {
+                    if (highchartsRenderer.enabledNewWidgetValueFormatting) {
+                        record.formats = highchartsRenderer.getRecordFormats(render_options, record['DR_Values']);
+                    }
+
                     if (record.hasOwnProperty('data_types') && $.isArray(record['data_types'])) {
                         this.data_types = this.data_types.concat(record['data_types']);
                         this.data_types = lodash.uniq(this.data_types);
@@ -3938,7 +3954,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                         number_format = 'General';
                     }
 
-                    if (this.widget_values_format) {
+                    if (this.widget_values_format && !highchartsRenderer.enabledNewWidgetValueFormatting) {
+                        number_format = this.widget_values_format;
+                    }
+
+                    if (isCustomValuesFormat) {
                         number_format = this.widget_values_format;
                     }
 
@@ -4026,6 +4046,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
 
     highchartsRenderer.rhPivotAggregatorSum = function (arg, widget_values_format, is_graph, render_options, calculated_info) {
         var attr = arg[0];
+        // isCustomValues format need for check in case when customer apply SecondaryAxis and one of them is true
+        // in that case we take formats from seriesOptions and apply those format to each one of them their format from the table
+        // method isCustomValuesFormat check if format was added custom format by self or it's a default format from table
+        const isCustomValuesFormat = highchartsRenderer.isCustomValuesFormat(render_options, widget_values_format);
+
         return function (data, rowKey, colKey) {
             return {
                 sum: 0,
@@ -4046,7 +4071,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                         }
                     }
                     var val = parseFloat(record[attr]);
+
                     if (!isNaN(val)) {
+                        if (highchartsRenderer.enabledNewWidgetValueFormatting) {
+                            record.formats = highchartsRenderer.getRecordFormats(render_options, record['DR_Values']);
+                        }
 
                         if (record.hasOwnProperty('data_types') && $.isArray(record['data_types'])) {
                             this.data_types = this.data_types.concat(record['data_types']);
@@ -4093,13 +4122,16 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                         number_format = 'General';
                     }
 
-                    if (this.widget_values_format) {
+                    if (this.widget_values_format && !highchartsRenderer.enabledNewWidgetValueFormatting) {
                         number_format = this.widget_values_format;
                     }
 
+                    if (isCustomValuesFormat) {
+                        number_format = this.widget_values_format;
+                    }
                     number_format = highchartsRenderer.getCalculatedValueFormat(this.calculated_formats, rowKey, colKey) || number_format;
-
                     var formated_value = highchartsRenderer.formatValue('n', number_format, x)
+
                     if (formated_value && formated_value.hasOwnProperty('value') && formated_value.value != null) {
                         return formated_value.value;
                     } else {
@@ -4114,6 +4146,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
 
     highchartsRenderer.rhPivotAggregatorMin = function (arg, widget_values_format, is_graph, render_options, calculated_info) {
         var attr = arg[0];
+        // isCustomValues format need for check in case when customer apply SecondaryAxis and one of them is true
+        // in that case we take formats from seriesOptions and apply those format to each one of them their format from the table
+        // method isCustomValuesFormat check if format was added custom format by self or it's a default format from table
+        const isCustomValuesFormat = highchartsRenderer.isCustomValuesFormat(render_options, widget_values_format);
+
         return function (data, rowKey, colKey) {
             return {
                 val: null,
@@ -4137,6 +4174,10 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     var ref, x;
                     x = parseFloat(record[attr]);
                     if (!isNaN(x)) {
+                        if (highchartsRenderer.enabledNewWidgetValueFormatting) {
+                            record.formats = highchartsRenderer.getRecordFormats(render_options, record['DR_Values']);
+                        }
+
                         if (record.hasOwnProperty('data_types') && $.isArray(record['data_types'])) {
                             this.data_types = this.data_types.concat(record['data_types']);
                             this.data_types = lodash.uniq(this.data_types);
@@ -4179,7 +4220,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                         number_format = 'General';
                     }
 
-                    if (this.widget_values_format) {
+                    if (this.widget_values_format && !highchartsRenderer.enabledNewWidgetValueFormatting) {
+                        number_format = this.widget_values_format;
+                    }
+
+                    if (isCustomValuesFormat) {
                         number_format = this.widget_values_format;
                     }
 
@@ -4200,6 +4245,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
 
     highchartsRenderer.rhPivotAggregatorMax = function (arg, widget_values_format, is_graph, render_options, calculated_info) {
         var attr = arg[0];
+        // isCustomValues format need for check in case when customer apply SecondaryAxis and one of them is true
+        // in that case we take formats from seriesOptions and apply those format to each one of them their format from the table
+        // method isCustomValuesFormat check if format was added custom format by self or it's a default format from table
+        const isCustomValuesFormat = highchartsRenderer.isCustomValuesFormat(render_options, widget_values_format);
+
         return function (data, rowKey, colKey) {
             return {
                 val: null,
@@ -4223,6 +4273,10 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     var ref, x;
                     x = parseFloat(record[attr]);
                     if (!isNaN(x)) {
+                        if (highchartsRenderer.enabledNewWidgetValueFormatting) {
+                            record.formats = highchartsRenderer.getRecordFormats(render_options, record['DR_Values']);
+                        }
+
                         if (record.hasOwnProperty('data_types') && $.isArray(record['data_types'])) {
                             this.data_types = this.data_types.concat(record['data_types']);
                             this.data_types = lodash.uniq(this.data_types);
@@ -4266,7 +4320,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                         number_format = 'General';
                     }
 
-                    if (this.widget_values_format) {
+                    if (this.widget_values_format && !highchartsRenderer.enabledNewWidgetValueFormatting) {
+                        number_format = this.widget_values_format;
+                    }
+
+                    if (isCustomValuesFormat) {
                         number_format = this.widget_values_format;
                     }
 
@@ -4287,6 +4345,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
 
     highchartsRenderer.rhPivotAggregatorAverage = function (arg, widget_values_format, is_graph, render_options, calculated_info) {
         var attr = arg[0];
+        // isCustomValues format need for check in case when customer apply SecondaryAxis and one of them is true
+        // in that case we take formats from seriesOptions and apply those format to each one of them their format from the table
+        // method isCustomValuesFormat check if format was added custom format by self or it's a default format from table
+        const isCustomValuesFormat = highchartsRenderer.isCustomValuesFormat(render_options, widget_values_format);
+
         return function (data, rowKey, colKey) {
             return {
                 sum: 0,
@@ -4311,6 +4374,10 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     var ref, x;
                     x = parseFloat(record[attr]);
                     if (!isNaN(x)) {
+                        if (highchartsRenderer.enabledNewWidgetValueFormatting) {
+                            record.formats = highchartsRenderer.getRecordFormats(render_options, record['DR_Values']);
+                        }
+
                         if (record.hasOwnProperty('data_types') && $.isArray(record['data_types'])) {
                             this.data_types = this.data_types.concat(record['data_types']);
                             this.data_types = lodash.uniq(this.data_types);
@@ -4360,7 +4427,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                         number_format = 'General';
                     }
 
-                    if (this.widget_values_format) {
+                    if (this.widget_values_format && !highchartsRenderer.enabledNewWidgetValueFormatting) {
+                        number_format = this.widget_values_format;
+                    }
+
+                    if (isCustomValuesFormat) {
                         number_format = this.widget_values_format;
                     }
 
@@ -9196,6 +9267,25 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
         }
     }
 
+    highchartsRenderer.checkFormats = function(render_options, widget_values_format) {
+        const isSecondaryAxis = lodash.some(render_options.comboOptions?.seriesOptions, series => series?.secondaryAxis);
+        const formats = lodash.map(render_options.comboOptions?.seriesOptions, series => series.format);
+        const isCustomFormat = !lodash.includes(formats, widget_values_format);
+
+        return { isSecondaryAxis, isCustomFormat }
+    }
+
+    highchartsRenderer.getRecordFormats = function(render_options, recordName) {
+       return render_options?.comboOptions?.seriesOptions
+           .filter(series => series.series === recordName)
+           .map(series => series.format);
+    }
+
+    highchartsRenderer.isCustomValuesFormat = function (render_options, widget_values_format) {
+        const { isSecondaryAxis, isCustomFormat } = highchartsRenderer.checkFormats(render_options, widget_values_format);
+        return highchartsRenderer.enabledNewWidgetValueFormatting && (isCustomFormat || !isSecondaryAxis);
+    }
+
     return highchartsRenderer;
 };
 

package/tests/highcharts_renderer.test.js

@@ -483,6 +483,7 @@ describe('highcharts_renderer', () => {
         let opts;
 
         beforeEach(() => {
+            highchartsRenderer.enabledNewWidgetValueFormatting = false;
             funcContext = { y: '12345.678' };
             opts = {}
         });
@@ -1735,6 +1736,7 @@ describe('highcharts_renderer', () => {
                     });
 
                     it('Formats must be filled and uniq', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = false;
                         aggregatorObject.push({Profit: 123, formats: ['####', '####', '#,###']});
                         expect(aggregatorObject.formats).toEqual(['####', '#,###']);
                     });
@@ -1781,6 +1783,21 @@ describe('highcharts_renderer', () => {
                         aggregatorObject.push({Profit: 20, 'Region average': 'Central', Region: 'Region average'});
                         expect(aggregatorObject.ignoreValue).toBe(true);
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotAggregatorSum(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.formats).toEqual(['\"$\"#,###.###']);
+                    });
                 });
 
                 describe('Value method', () => {
@@ -1831,6 +1848,22 @@ describe('highcharts_renderer', () => {
                         aggregatorObject = aggregator({}, ['Region average'], '');
                         expect(aggregatorObject.format(1123.45678, false)).toBe('112345.68%');
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions and widget_value_format to equal first seriesOptions format', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        widget_values_format = '\"$\"#,###.###';
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotAggregatorSum(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.format(1123.45678, false)).toBe('$1,123.457');
+                    });
                 });
             });
 
@@ -1912,6 +1945,7 @@ describe('highcharts_renderer', () => {
                     });
 
                     it('Formats must be filled and uniq', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = false;
                         aggregatorObject.push({Profit: 123, formats: ['####', '####', '#,###']});
                         expect(aggregatorObject.formats).toEqual(['####', '#,###']);
                     });
@@ -1958,6 +1992,21 @@ describe('highcharts_renderer', () => {
                         aggregatorObject.push({Profit: 20, 'Region average': 'Central', Region: 'Region average'});
                         expect(aggregatorObject.ignoreValue).toBe(true);
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotCount(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.formats).toEqual(['\"$\"#,###.###']);
+                    });
                 });
 
                 describe('Value method', () => {
@@ -2008,6 +2057,22 @@ describe('highcharts_renderer', () => {
                         aggregatorObject = aggregator({}, ['Region average'], '');
                         expect(aggregatorObject.format(1123.45678, false)).toBe('112345.68%');
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions and widget_value_format to equal first seriesOptions format', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        widget_values_format = '\"$\"#,###.###';
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotCount(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.format(1123.45678, false)).toBe('$1,123.457');
+                    });
                 });
             });
 
@@ -2243,6 +2308,7 @@ describe('highcharts_renderer', () => {
                     });
 
                     it('Formats must be filled and uniq', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = false;
                         aggregatorObject.push({Profit: 123, formats: ['####', '####', '#,###']});
                         expect(aggregatorObject.formats).toEqual(['####', '#,###']);
                     });
@@ -2291,6 +2357,21 @@ describe('highcharts_renderer', () => {
                         aggregatorObject.push({Profit: 20, 'Region average': 'Central', Region: 'Region average'});
                         expect(aggregatorObject.ignoreValue).toBe(true);
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotAggregatorAverage(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.formats).toEqual(['\"$\"#,###.###']);
+                    });
                 });
 
                 describe('Value method', () => {
@@ -2350,6 +2431,22 @@ describe('highcharts_renderer', () => {
                         aggregatorObject = aggregator({}, ['Region average'], '');
                         expect(aggregatorObject.format(1123.45678, false)).toBe('112345.68%');
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions and widget_value_format to equal first seriesOptions format', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        widget_values_format = '\"$\"#,###.###';
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotAggregatorAverage(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.format(1123.45678, false)).toBe('$1,123.457');
+                    });
                 });
             });
 
@@ -2431,6 +2528,7 @@ describe('highcharts_renderer', () => {
                     });
 
                     it('Formats must be filled and uniq', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = false;
                         aggregatorObject.push({Profit: 123, formats: ['####', '####', '#,###']});
                         expect(aggregatorObject.formats).toEqual(['####', '#,###']);
                     });
@@ -2477,6 +2575,21 @@ describe('highcharts_renderer', () => {
                         aggregatorObject.push({Profit: 20, 'Region average': 'Central', Region: 'Region average'});
                         expect(aggregatorObject.ignoreValue).toBe(true);
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotAggregatorMin(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.formats).toEqual(['\"$\"#,###.###']);
+                    });
                 });
 
                 describe('Value method', () => {
@@ -2528,6 +2641,22 @@ describe('highcharts_renderer', () => {
                         aggregatorObject = aggregator({}, ['Region average'], '');
                         expect(aggregatorObject.format(1123.45678, false)).toBe('112345.68%');
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions and widget_value_format to equal first seriesOptions format', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        widget_values_format = '\"$\"#,###.###';
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotAggregatorMin(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.format(1123.45678, false)).toBe('$1,123.457');
+                    });
                 });
             });
 
@@ -2609,6 +2738,7 @@ describe('highcharts_renderer', () => {
                     });
 
                     it('Formats must be filled and uniq', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = false;
                         aggregatorObject.push({Profit: 123, formats: ['####', '####', '#,###']});
                         expect(aggregatorObject.formats).toEqual(['####', '#,###']);
                     });
@@ -2655,6 +2785,21 @@ describe('highcharts_renderer', () => {
                         aggregatorObject.push({Profit: 20, 'Region average': 'Central', Region: 'Region average'});
                         expect(aggregatorObject.ignoreValue).toBe(true);
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotAggregatorMax(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.formats).toEqual(['\"$\"#,###.###']);
+                    });
                 });
 
                 describe('Value method', () => {
@@ -2706,6 +2851,22 @@ describe('highcharts_renderer', () => {
                         aggregatorObject = aggregator({}, ['Region average'], '');
                         expect(aggregatorObject.format(1123.45678, false)).toBe('112345.68%');
                     });
+
+                    it('if FF enabledNewWidgetValueFormatting is and some of secondaryAxis is true widget values format must be from seriesOptions and widget_value_format to equal first seriesOptions format', () => {
+                        highchartsRenderer.enabledNewWidgetValueFormatting = true;
+                        widget_values_format = '\"$\"#,###.###';
+                        const options = {
+                            comboOptions: {
+                                seriesOptions: [
+                                    {series: 'Profit', format: '\"$\"#,###.###' , secondaryAxis: true},
+                                ]
+                            }
+                        }
+                        aggregator = highchartsRenderer.rhPivotAggregatorMax(arg, widget_values_format, is_graph, options, calculated_info);
+                        aggregatorObject = aggregator({}, ['Profit'], '');
+                        aggregatorObject.push({ DR_Values: 'Profit', Profit: 123 });
+                        expect(aggregatorObject.format(1123.45678, false)).toBe('$1,123.457');
+                    });
                 });
             });
         });
@@ -4291,4 +4452,144 @@ describe('highcharts_renderer', () => {
             expect(highchartsRenderer.getTrendSeriesName(series)).toBe(expectedName);
         });
     });
+
+    describe('function checkFormats', () => {
+        it('should correctly detect if any series is on secondary axis', () => {
+            const render_options = {
+                comboOptions: {
+                    seriesOptions: [
+                        { secondaryAxis: false },
+                        { secondaryAxis: true },
+                        { secondaryAxis: false },
+                    ],
+                },
+            };
+            const widget_values_format = '#,###';
+            const result = highchartsRenderer.checkFormats(render_options, widget_values_format);
+            expect(result.isSecondaryAxis).toBe(true);
+        });
+
+        it('should correctly detect if all series are on primary axis', () => {
+            const render_options = {
+                comboOptions: {
+                    seriesOptions: [
+                        { secondaryAxis: false },
+                        { secondaryAxis: false },
+                        { secondaryAxis: false },
+                    ],
+                },
+            };
+            const widget_values_format = '#,###';
+            const result = highchartsRenderer.checkFormats(render_options, widget_values_format);
+            expect(result.isSecondaryAxis).toBe(false);
+        });
+
+        it('should correctly detect if the given format is custom', () => {
+            const render_options = {
+                comboOptions: {
+                    seriesOptions: [
+                        { format: '#,###' },
+                        { format: '#,###' },
+                        { format: '#,###' },
+                    ],
+                },
+            };
+            const widget_values_format = '$#,###.###';
+            const result = highchartsRenderer.checkFormats(render_options, widget_values_format);
+            expect(result.isCustomFormat).toBe(true);
+        });
+
+        it('should correctly detect if the given format is not custom', () => {
+            const render_options = {
+                comboOptions: {
+                    seriesOptions: [
+                        { format: '$#,###' },
+                        { format: '$#,###.#' },
+                        { format: '$#,###.##' },
+                    ],
+                },
+            };
+            const widget_values_format = '$#,###';
+            const result = highchartsRenderer.checkFormats(render_options, widget_values_format);
+            expect(result.isCustomFormat).toBe(false);
+        });
+    });
+
+    describe('function isCustomValuesFormat', () => {
+        const render_options = {
+            comboOptions: {
+                seriesOptions: [
+                    { series: 'Profit', format: '#,###', secondaryAxis: false },
+                    { series: 'Sales', format: '#,###', secondaryAxis: true },
+                ]
+            }
+        };
+
+        it('should return true if new widget value formatting is enabled and the format is custom or there is no secondary axis', () => {
+            const widget_values_format = '$####.##';
+
+            highchartsRenderer.enabledNewWidgetValueFormatting = true;
+
+            const expectedValue = true;
+
+            const result = highchartsRenderer.isCustomValuesFormat(render_options, widget_values_format);
+
+            expect(result).toEqual(expectedValue);
+        });
+
+        it('should return false if new widget value formatting is disabled', () => {
+            const widget_values_format = '#,###';
+
+            highchartsRenderer.enabledNewWidgetValueFormatting = false;
+
+            const expectedValue = false;
+
+            const result = highchartsRenderer.isCustomValuesFormat(render_options, widget_values_format);
+
+            expect(result).toEqual(expectedValue);
+        });
+
+        it('should return false if the format is not custom and there is a secondary axis', () => {
+            const widget_values_format = '#,###';
+
+            highchartsRenderer.enabledNewWidgetValueFormatting = true;
+
+            const expectedValue = false;
+
+            const result = highchartsRenderer.isCustomValuesFormat(render_options, widget_values_format);
+
+            expect(result).toEqual(expectedValue);
+        });
+    });
+
+    describe('getRecordFormats', () => {
+        const render_options = {
+            comboOptions: {
+                seriesOptions: [
+                    { series: 'Profit', format: '$####.#', secondaryAxis: false },
+                    { series: 'Sales', format: '$####.##', secondaryAxis: true },
+                ]
+            }
+        };
+
+        it('should return an array of formats for the given record name', () => {
+            const recordName = 'Profit';
+
+            const expectedValue = ['$####.#'];
+
+            const result = highchartsRenderer.getRecordFormats(render_options, recordName);
+
+            expect(result).toEqual(expectedValue);
+        });
+
+        it('should return an empty array if there are no matching records', () => {
+            const recordName = 'Any';
+
+            const expectedValue = [];
+
+            const result = highchartsRenderer.getRecordFormats(render_options, recordName);
+
+            expect(result).toEqual(expectedValue);
+        });
+    });
 });