Merge branch 'vmihalkov/search-with-row-pinning' of https://github.com/IgniteUI/igniteui-angular into vmihalkov/search-with-row-pinning

Author: Vasil Mihalkov

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

@@ -147,6 +147,7 @@ import { IgxColumnComponent } from './columns/column.component';
 import { IgxColumnGroupComponent } from './columns/column-group.component';
 import { IGridSortingStrategy } from '../data-operations/sorting-strategy';
 import { IgxRowDragGhostDirective, IgxDragIndicatorIconDirective } from './row-drag.directive';
+import { isNumber } from 'util';
 
 const MINIMUM_COLUMN_WIDTH = 136;
 const FILTER_ROW_HEIGHT = 50;
@@ -2675,6 +2676,14 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
         return this._pinnedRecordIDs.length > 0;
     }
 
+    /**
+    * @hidden
+    * @internal
+    */
+    public get pinnedRecordsCount() {
+        return this._pinnedRecordIDs.length;
+    }
+
     private keydownHandler = (event) => {
         const key = event.key.toLowerCase();
         if ((isNavigationKey(key) && event.keyCode !== 32) || key === 'tab' || key === 'pagedown' || key === 'pageup') {
@@ -4138,7 +4147,8 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
 
         this.endEdit(true);
 
-        this._pinnedRecordIDs.splice(eventArgs.insertAtIndex || this._pinnedRecordIDs.length, 0, rowID);
+        const insertIndex = isNumber(eventArgs.insertAtIndex) ? eventArgs.insertAtIndex : this._pinnedRecordIDs.length;
+        this._pinnedRecordIDs.splice(insertIndex, 0, rowID);
         this._pipeTrigger++;
         if (this.gridAPI.grid) {
             this.notifyChanges(true);

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

@@ -103,10 +103,10 @@ export class IgxGridPagingPipe implements PipeTransform {
         if (!this.gridAPI.grid.paging) {
             return collection;
         }
-
+        const _perPage = perPage - this.gridAPI.grid.pinnedRecordsCount;
         const state = {
             index: page,
-            recordsPerPage: perPage
+            recordsPerPage: _perPage
         };
         DataUtil.correctPagingState(state, collection.data.length);
 

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

@@ -120,6 +120,31 @@ describe('Row Pinning #grid', () => {
             expect(grid.calcHeight - expectedHeight).toBeLessThanOrEqual(1);
         });
 
+        it('should allow pinning row at specified index via API.', () => {
+            grid.pinRow(fix.componentInstance.data[1]);
+            fix.detectChanges();
+
+            expect(grid.pinnedRows.length).toBe(1);
+            expect(grid.pinnedRows[0].rowData).toBe(fix.componentInstance.data[1]);
+
+            // pin at index 0
+            grid.pinRow(fix.componentInstance.data[2], 0);
+            fix.detectChanges();
+
+            expect(grid.pinnedRows.length).toBe(2);
+            expect(grid.pinnedRows[0].rowData).toBe(fix.componentInstance.data[2]);
+            expect(grid.pinnedRows[1].rowData).toBe(fix.componentInstance.data[1]);
+
+            // pin at index 1
+            grid.pinRow(fix.componentInstance.data[3], 1);
+            fix.detectChanges();
+
+            expect(grid.pinnedRows.length).toBe(3);
+            expect(grid.pinnedRows[0].rowData).toBe(fix.componentInstance.data[2]);
+            expect(grid.pinnedRows[1].rowData).toBe(fix.componentInstance.data[3]);
+            expect(grid.pinnedRows[2].rowData).toBe(fix.componentInstance.data[1]);
+        });
+
         it('should emit onRowPinning on pin/unpin.', () => {
             spyOn(grid.onRowPinning, 'emit').and.callThrough();
 
@@ -371,6 +396,33 @@ describe('Row Pinning #grid', () => {
             expect(gridFilterData[1].ID).toBe('BERGS');
         });
 
+        it('should page through unpinned collection with modified pageSize = pageSize - pinnedRows.lenght.', () => {
+            // pin 2nd row
+            grid.paging = true;
+            grid.perPage = 5;
+            fix.detectChanges();
+            let row = grid.getRowByIndex(1);
+            row.pin();
+            fix.detectChanges();
+
+            expect(grid.pinnedRows.length).toBe(1);
+            let pinRowContainer = fix.debugElement.queryAll(By.css(FIXED_ROW_CONTAINER));
+            expect(pinRowContainer.length).toBe(1);
+
+            expect(grid.dataView.length).toBe(4);
+
+            // unpin
+            row = grid.getRowByIndex(0);
+            row.unpin();
+            fix.detectChanges();
+
+            expect(grid.pinnedRows.length).toBe(0);
+            pinRowContainer = fix.debugElement.queryAll(By.css(FIXED_ROW_CONTAINER));
+            expect(pinRowContainer.length).toBe(0);
+
+            expect(grid.dataView.length).toBe(5);
+        });
+
         it('should apply sorting to both pinned and unpinned rows.', () => {
             grid.getRowByIndex(1).pin();
             grid.getRowByIndex(5).pin();