Add a Custom ColumnMenu Date Filter to the TreeList

Environment

Description

How can I create a custom date range filter as a 'From' and 'To' filter?

Solution

A custom column menu should be created through which we set the filterContent property to the custom filter we want to create. In the custom filter we render a DatePicker, whose onChange event calls the onColumnMenuFilterChange event, which sets the state of the filter and updates the TreeList accordingly. We set the default operators through the initialFilter property to match those of the filter we want to create, in this case greater than and equal to ("gte") and less than and equal to ("lte").