Ag Grid – Clicking on Row Removes agSetColumnFilter Filter

I am running into an issue with ag grid related to the agSetColumnFilter filter in a React application. If you set the agSetColumnFilter filter, then click on the row in the filtered table, the agSetColumnFilter filter resets and all the rows return. There is an onCellClicked method that seems to be causing this behavior, but all it does is update React state (which we need to occur without the filter being modified). I have broken the code down to its simplest components and I am not sure why this behavior is occurring. I have tried adding

apply: true, 
newRowsAction: "keep", 

to the affected filter but that has not changed the behavior occurring.

I have also tried adding the flag “deltaRowDataMode=true” to the table itself and that has also not solved the issue.

Here is the relevant code:

import React, { useState, useEffect } from "react";
import { AgGridReact } from "ag-grid-react";
import "ag-grid-enterprise";

import data from "./data.js";
import filters from "./filters.js";
import "./table.scss";

const Table = () => {
  const [drawerOpen, setDrawerOpen] = useState(false);

  const columns = [
    {
      headerClass:
        "base__name-header-cell table__name-header-cell",
      headerName: "Name",
      field: "name",
      cellClass: () => "base__name-cell table__name-cell",
      pinned: "left",
      sort: "asc",
      suppressFloatingFilterButton: true,
      floatingFilterComponentParams: {
        className: "table__name-search-filter",
        option: "contains",
      },
      filter: "agTextColumnFilter",
      minWidth: 270,
      exportable: true,
    },
    // The following filter is the one that is affected by this:
    {
      headerName: "Type",
      cellClass: "type-cell",
      field: "type",
      filter: "agSetColumnFilter",
      filterParams: {
        values: filters.types,
        suppressAndOrCondition: true,
        defaultToNothingSelected: true,
        apply: true,
        newRowsAction: "keep",
      },
      suppressFloatingFilterButton: true,
      filterValueGetter: (params) => {
        let types = [...params.data.types];
        return types;
      },
      minWidth: 160,
      maxWidth: 200,
      exportable: true,
    },
  ];

  const openDrawer = () => {
    setDrawerOpen(true);
  };

  const onCellClicked = () => {
    openDrawer();
  };

  const defaultColDef = {
    suppressHeaderMenuButton: true,
    sortable: true,
    filter: true,
    floatingFilter: true,
    sortingOrder: ["desc", "asc", null],
    headerCheckboxSelectionFilteredOnly: true,
    filterParams: { newRowsAction: "keep" },
  };

  return (
    <div className="ag-theme-alpine-dark base table js-table">
      <div>
        <AgGridReact
          deltaRowDataMode={true}
          columnDefs={columns}
          defaultColDef={defaultColDef}
          domLayout="autoHeight"
          onCellClicked={onCellClicked}
          paginationPageSize={50}
          rowData={data}
          rowHeight={40}
          rowSelection="multiple"
          suppressRowClickSelection
          autoSizeStrategy={{ type: "fitCellContents" }}
          getRowId={(params) => params.data.assessmentId}
        />
      </div>
    </div>
  );
};

export default Table;

I feel as though there has to be a simple solution to this as I don’t believe simply clicking on a row and having it reset a filter would be the default behavior. Note that this is also not the only table we have with this affected behavior, there are more tables with more complex logic also having this same issue, but I hope solving it here will also apply elsewhere. Also note that this only affects the agSetColumnFilter filter, all other filters do not appear to be affected by this. Please advise if I am missing some type of configuration for this ag-grid table.