Grid freezes after interacting with agSetColumnFilter and trying to switch pages

[qianjixin]

Using a multi-page Dash app, after interacting with an agSetColumnFilter (deselecting, selecting options) I try to switch pages but the page freezes and CPU usage goes to ~100%. I have also noticed this with agMultiColumnFilter. Downgrading AG Grid packages to v28 seems to alleviate this specific issue. This is possible due to some filter changes in v29. Simple example:

from dash import Dash, html, dcc, callback
import dash
import dash_ag_grid as dag # dash-ag-grid==2.0.0a5
import pandas as pd

app = Dash(__name__, use_pages=True , pages_folder="")

# Import data
df = pd.read_csv("https://raw.githubusercontent.com/plotly/datasets/master/ag-grid/olympic-winners.csv")
df_solar = pd.read_csv("https://raw.githubusercontent.com/plotly/datasets/master/solar.csv")

# Home
home_layout = dag.AgGrid(
    id='home-grid',
    enableEnterpriseModules=True,
    rowData=df.to_dict('records'),
    columnDefs=[
        {
            'field': 'athlete',
            'filter': 'agSetColumnFilter',
            'floatingFilter': True
        },
        {
            'field': 'age',
        }
    ]
)
other_layout = dag.AgGrid(
    id='other-grid',
    enableEnterpriseModules=True,
    rowData=df_solar.to_dict('records'),
    columnDefs=[
        {
            'field': 'State',
            'filter': 'agSetColumnFilter',
            'floatingFilter': True
        },
        {
            'field': 'Number of Solar Plants',
        }
    ]
)

# Register pages
dash.register_page("home",  path='/', layout=home_layout)
dash.register_page("other", layout=other_layout)

# App layout
app.layout = html.Div([
    html.Div(
        [
            html.Div(
                dcc.Link(
                    f"{page['name']} - {page['path']}", href=page["relative_path"]
                )
            )
            for page in dash.page_registry.values()
        ]
    ),
    dash.page_container,
])

if __name__ == '__main__':
    app.run_server(debug=True, port=8060)

[BSd3v]

This could be related to the issue in my post about the column state acting oddly when swapping between layouts with grids.

Seems like it could be trying to apply the filter to a non-existent column.

Thanks for bringing this up.

When you say, downgrading, what do you mean? Which version of dag?

[qianjixin]

Hi, this is using dash-ag-grid==2.0.0a5, as installed via pip (also happens when I build the component from source). By downgrading I mean, I edited the 3 AG Grid dependencies in package.json to look like:

"ag-grid-community": "^28.0.0",
"ag-grid-enterprise": "^28.0.0",
"ag-grid-react": "^28.0.0",

[BSd3v]

What about bumping up to the latest version? I believe we are a minor release behind.

[qianjixin]

I tried out the latest 29.2.0 packages and the issue is still there. Looks like it's triggered by v29 Column Set Filter Improvements. I'll keep testing to try and get more details.

[AnnMarieW]

Just one more piece of data - This example app fails in 2.0.0a3, but works fine in a1 and a2.

In a3 we upgraded from 29.0.0 to 29.0.1.

[StephenCooper]

I tried out the latest 29.2.0 packages and the issue is still there. Looks like it's triggered by v29 Column Set Filter Improvements. I'll keep testing to try and get more details.

We believe that this issue was fixed in AG Version 29.2 after being introduced in v29.1.

[BSd3v]

Thanks @StephenCooper 🎉

Seems to be working after bumping to 29.2, this should be available in the next release.

Please reopen if you continue to have issues.