support AgGrid for data app

[wgong]

I am an streamlit user for 2 years, heard about reflex yesterday and start learning because it looks promising due to its performance and deployment features.
Most apps I built use AgGrid (https://www.ag-grid.com/) component for data application,
will aggrid be on the roadmap?

Willing to help out with its integration as I learn more about reflex.

Thanks

[wgong]

Study the following examples

gridjs

• https://gridjs.io/docs/integrations/react
• https://github.com/reflex-dev/reflex/tree/main/reflex/components/gridjs

glide-data-grid

• https://grid.glideapps.com/
• https://github.com/reflex-dev/reflex/blob/main/reflex/components/datadisplay/dataeditor.py

ag-grid (TODO)

• https://www.ag-grid.com/react-data-grid/getting-started/,

[wgong]

https://youtu.be/_wfMhnICwsU?si=McGkPSkh0COTn1DX

[xnmp]

I tried the most basic implementation as follows:

class AgGrid(rx.Component):
    library = "ag-grid-react"
    tag = "AgGridReact"
    columnDefs: rx.Var[List[Dict[str, Any]]]
    rowData: rx.Var[List[Dict[str, Any]]]

This works if we also add the stylesheets:

app = rx.App(
    stylesheets=[
        "https://cdn.jsdelivr.net/npm/ag-grid-community/styles/ag-grid.css",
        "https://cdn.jsdelivr.net/npm/ag-grid-community/styles/ag-theme-alpine.css",
    ],
)

However, the table ends up being invisible, even though all the data is there if I go and inspect the HTML.
I suspect (although I'm a complete beginner in frontend details) that it's because Tailwind nullifies the stylesheet.
Feel like it's a short step from here to get this working.

[wgong]

Thank you @xnmp , will test it out