Implement DataTable with nuqs and zod filters#47
Closed
codegen-sh[bot] wants to merge 22 commits into
Closed
Conversation
LC-177: Migrate LambdaCurry/forms to latest React Router and React version
…uter; adjust Storybook configurations accordingly
…er for improved alignment with labels
…zation and PR previews - Added `noNamespaceImport` option to `biome.json` for better TypeScript handling. - Enhanced README with detailed instructions for PR previews and GitHub environment setup. - Updated `yarn.lock` to reflect dependency changes, including `react-day-picker` and `remix-hook-form`. - Introduced new GitHub Actions workflow for automatic PR previews. - Added custom components documentation for form elements, ensuring type safety and flexibility. - Refactored checkbox and radio group components to support custom component injection.
…r integration - Upgraded from version 18 to 19 in and . - Replaced with in multiple story files to support React Router. - Adjusted import paths for components in CSS and story files for consistency. - Enhanced checkbox and radio group components with additional data attributes for better accessibility.
…tack types, improving code clarity and consistency. Clean up JSX formatting for better readability across data table files.
…omponents and cmdk package. Refactor form components for improved readability and consistency, including type imports for React. Enhance DataTableRouterForm with auto-submit functionality on filter changes.
…sed submitHandlers and update route path. Delete unused data table story files for improved project clarity.
|
|
|
Important Review skippedBot user detected. To trigger a single review, invoke the You can disable this status message by setting the Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This PR implements a new DataTable component that uses nuqs for URL state management and zod for schema validation. The implementation includes:
Features
Components
DataTableNuqsForm: Main component that uses nuqs for URL state managementDataTableNuqsToolbar: Toolbar component for the nuqs data tableDataTableNuqsFilter: Filter component for select filtersDataTableTextFilter: Filter component for text filtersDataTableNumberFilter: Filter component for number range filtersDataTableDateFilter: Filter component for date range filtersDataTableFilterFactory: Factory component to select the appropriate filter typedata-table-schemas.ts: Zod schemas for filter validationExample
Added a story example in
apps/docs/src/ui/data-table-nuqs-form.stories.tsxthat demonstrates how to use the new components.Dependencies
This implementation provides a more robust and type-safe way to handle data table filtering and state management compared to the previous React Router Form approach.