Merge pull request #7178 from IgniteUI/mkirova/fix-filter-summaries-rowpinning-integration

fix(igxGrid): Fix and test for issue with row pinning + filtering + s…

Author: ChronosSF

projects/igniteui-angular/src/lib/grids/api.service.ts

@@ -34,6 +34,9 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
     public get_summary_data() {
         const grid = this.grid;
         let data = grid.filteredData;
+        if (data && grid.hasPinnedRecords) {
+           data = grid._filteredUnpinnedData;
+        }
         if (!data) {
             if (grid.transactions.enabled) {
                 data = DataUtil.mergeTransactions(

projects/igniteui-angular/src/lib/grids/common/pipes.ts

@@ -238,6 +238,7 @@ export class IgxGridRowPinningPipe implements PipeTransform {
         }
 
         grid.unpinnedRecords = collection;
+
         return collection.map((rec) => {
             return grid.isRecordPinned(rec) ? { recordRef: rec, ghostRecord: true} : rec;
         });

projects/igniteui-angular/src/lib/grids/grid-base.directive.ts

@@ -2457,7 +2457,11 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
     protected _filteredSortedPinnedData;
     protected _filteredSortedUnpinnedData;
     protected _filteredPinnedData;
-    protected _filteredUnpinnedData;
+
+    /**
+     * @hidden
+     */
+    public _filteredUnpinnedData;
 
     /**
      * @hidden
@@ -2875,10 +2879,6 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
             this.summaryService.summaryHeight = 0;
             this.notifyChanges(true);
         });
-
-        this.onRowPinning.subscribe(() => {
-            this.summaryService.clearSummaryCache();
-        });
     }
 
     /**

projects/igniteui-angular/src/lib/grids/grid/grid-row-pinning.spec.ts

@@ -358,6 +358,23 @@ describe('Row Pinning #grid', () => {
             expect(pinRowContainer[0].children[0].context.rowID).toBe(fix.componentInstance.data[4]);
         });
 
+        it('should calculate global summaries correctly when filtering is applied.', () => {
+            grid.getColumnByName('ID').hasSummary = true;
+            fix.detectChanges();
+            grid.filter('ID', 'BERGS', IgxStringFilteringOperand.instance().condition('contains'), false);
+            fix.detectChanges();
+
+            let summaryRow = GridSummaryFunctions.getRootSummaryRow(fix);
+            GridSummaryFunctions.verifyColumnSummaries(summaryRow, 0, ['Count'], ['1']);
+
+            // pin row
+            grid.getRowByIndex(0).pin();
+            fix.detectChanges();
+
+            summaryRow = GridSummaryFunctions.getRootSummaryRow(fix);
+            GridSummaryFunctions.verifyColumnSummaries(summaryRow, 0, ['Count'], ['1']);
+        });
+
         it('should remove pinned container and recalculate sizes when all pinned records are filtered out.', () => {
             grid.getRowByIndex(1).pin();
             fix.detectChanges();

src/app/grid-row-pinning/grid-row-pinning.sample.html

@@ -46,7 +46,7 @@
                 </igx-column>
                 <igx-column *ngFor="let c of columns" [sortable]="true" [field]="c.field" [header]="c.field"
                     [width]="c.width" [pinned]='c.pinned' [groupable]='c.groupable' [hidden]='c.hidden'
-                    [editable]='true'>
+                    [editable]='true' [hasSummary]='true'>
                 </igx-column>
             </igx-grid>
         </div>
@@ -70,7 +70,7 @@
                         <button (click)="hGrid.deleteRow(cell.cellID.rowID)">Delete</button>
                     </ng-template>
                 </igx-column>
-                <igx-column *ngFor="let c of hColumns" [editable]="true" [sortable]="true" [field]="c.field" [header]="c.field" [width]="c.width" [pinned]='c.pinned' [groupable]='c.groupable' >
+                <igx-column *ngFor="let c of hColumns" [hasSummary]='true' [editable]="true" [sortable]="true" [field]="c.field" [header]="c.field" [width]="c.width" [pinned]='c.pinned' [groupable]='c.groupable' >
                 </igx-column>
                 <igx-row-island [key]="'childData'" [autoGenerate]="true" [rowSelectable]='true'  [allowFiltering]='true'  >
                     <igx-row-island [key]="'childData'" [autoGenerate]="true" [rowSelectable]='true' [allowFiltering]='true'></igx-row-island>