tanstack-react-table-with-tanstack-query

This skill builds on @tanstack/table-core#client-vs-server, getting-started, and table-state. Query owns fetching/cache; Table owns grid state and receives rows already processed by every manual server stage.

Setup

import { keepPreviousData, useQuery } from '@tanstack/react-query'
import { useCreateAtom, useSelector } from '@tanstack/react-store'
import {
  rowPaginationFeature,
  tableFeatures,
  useTable,
} from '@tanstack/react-table'
import type { PaginationState } from '@tanstack/react-table'

const features = tableFeatures({ rowPaginationFeature })
const emptyRows: Array<{ id: string }> = []