</>MCP Agents Market
Plugin

data-table-filters

by openstatusHQ2.2kTypeScriptUpdated 2026-09-03

Faceted filters, sorting & infinite scroll for React data tables - shadcn/ui + TanStack Table

Claude CodeCursor

The data-table-filters Claude Code plugin equips AI agents with the ability to scaffold advanced React data tables using shadcn/ui and TanStack Table. It provides a declarative schema system, faceted filtering, infinite scroll, and pluggable state management adapters (nuqs, zustand, or in-memory). Agents can automatically detect your project stack, install the necessary blocks via the shadcn registry, generate column schemas with presets for common patterns like log levels and HTTP status codes, and wire up server-side integrations with Drizzle ORM.

Key Features

Declarative table schema builder with col.* factory functions and type inference
Modular block installation system with 11 specialized blocks (core table, command palette, cell renderers, state adapters, schema system, Drizzle helpers, React Query integration, AI filter inference, MCP server)
12 pre-built cell renderers including text, code, number, bar charts, heatmaps, gauges, badges, booleans, stars, status codes, level indicators, and timestamps
Pluggable BYOS state management with adapters for nuqs (URL-based), zustand (client-side), and in-memory
AI-powered natural language filter inference and command palette with keyboard shortcuts
MCP server endpoint exposing search_docs, get_doc, list_blocks, and get_install_plan tools for agent integration
Server-side pagination and filtering helpers for Drizzle ORM with PostgreSQL support
Column presets for common data types: logLevel, httpStatus, httpMethod, duration, timestamp, traceId, pathname

Use Cases

  • 01Building filterable log viewers with client-side or server-side pagination
  • 02Creating admin dashboards with sortable, searchable data tables and row detail panels
  • 03Implementing infinite-scroll data tables with live data updates and cursor-based pagination
  • 04Scaffolding monitoring interfaces with faceted search across timestamps, status codes, and latency metrics
  • 05Rapidly prototyping data exploration UIs by pasting JSON or CSV into the interactive schema builder
  • 06Integrating shareable, URL-based filter state for bookmarkable dashboard views

Related Plugins

View more

andrej-karpathy-skills

A single CLAUDE.md file to improve Claude Code behavior, derived from Andrej Karpathy's observations on LLM coding pitfalls.

Plugin216.2k

claude-mem

Persistent Context Across Sessions for Every Agent – Captures everything your agent does during sessions, compresses it with AI, and injects relevant context back into future sessions. Works with Claude Code, OpenClaw, Codex, Gemini, Hermes, Copilot, OpenCode + More

Plugin95.1k

Understand-Anything

Graphs that teach > graphs that impress. Turn any code into an interactive knowledge graph you can explore, search, and ask questions about. Works with Claude Code, Codex, Cursor, Copilot, Gemini CLI, and more.

Plugin85k

rtk

CLI proxy that reduces LLM token consumption by 60-90% on common dev commands. Single Rust binary, zero dependencies

Plugin82.2k

data-table-filters — FAQ

What is the data-table-filters Claude Code plugin?+

It's a Claude Code plugin and MCP server that enables AI agents to scaffold React data tables with faceted filters, sorting, and infinite scroll using shadcn/ui and TanStack Table. The agent detects your stack, installs the appropriate blocks via the shadcn registry, and generates the necessary schema and component code.

How do I install the data-table-filters plugin in Claude Code?+

Run '/plugin marketplace add openstatushq/data-table-filters' followed by '/plugin install data-table-filters@openstatus' in Claude Code. Alternatively, install it as a skill with 'npx skills add https://github.com/openstatushq/data-table-filters --skill data-table-filters' for agents supporting the skills CLI.

Which AI clients work with data-table-filters?+

Claude Code is the primary client for the plugin. Any MCP-compatible client can use the MCP server at https://data-table.openstatus.dev/api/mcp. Cursor users can copy the .cursor/rules/data-table-filters.mdc file into their project for agent integration.

Does data-table-filters require API keys or environment variables?+

No API keys are required for the core functionality and default examples. Only the Drizzle ORM example requires setting DATABASE_URL to a PostgreSQL connection string for server-side data integration.

Is data-table-filters free to use?+

Yes, data-table-filters is an open-source project available on GitHub. All blocks, presets, and agent integration features can be installed and used without licensing fees.

What blocks are available in data-table-filters?+

The system offers 11 modular blocks: the core data-table engine with 4 filter types, a command palette with AI-powered filter inference, 12 specialized cell renderers, row detail sheets, nuqs and zustand state adapters, a declarative schema system, Drizzle ORM helpers, React Query integration, and an MCP server endpoint.

How do I install data-table-filters?+

Open the source repository on GitHub and follow its README. data-table-filters is a plugin — MCP Agents Market links you directly to the official repo.

Is data-table-filters free?+

data-table-filters is an open-source project hosted on GitHub. Check the repository for its license and any usage requirements.

Related searches

Developer Tools PluginsDatabases PluginsBest MCP ServersBest SkillsBest AgentsTop rated listingsClaude Code toolsBrowse all categories