feat(grid): add a property to filter out columns from autogen (#12748)

* feat(grid): add a property to filter out columns from autogen

* chore(*): removing pivot implementation as it's not needed

* chore(*): addressing review comment

* chore(*): addressing comments

---------

Co-authored-by: Konstantin Dinev <[email protected]>

Author: ChronosSF

CHANGELOG.md

@@ -8,9 +8,9 @@ All notable changes for each version of this project will be documented in this
 - `IgxGrid`, `IgxTreeGrid`, `IgxHierarchicalGrid`:
     - `GroupMemberCountSortingStrategy` is added, which can be used to sort the grid by number of items in each group in ASC or DESC order, if grouping is applied.
     - A new argument `primaryKey` has been introduced to `IRowDataEventArgs` Interface and part of the event arguments that are emitted by the `rowAdded` and `rowDeleted` events. When the grid has a primary key attribute added, then the emitted `primaryKey` event argument represents the row ID, otherwise it defaults to undefined.
+    - Added the `autoGenerateExclude` property that accepts an array of strings for property names that are to be excluded from the generated column collection
 - `IgxColumnComponent`
     - Added `currRec` and `groupRec` parameters to the `groupingComparer` function that give access to the all properties of the compared records.
-
 - `IgxOverlayService`
     -A new event `contentAppending` is introduced - the event is emitted before the content is appended to the overlay. The event is emitted with `OverlayEventArgs` arguments and is not cancellable.
 

projects/igniteui-angular/src/lib/grids/README.md

@@ -166,6 +166,7 @@ Below is the list of all inputs that the developers may set to configure the gri
 |`data`|Array|The data source for the grid.|
 |`resourceStrings`| IGridResourceStrings | Resource strings of the grid. |
 |`autoGenerate`|boolean|Autogenerate grid's columns, default value is _false_|
+|`autoGenerateExclude`|Array|A list of property keys to be excluded from the generated column collection, default is _[]_|
 |`batchEditing`|boolean|Toggles batch editing in the grid, default is _false_|
 |`moving`|boolean|Enables the columns moving feature. Defaults to _false_|
 |`paging`|boolean|Enables the paging feature. Defaults to _false_.|

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

@@ -212,6 +212,23 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
     @Input()
     public autoGenerate = false;
 
+    /**
+     * Gets/Sets a list of property keys to be excluded from the generated column collection
+     * @remarks
+     * The collection is only used during initialization and changing it will not cause any changes in the generated columns at runtime
+     * unless the grid is destroyed and recreated. To modify the columns visible in the UI at runtime, please use their
+     * [hidden](https://www.infragistics.com/products/ignite-ui-angular/docs/typescript/latest/classes/IgxColumnComponent.html#hidden) property.
+     * @example
+     * ```html
+     * <igx-grid data=[Data] [autoGenerate]="true" [autoGenerateExclude]="['ProductName', 'Count']"></igx-grid>
+     * ```
+     * ```typescript
+     * const Data = [{ 'Id': '1', 'ProductName': 'name1', 'Description': 'description1', 'Count': 5 }]
+     * ```
+     */
+    @Input()
+    public autoGenerateExclude: string[] = [];
+
     /**
      * Controls whether columns moving is enabled in the grid.
      *
@@ -7145,7 +7162,8 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
     }
 
     protected generateDataFields(data: any[]): string[] {
-        return Object.keys(data && data.length !== 0 ? data[0] : []);
+        return Object.keys(data && data.length !== 0 ? data[0] : [])
+            .filter(key => !this.autoGenerateExclude.includes(key));
     }
 
     /**

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

@@ -116,6 +116,20 @@ describe('IgxGrid Component Tests #grid', () => {
             });
         });
 
+        it('should skip properties from autoGenerateExclude when auto-generating columns', () => {
+            const fix = TestBed.createComponent(IgxGridTestComponent);
+            fix.componentInstance.data = [
+                { Number: 1, String: '1', Boolean: true, Date: new Date(Date.now()) }
+            ];
+            fix.componentInstance.autoGenerateExclude = ['Date', 'String'];
+            fix.componentInstance.columns = [];
+            fix.componentInstance.autoGenerate = true;
+            fix.detectChanges();
+            const grid = fix.componentInstance.grid;
+
+            expect(grid.columns.map(col => col.field)).toEqual(['Number', 'Boolean'], 'Invalid columns after exclusion initialized');
+        });
+
         it('should initialize a grid and allow changing columns runtime with ngFor', () => {
             const fix = TestBed.createComponent(IgxGridTestComponent);
             fix.detectChanges();
@@ -2707,7 +2721,7 @@ describe('IgxGrid Component Tests #grid', () => {
 
 @Component({
     template: `<div style="width: 800px; height: 600px;">
-        <igx-grid #grid [data]="data" [autoGenerate]="autoGenerate" (columnInit)="columnCreated($event)">
+        <igx-grid #grid [data]="data" [autoGenerate]="autoGenerate" [autoGenerateExclude]="autoGenerateExclude" (columnInit)="columnCreated($event)">
             <igx-column *ngFor="let column of columns;" [field]="column.field" [hasSummary]="column.hasSummary"
                 [header]="column.field" [width]="column.width">
             </igx-column>
@@ -2724,6 +2738,8 @@ export class IgxGridTestComponent {
 
     public autoGenerate = false;
 
+    public autoGenerateExclude = [];
+
     public columnEventCount = 0;
 
     constructor(public cdr: ChangeDetectorRef) { }

projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.ts

@@ -369,11 +369,17 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
     public verticalRowDimScrollContainers: QueryList<IgxGridForOfDirective<any>>;
 
     /**
-     * @hidden @interal
+     * @hidden @internal
      */
     @Input()
     public addRowEmptyTemplate: TemplateRef<any>;
 
+    /**
+     * @hidden @internal
+     */
+    @Input()
+    public autoGenerateExclude: string[] = [];
+
     /**
      * @hidden @internal
      */