fix using global format in header filter in dataGrid for dates

Author: GoodDayForSurf

packages/devextreme/js/__internal/grids/grid_core/header_filter/m_header_filter.ts

@@ -30,14 +30,31 @@ import {
 } from './m_header_filter_core';
 
 const DATE_INTERVAL_FORMATS = {
+  year(value) {
+    return String(value);
+  },
   month(value) {
     return dateLocalization.getMonthNames()[value - 1];
   },
   quarter(value) {
     return dateLocalization.format(new Date(2000, value * 3 - 1), 'quarter');
   },
+  day(value) {
+    return String(value);
+  },
+  hour(value) {
+    return String(value);
+  },
+  minute(value) {
+    return String(value);
+  },
+  second(value) {
+    return String(value);
+  },
 };
 
+const getDateIntervalFormat = (intervalKey: string) => DATE_INTERVAL_FORMATS[intervalKey] ?? ((v) => String(v));
+
 function ungroupUTCDates(items, dateParts?, dates?) {
   dateParts = dateParts || [];
   dates = dates || [];
@@ -84,7 +101,7 @@ export const getFormatOptions = function (value, column, currentLevel) {
     result.groupInterval = groupInterval[currentLevel];
 
     if (gridCoreUtils.isDateType(column.dataType)) {
-      result.format = DATE_INTERVAL_FORMATS[groupInterval[currentLevel]];
+      result.format = getDateIntervalFormat(groupInterval[currentLevel]);
     } else if (column.dataType === 'number') {
       result.getDisplayFormat = function () {
         const formatOptions = { format: column.format, target: 'headerFilter' };

packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/headerFilter.tests.js

@@ -804,6 +804,39 @@ QUnit.module('Header Filter', {
         assert.strictEqual($popupContent.find(`.${TREEVIEW_ITEM_CLASS}`).eq(4).text(), '4', 'text the nested treeview item');
     });
 
+    QUnit.test('Header filter date groupInterval levels do not use global numberFormat (T day level)', function(assert) {
+        const that = this;
+        const testElement = $('#container');
+        const savedConfig = { ...config() };
+
+        try {
+            config({
+                ...config(),
+                numberFormat: '#,##0.00',
+            });
+
+            that.columns[0].dataType = 'date';
+            that.items = [{ Test1: new Date(1986, 0, 1), Test2: 'test2' }, { Test1: new Date(1986, 0, 4), Test2: 'test4' }];
+            that.setupDataGrid();
+            that.columnHeadersView.render(testElement);
+            that.headerFilterView.render(testElement);
+
+            that.headerFilterController.showHeaderFilterMenu(0);
+
+            const $popupContent = that.headerFilterView.getPopupContainer().$content();
+
+            assert.strictEqual($popupContent.find(`.${TREEVIEW_ITEM_CLASS}`).eq(1).text(), '1986', 'year level is not formatted as number');
+
+            $($popupContent.find('.dx-treeview-toggle-item-visibility').first()).trigger('dxclick');
+            $($popupContent.find('.dx-treeview-toggle-item-visibility').last()).trigger('dxclick');
+
+            assert.strictEqual($popupContent.find(`.${TREEVIEW_ITEM_CLASS}`).eq(3).text(), '1', 'day level is not formatted as number');
+            assert.strictEqual($popupContent.find(`.${TREEVIEW_ITEM_CLASS}`).eq(4).text(), '4', 'day level is not formatted as number');
+        } finally {
+            config(savedConfig);
+        }
+    });
+
     // T274290
     QUnit.test('Header filter with items when column lookup with simple types', function(assert) {
         // arrange