Ag grid Master Detail model in Angular 15 -Trying to extend the master grid filter for the detail grid

Question

I have written a custom logic for filtering the detail grid using the master filter only. Filter is working I could see in the console logs and there are no errors but after filtering the detail grid no data is displayed in the table.

Here is my code -

onFilterChanged(event: any): void {
    if (!this.gridApi) {
        console.error("Grid API is not initialized");
        return;
     }

     const filterModel = this.gridApi.getFilterModel();
   
if (!this.rowData || this.rowData.length === 0) {
  console.log("Row data is empty, skipping filtering.");
  return;
}

this.filteredRowData = this.rowData
  .map((masterRow) => {
    console.log("Processing master row:", masterRow);

    let matchesMaster = true;
    let filteredDetailRows = [];

    for (const [field, model] of Object.entries(filterModel)) {
      if (!model || !model.filter) {
        console.log("Skipping invalid or empty filter for field:", field);
        continue;
      }

      const filterValue =
        model.filter !== null && model.filter !== undefined
          ? model.filter.toString().toLowerCase()
          : "";
      console.log("Filter value for field:", field, "is:", filterValue);

      // Check master row fields
      if (field in masterRow) {
        const masterFieldValue = masterRow[field]?.toString().toLowerCase();
        matchesMaster =
          matchesMaster && masterFieldValue?.includes(filterValue);
      }

      // Check detail rows and filter them
      if (field in (masterRow.inputTsList[0] || {})) {
        filteredDetailRows = masterRow.inputTsList.filter((detailRow) => {
          const detailFieldValue = detailRow[field]
            ?.toString()
            .toLowerCase();
          return detailFieldValue?.includes(filterValue);
        });
      }
    }

    const hasMatchingDetails = filteredDetailRows.length > 0;
    console.log(
      "Master row matches:",
      matchesMaster,
      "| Detail rows match:",
      hasMatchingDetails
    );

    if (matchesMaster || hasMatchingDetails) {
      return {
        ...masterRow,
        inputTsList: hasMatchingDetails
          ? filteredDetailRows
          : masterRow.inputTsList,
      };
    }
    return null;
  })
  .filter((row) => row !== null); // Remove null rows where neither master nor detail matches

// Update the grid with the filtered data
this.filteredRowData.forEach((row, index) => {
  const rowId = String(row.tsId);
  console.log(`Row ${index} ID:`, rowId);
});

this.gridApi.setRowData(this.filteredRowData as outputTs[]);
console.log(
  "Row data currently in the grid:",
  this.gridApi.getDisplayedRowAtIndex(0)
);
console.log("Displayed Row Count:", this.gridApi.getDisplayedRowCount());
console.log("Grid API row :", this.gridApi.getDisplayedRowAtIndex(0));

this.gridApi.forEachNode((node) => {
  if (
    node.data &&
    node.data.inputTsList &&
    node.data.inputTsList.length > 0
  ) {
    node.setExpanded(true);
  } else {
    node.setExpanded(false);
  }
});

}

console log : Row data currently in the grid: undefined Displayed Row Count: 0