State Persistance, add `clearGrouping` event to igxGrid and igxTreeGrid

[luiscla27]

Is your feature request related to a problem?

I'm implementing state persistence, how ever I want to trigger it when the user deletes a group expression. Specifically when it clicks here:

Describe the solution you'd like

I would want to be able to subscribe to an event that gets triggered every time the user clicks the remove chip action. Something similar to this:

<igx-grid ... (groupByRemoved)="saveGridState()">...</igx-grid>
<igx-tree-grid ... (groupByRemoved)="saveGridState()">...</igx-tree-grid>

Describe alternatives you've considered

I'm not sure if there's already an event that fulfils my requirement, currently I managed to solve the issue by "listening" to your internal api like this:

AspectUtil.advice().after(this.myIgxTreeGrid.groupArea, 'clearGrouping', (_name?: string) => {
  this.saveGridState();
});

Also, It seems there's a missing interface for groupArea, currently is any and I think it should be IgxGridGroupByAreaComponent or IgxGroupByAreaDirective

[onlyexeption]

Hello, @luiscla27

There would be no need to add such an event, as you currently can subscribe to every grouping expression change in both Igx and IgxTree Grids. To achieve this in a regular grid, you would need to subscribe to groupingExpressionsChange like so:

<igx-grid ... (groupingExpressionsChange)="handlGroupingExpressionsChange($event)">...</igx-grid>

As for the IgxTreeGrid, you can use the IgxTreeGridGroupByAreaComponent inside it. It is used to handle all the UI interactions related to the columns that are used for the grouping.

<igx-tree-grid #tGrid ...>
 ...
    <igx-tree-grid-group-by-area
              #groupArea
              [grid]='tGrid'
              [expressions]='groupingExpressions'
              (expressionsChange)="handleExpressionsChange($event)"
    >
</igx-tree-grid>

You can read more about it in the Angular Tree Grid Group By topic.