Merge pull request #8286 from IgniteUI/ibarakov/fix-8162-master

Don't duplicate records in esf menu when filteringIgnoreCase is true.

Author: DiyanDimitrov

projects/igniteui-angular/src/lib/grids/filtering/excel-style/grid.excel-style-filtering.component.ts

@@ -500,7 +500,15 @@ export class IgxGridExcelStyleFilteringComponent implements OnDestroy {
     }
 
     private generateUniqueValues(columnValues: any[]) {
-        this.uniqueValues = Array.from(new Set(columnValues));
+        if (this.column.dataType === DataType.String && this.column.filteringIgnoreCase) {
+            const filteredUniqueValues = columnValues.map(s => s?.toLowerCase())
+                .reduce((map, val, i) => map.get(val) ? map : map.set(val, columnValues[i]),
+                new Map);
+
+            this.uniqueValues = Array.from(filteredUniqueValues.values());
+        } else {
+            this.uniqueValues = Array.from(new Set(columnValues));
+        }
     }
 
     private generateFilterValues(isDateColumn: boolean = false) {

projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts

@@ -4384,10 +4384,42 @@ describe('IgxGrid - Filtering actions - Excel style filtering #grid', () => {
             expect(listItems.length).toBe(0, 'incorrect rendered list items count');
         }));
 
-        it('Should display "Add to current filter selection" button on typing in input', fakeAsync(() => {
-             // Open excel style filtering dialog.
-             GridFunctions.clickExcelFilterIconFromCode(fix, grid, 'Downloads');
+        it('Should ignore duplicate records when column\'\s filteringIgnoreCase is true', fakeAsync(() => {
+            const column = grid.getColumnByName('AnotherField');
+            expect(column.filteringIgnoreCase).toBeTrue();
+
+            GridFunctions.clickExcelFilterIconFromCode(fix, grid, 'AnotherField');
+            tick(100);
+            fix.detectChanges();
+
+            const searchComponent = GridFunctions.getExcelStyleSearchComponent(fix);
+            const listItems = GridFunctions.getExcelStyleSearchComponentListItems(fix, searchComponent);
+
+            expect(listItems.length).toBe(3, 'incorrect rendered list items count');
+            expect(listItems[1].innerText).toBe('Custom', 'incorrect list item label');
+        }));
+
+        it('Should not ignore duplicate records when column\'\s filteringIgnoreCase is false', fakeAsync(() => {
+            const column = grid.getColumnByName('AnotherField');
+            column.filteringIgnoreCase = false;
+            expect(column.filteringIgnoreCase).toBeFalse();
 
+            GridFunctions.clickExcelFilterIconFromCode(fix, grid, 'AnotherField');
+            tick(100);
+            fix.detectChanges();
+
+            const searchComponent = GridFunctions.getExcelStyleSearchComponent(fix);
+            const listItems = GridFunctions.getExcelStyleSearchComponentListItems(fix, searchComponent);
+
+            expect(listItems.length).toBe(5, 'incorrect rendered list items count');
+            expect(listItems[1].innerText).toBe('Custom', 'incorrect list item label');
+            expect(listItems[3].innerText).toBe('custoM', 'incorrect list item label');
+            expect(listItems[4].innerText).toBe('custom', 'incorrect list item label');
+        }));
+
+        it('Should display "Add to current filter selection" button on typing in input', fakeAsync(() => {
+            // Open excel style filtering dialog.
+            GridFunctions.clickExcelFilterIconFromCode(fix, grid, 'Downloads');
              // Type string in search box.
              const searchComponent = GridFunctions.getExcelStyleSearchComponent(fix);
              const inputNativeElement = GridFunctions.getExcelStyleSearchComponentInput(fix, searchComponent);

projects/igniteui-angular/src/lib/test-utils/grid-samples.spec.ts

@@ -998,7 +998,7 @@ export class CustomFilter extends IgxFilteringOperand {
         <igx-column width="100px" [field]="'ReleaseDate'" [header]="'ReleaseDate'" headerClasses="header-release-date"
             [filterable]="filterable" [resizable]="resizable" dataType="date">
         </igx-column>
-        <igx-column width="100px" [field]="'AnotherField'" [header]="'Anogther Field'" [filterable]="filterable"
+        <igx-column width="100px" [field]="'AnotherField'" [header]="'Another Field'" [filterable]="filterable"
             dataType="string" [filters]="customFilter">
         </igx-column>
     </igx-grid>`

projects/igniteui-angular/src/lib/test-utils/sample-test-data.spec.ts

@@ -1515,15 +1515,15 @@ export class SampleTestData {
             ProductName: 'Some other item with Script',
             ReleaseDate: SampleTestData.timeGenerator.timedelta(SampleTestData.today, 'day', 1),
             Released: null,
-            AnotherField: 'a'
+            AnotherField: 'Custom'
         },
         {
             Downloads: 0,
             ID: 7,
             ProductName: null,
             ReleaseDate: SampleTestData.timeGenerator.timedelta(SampleTestData.today, 'month', 1),
             Released: true,
-            AnotherField: 'a'
+            AnotherField: 'custoM'
         },
         {
             Downloads: 1000,