diff --git a/src/components/ChecksTable.jsx b/src/components/ChecksTable.jsx index 5a20c7f..bb1ecca 100644 --- a/src/components/ChecksTable.jsx +++ b/src/components/ChecksTable.jsx @@ -11,13 +11,17 @@ const ChecksTable = () => { const createDataTable = async () => { const [ DataTableCSS, + DataTableButtonsCSS, { 'default': DataTable }, { 'default': DT }, + DataTableButtons, { 'default': jQuery }, ] = await Promise.all([ import('datatables.net-dt/css/dataTables.dataTables.css'), + import('datatables.net-buttons-dt/css/buttons.dataTables.css'), import('datatables.net-react'), import('datatables.net-dt'), + import('datatables.net-buttons/js/dataTables.buttons'), import('jquery'), ]) @@ -73,10 +77,45 @@ const ChecksTable = () => { // C, Fortran, C++, AutoFix { 'targets': [3, 4, 5, 6], 'type': 'ticks' }, ], + // Filters + layout: { + topStart: { + buttons: [ + ...[ + { + 'label': 'All checks', + 'searchValue': '', + }, + { + 'label': 'Correctness', + 'searchValue': 'correctness', + }, + { + 'label': 'Modernization', + 'searchValue': 'modernization', + }, + { + 'label': 'Optimization', + 'searchValue': 'optimization', + }, + ].map(({ label, searchValue }) => ({ + 'text': label, + 'action': (event, dataTable, node, config) => { + dataTable.column(2).search(searchValue).draw(); + dataTable.buttons().enable(); + dataTable.buttons(node).disable(); + } + })), + ] + } + }, ordering: true, paging: false, searching: true, }); + + // By default, all checks are shown + dataTable.buttons([0]).disable(0); } };