release: fixes

- Fixed custom format issue in ChartJS

Author: vytisbulkevicius

.github/workflows/test-e2e.yml

@@ -41,13 +41,11 @@ jobs:
           bash ./bin/run-e2e-tests-${{matrix.env}}.sh
       - name: Run ${{ matrix.env }} Cypress tests
         env:
-          CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
           GITHUB_TOKEN: ${{ secrets.BOT_TOKEN }}
         uses: cypress-io/github-action@v2
         with:
           env: host=localhost,port=8080
           browser: chrome
-          record: true
           install: ${{ ! steps.npm-and-build-cache.outputs.cache-hit }}
           headless: true
           spec: cypress/integration/${{ matrix.env }}/**/*

classes/Visualizer/Render/Sidebar/Type/ChartJS/Pie.php

@@ -109,6 +109,26 @@ protected function _renderChartTypeSettings() {
 					esc_html__( 'If checked, the chart will be rendered as a donut chart.', 'visualizer' )
 				);
 
+				self::_renderTextItem(
+					esc_html__( 'Number Format', 'visualizer' ),
+					'format',
+					isset( $this->format ) ? $this->format : '',
+					sprintf(
+						'%s<br><br>%s<br><br>%s',
+						esc_html__( 'Enter custom format pattern to apply to horizontal axis labels.', 'visualizer' ),
+						sprintf(
+							esc_html__( 'For number axis labels, this is a subset of the decimal formatting %1$sICU pattern set%2$s. For instance, $#,###.## will display values $1,234.56 for value 1234.56. Pay attention that if you use #&#37;&#37; percentage format then your values will be multiplied by 100.', 'visualizer' ),
+							'<a href="http://icu-project.org/apiref/icu4c/classDecimalFormat.html#_details" target="_blank">',
+							'</a>'
+						),
+						sprintf(
+							esc_html__( 'For date axis labels, this is a subset of the date formatting %1$sICU date and time format%2$s.', 'visualizer' ),
+							'<a href="https://unicode-org.github.io/icu/userguide/format_parse/datetime/#datetime-format-syntax" target="_blank">',
+							'</a>'
+						)
+					)
+				);
+
 			self::_renderSectionEnd();
 
 		self::_renderGroupEnd();

composer.json

@@ -48,7 +48,7 @@
   },
   "require-dev": {
     "wp-coding-standards/wpcs": "^2.3",
-    "dealerdirect/phpcodesniffer-composer-installer": "^0.7.1",
+    "dealerdirect/phpcodesniffer-composer-installer": "^1.0.0",
     "phpcompatibility/phpcompatibility-wp": "*"
   }
 }

composer.lock

@@ -118,6 +118,35 @@
             return;
         }
 
+        // Format series label.
+        settings.plugins.tooltip = {
+            callbacks: {
+                label: function(context) {
+                    var label = '';
+                    if ( 'object' === typeof context.dataset.label ) {
+                        label = context.label || '';
+                    } else {
+                        label = context.dataset.label || '';
+                    }
+                    if ( label ) {
+                        label += ': ';
+                    }
+                    var format = context.dataset.format || '';
+                    if ( format ) {
+                        label += format_datum( context.formattedValue, format );
+                    } else {
+                        format = 'undefined' !== typeof context.chart.config._config.options.format ? context.chart.config._config.options.format : '';
+                        if ( format ) {
+                            label += format_datum( context.formattedValue, format );
+                        } else {
+                            label += context.formattedValue;
+                        }
+                    }
+                    return label;
+                }
+            }
+        };
+
         var chartjs = new Chart(context, {
             type: type,
             data: {
@@ -131,7 +160,7 @@
                     if ( $( '#chart-img' ).length ) {
                         $( '#chart-img' ).val( canvas.toDataURL() );
                     }
-                },
+                }
             }],
         });