Apply globalFilter across eligible columns with globalFilteringFeature, columnFilteringFeature, filteredRowModel, globalFilterFn, and manual server filtering. Load when columns unexpectedly participate or a global filter changes state without changing rows.
71
88%
Does it follow best practices?
Run evals on this skill
Adds up to 20 points to the overall score
View guide
Passed
No findings from the security scan
This skill builds on core, table-features, client-vs-server, and column-filtering. Global filtering reuses the column-filtering pipeline.
import {
columnFilteringFeature,
createFilteredRowModel,
filterFn_includesString,
globalFilteringFeature,
tableFeatures,
} from '@tanstack/table-core'
export const features = tableFeatures({
columnFilteringFeature,
globalFilteringFeature,
filteredRowModel: createFilteredRowModel(),
filterFns: { includesString: filterFn_includesString },
})const options = {
globalFilterFn: 'includesString' as const,
getColumnCanGlobalFilter: (column) => column.id !== 'actions',
}Declare eligibility when product rules differ from default primitive-value detection.
Wrong: tableFeatures({ globalFilteringFeature })
Correct: tableFeatures({ columnFilteringFeature, globalFilteringFeature, filteredRowModel: createFilteredRowModel() })
Global filtering depends on column filtering and needs the filtered model for client processing.
Source: packages/table-core/src/types/TableFeatures.ts#FeatureSlotPrereqs
Wrong: const options = { globalFilterFn: 'includesString' }
Correct: const options = { getColumnCanGlobalFilter: column => column.id !== 'actions' }
Default eligibility uses the first core row and accepts string or number values.
Source: packages/table-core/src/features/global-filtering/globalFilteringFeature.ts
Wrong: table.setGlobalFilter(search); const options = { manualFiltering: true }
Correct: const page = await fetchRows({ search }); const options = { data: page.rows, manualFiltering: true }
Manual filtering bypasses the client model, so the value must drive the server request.
Source: docs/framework/react/guide/global-filtering.md#manual-server-side-global-filtering
Inspect node_modules/@tanstack/table-core/dist/features/global-filtering/ plus dist/features/column-filtering/ for shared state and filter functions.
9e523bc
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.