allowing more functions

src/lib/utils/propCategories.js

@@ -161,6 +161,7 @@ export const GRID_NESTED_FUNCTIONS = {
  **/
 export const COLUMN_MAYBE_FUNCTIONS_NO_PARAMS = {
     cellEditor: 1,
+    filter: 1,
 
     // Columns: Sort
     comparator: 1,

tests/assets/dashAgGridFunctions.js

@@ -171,4 +171,52 @@ function monthToComparableNumber(date) {
   const monthNumber = parseInt(date.split('/')[1]);
   const dayNumber = parseInt(date.split('/')[0]);
   return yearNumber * 10000 + monthNumber * 100 + dayNumber;
-}
+}
+
+const {useImperativeHandle, useState, useEffect, forwardRef} = React;
+
+dagfuncs.YearFilter = forwardRef((props, ref) => {
+   const [year, setYear] = useState('All');
+
+   useImperativeHandle(ref, () => {
+       return {
+           doesFilterPass(params) {
+               return params.data.year >= 2010;
+           },
+
+           isFilterActive() {
+               return year === '2010'
+           },
+
+           // this example isn't using getModel() and setModel(),
+           // so safe to just leave these empty. don't do this in your code!!!
+           getModel() {
+           },
+
+           setModel() {
+           }
+       }
+   });
+
+   useEffect(() => {
+       props.filterChangedCallback()
+   }, [year]);
+
+    setProps = (props) => {
+        if (props.value) {
+            setYear(props.value)
+        }
+    }
+
+    return React.createElement(
+        window.dash_core_components.RadioItems,
+        {
+            options:[
+                {'label': 'All', 'value': 'All'},
+                {'label': 'Since 2010', 'value': '2010'},
+            ],
+            value: year,
+            setProps
+        }
+        )
+});

tests/test_custom_filter.py

@@ -65,3 +65,62 @@ def test_fi002_custom_filter(dash_duo):
     grid.set_filter(2, "e")
     grid.wait_for_cell_text(0, 1, "11-Sault-au-Récollet")
     grid.wait_for_rendered_rows(8)
+
+def test_fi003_custom_filter(dash_duo):
+    app = Dash(__name__)
+
+    df = pd.read_json('https://www.ag-grid.com/example-assets/olympic-winners.json', convert_dates=False)
+
+    rowData = df.to_dict('records')
+
+    columnDefs = [
+        {'field': 'age', 'filter': 'agNumberColumnFilter'},
+        {'field': 'country', 'minWidth': 150},
+        {'field': 'year', 'filter': {'function': 'YearFilter'}},
+        {
+            'field': 'date',
+            'minWidth': 130,
+            'filter': 'agDateColumnFilter',
+        },
+        {'field': 'sport'},
+        {'field': 'gold', 'filter': 'agNumberColumnFilter'},
+        {'field': 'silver', 'filter': 'agNumberColumnFilter'},
+        {'field': 'bronze', 'filter': 'agNumberColumnFilter'},
+        {'field': 'total', 'filter': 'agNumberColumnFilter'},
+    ]
+
+    defaultColDef = {
+        'editable': True,
+        'sortable': True,
+        'flex': 1,
+        'minWidth': 100,
+        'filter': True,
+        'resizable': True,
+    }
+
+    app.layout = html.Div(
+        [
+            dag.AgGrid(
+                id="grid",
+                columnDefs=columnDefs,
+                rowData=rowData,
+                defaultColDef=defaultColDef
+            ),
+        ]
+    )
+
+    dash_duo.start_server(app)
+
+    grid = utils.Grid(dash_duo, "grid")
+
+    grid.wait_for_cell_text(0, 0, "23")
+
+    dash_duo.find_element('.ag-header-cell[aria-colindex="3"] .ag-icon-menu').click()
+
+    dash_duo.find_element('.ag-filter label:nth-child(2)').click()
+
+    grid.wait_for_cell_text(0, 0, "27")
+
+    dash_duo.find_element('.ag-filter label:nth-child(1)').click()
+
+    grid.wait_for_cell_text(0, 0, "23")