ag-grid-angular grouping is not working after page refresh

I am using ag-grid-angular (26.1.0) in my angular application. I have implemented grouping in my app which works fine without page load. But once I refresh the page, It went fail. I investigated that the "getDataPath" doesn't called after refresh.

Here is my html code snippet-

<ag-grid-angular #agGrid style="width: 100%; height: calc(100vh - 12rem)" id="myGrid" class="ag-theme-alpine" [rowData]="rowData" [columnDefs]="columnDefs" [treeData]="true" [animateRows]="true" [defaultColDef]="defaultColDef" [autoGroupColumnDef]="autoGroupColumnDef" [groupDefaultExpanded]="groupDefaultExpanded" [getDataPath]="getDataPath" (gridReady)="onGridReady($event)" (rowDataChanged)="onRowDataChanged()" rowSelection="single" [suppressDragLeaveHidesColumns]="true" [enableBrowserTooltips]="true"></ag-grid-angular>

Typescript-

this.getDataPath = function (data: any) { return data.orgHierachy; };

Seeking for help to fix this issue please..

Thanks in advance.

Expected output

After refresh-

First column gone

I have resolved my issue by adding LicenseManager in the module. I was missing the LicenseManager in my Module file. So, what I did-

import { LicenseManager } from 'ag-grid-enterprise';
LicenseManager.setLicenseKey(environment.AG_GRID_LICENSE);

Added this in the appropriate module.ts and it started working fine.

Regards,