react-table
React Table Implementation
This project uses @tanstack/react-table v8 and renders with the project’s Table primitives in @/modules/common/components/ui/table (shadcn-based).
Architecture overview
| Layer | Location | Responsibility |
|---|---|---|
| Column config | constants/*TableConfig.tsx |
ColumnDef<T>[]: header, accessor, cell, filterFn, size, etc. |
| Container | containers/*Container.tsx |
useReactTable, data source, optional virtual/selection/filter |
| Common component | common/components/ui/data-table.tsx |
Simple tables can use <DataTable columns={} data={} /> |
| Table UI | common/components/ui/table |
Table, TableHeader, TableBody, TableRow / SelectableTableRow, TableHead, TableCell |
1. Column configuration
More from tianyili/skills
react-architect-skills
React and TanStack Router folder structure and feature-module architecture. Use when writing, reviewing, or refactoring React code for structure, naming, colocation, encapsulation, and layer separation. Triggers on React folder structure, naming rules, module boundaries, or architecture decisions.
37vercel-react-only-best-practices
React performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React code to ensure optimal performance patterns. Triggers on tasks involving React components, data fetching, bundle optimization, or performance improvements.
22reduce-optional-params
Use when designing or refactoring functions with many optional params, configurable components, or when the user mentions optional params, function signatures, or API simplification. Reduces optional parameters in functions and components for cleaner APIs.
10skill-creator
Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized knowledge, workflows, or tool integrations.
5zustand
Use and structure Zustand stores for React and vanilla JS state management. Use when the user mentions Zustand, needs a store pattern, global state, persist state, or migrating from Redux/Context.
4skill-judge
Evaluate Agent Skill design quality against official specifications and best practices. Use when reviewing, auditing, or improving SKILL.md files and skill packages. Provides multi-dimensional scoring and actionable improvement suggestions.
1