[AAE-7817] Show hide columns on datatable (#7580)

* [AAE-7817]  Show hide columns for data-table

* Update

* update tests and uses material harness

* added pipes test

* update

* update

* added tests for datatable

* update

* Added documentation

* Fix for drop column header

* lint fix

* fix lint

lib/core/datatable/data/data-column.model.ts

@@ -46,4 +46,5 @@ export interface DataColumn {
     sortingKey?: string;
     header?: TemplateRef<any>;
     draggable?: boolean;
+    isHidden?: boolean;
 }

lib/core/datatable/data/data-table.schema.ts

@@ -38,6 +38,9 @@ export abstract class DataTableSchema {
     protected columnsOrder: string[] | undefined;
     protected columnsOrderedByKey: string = 'id';
 
+    protected hiddenColumns: string[] | undefined;
+    protected hiddenColumnsKey: string = 'id';
+
     private layoutPresets = {};
 
     private columnsSchemaSubject$ = new ReplaySubject<boolean>();
@@ -59,7 +62,8 @@ export abstract class DataTableSchema {
     }
 
     public createColumns(): void {
-        const columns = this.mergeJsonAndHtmlSchema();
+        const allColumns = this.mergeJsonAndHtmlSchema();
+        const columns = this.setHiddenColumns(allColumns);
         this.columns = this.sortColumnsByKey(columns);
     }
 
@@ -127,4 +131,19 @@ export abstract class DataTableSchema {
 
         return [...columnsWithProperOrder, ...defaultColumns];
     }
+
+    private setHiddenColumns(columns: DataColumn[]): DataColumn[] {
+        if (this.hiddenColumns) {
+            return columns.map(column => {
+                const columnShouldBeHidden = this.hiddenColumns.includes(column[this.hiddenColumnsKey]);
+
+                return {
+                    ...column,
+                    isHidden: columnShouldBeHidden
+                };
+            });
+        }
+
+        return columns;
+    }
 }

lib/core/datatable/data/object-datacolumn.model.ts

@@ -34,6 +34,7 @@ export class ObjectDataColumn implements DataColumn {
     sortingKey?: string;
     header?: TemplateRef<any>;
     draggable: boolean;
+    isHidden: boolean;
 
     constructor(input: any) {
         this.id = input.id ?? '';
@@ -50,5 +51,6 @@ export class ObjectDataColumn implements DataColumn {
         this.sortingKey = input.sortingKey;
         this.header = input.header;
         this.draggable = input.draggable ?? false;
+        this.isHidden = input.isHidden ?? false;
     }
 }