Filtering in DCB Admin data grids

The current working status of the filter options is documented in: DCB Admin filter testing

Options for filtering sets of data in DCB Admin

Problem: the MUI data grid component in use in DCB Admin does not support filtering on multiple fields, only single fields.

Decision: 19/12/23 - support for multiple filters is not needed for the first production Mobius release of DCB Admin. The default filtering tool available in the MUI data grid will be used as-is.

Some use cases for filtering are documented in Admin use cases for DCB.

This document is a record of things learnt up to 19/12/23, it is not an in depth assessment of all the options available for filtering.

Option A: Use the MUI data grid paid version

The paid for version of the data grid support multiple filters in two ways:

1. Extension of the popover filter builder

2. Form controls at the top of each column

The UX of the filter builder which is built into both the free version of the MUI data grid component has poor UX. This ticket outlines some of the issues: https://openlibraryfoundation.atlassian.net/browse/DCB-391  

Using the popover filter builder is not desirable given the inherently poor UX. However, this brings some advantages over option 2. Such as the ability to AND or OR filters and to filter on data which is not visible. Note that all filters are forced to use the same Boolean choice. 

With option 2, form controls on each column, it is clearer to the user which filters are applied at any one time. However, it also has some poor UX and filtering is limited to the columns displayed in the data grid.  

Option B: Extend the free MUI data grid to our own design 

If sticking with the current MUI data grid the preferred approach would be to design bespoke filtering tools based on a comprehensive analysis of user requirements.

Option C: Switch to another data grid component

Another option is to switch out the MUI data grid to another component such as Material React Table which has better filtering options. 

Switching this out for the MUI data grid would impact every grid in the app. The impact of a complete change over on other data grid features would need assessing, e.g. pagination and the option to export.