Function: DataTable()

DataTable(props): Element

Production-ready data table with automatic data fetching and state management

Features:

• Automatic column generation from data structure
• Integrated with useAnalyticsQuery for data fetching
• Built-in loading, error, and empty states
• Dynamic filtering, sorting and pagination
• Column visibility controls
• Responsive design
• Supports opinionated mode (auto columns) and full-control mode (children(table))

Parameters

props

DataTableProps

Props for the DataTable component

Returns

Element

• The rendered data table component

Examples

// Opinionated mode
<DataTable
 queryKey="users-list"
 parameters={{ status: "active" }}
 filterColumn="email"
 filterPlaceholder="Filter by email..."
/>

// full control mode
<DataTable queryKey="users-list" parameters={{ status: "active" }}>
  {(table) => (
    <div>
      <h2>Custom Table UI</h2>
      {table.getRowModel().rows.map(row => (
        <div key={row.id}>{row.original.name}</div>
      ))}
    </div>
  )}
</DataTable>