utils/custom_grid.py

import pandas as pd
import solara
from ipyaggrid import Grid


@solara.component
def AgGrid(df: pd.DataFrame, **kwargs):

    grid_options = {
        "columnDefs": [{"headerName": col, "field": col} for col in df.columns],
        # "enableSorting": True,
        # "enableFilter": True,
        # "editable": True,
        # "resizable": True,
        # "sortable": True,
    }

    def update_data():
        widget = solara.get_widget(el)
        widget.grid_options = grid_options
        widget.update_grid_data(df.to_dict("records"))

    el = Grid.element(
        grid_data=df.to_dict("records"),
        grid_options=grid_options,
        quick_filter=True,
        theme="ag-theme-balham",
        columns_fit="auto",
        index=False,
        keep_multiindex=False,
        **kwargs,
    )

    solara.use_effect(update_data, [df])


@solara.component
def Page():
    df = solara.use_reactive(
        pd.DataFrame(
            {
                "Nom": ["Alice", "Bob", "Charlie"],
                "Âge": [25, 30, 35],
                "Ville": ["Paris", "Lyon", "Marseille"],
            }
        )
    )

    AgGrid(
        df=df.value,
    )