tanstack-router-migration
React Router to TanStack Router Migration
Migrate React applications from React Router to TanStack Router with file-based routing. This skill provides a structured approach for both incremental and clean migrations.
Critical Rules
ALWAYS:
- Use file-based routing with routes in
src/routes/directory - Use
fromparameter in all hooks for type safety (useParams({ from: '/path' })) - Validate search params with Zod schemas using
@tanstack/zod-adapter - Configure build tool plugin before creating routes
- Register router type for full TypeScript inference
- Use
fallback()wrapper for optional search params
NEVER:
More from redpanda-data/console
react-best-practices
Client-side React performance optimization patterns.
72code-standards
TypeScript, React, and JavaScript best practices enforced by Ultracite/Biome.
55security-scan
Resolve npm dependency vulnerabilities detected by security scans.
49api-patterns
Connect Query patterns for API calls. Use when working with mutations, queries, or data fetching.
48e2e-tester
Write and run Playwright E2E tests for Redpanda Console using testcontainers. Analyzes test failures, adds missing testids, and improves test stability. Use when user requests E2E tests, Playwright tests, integration tests, test failures, missing testids, or mentions 'test workflow', 'browser testing', 'end-to-end', or 'testcontainers'.
45ui-development
Build UI with Redpanda Registry components, Tailwind v4, and accessibility best practices.
44