Adopt shadcn as core component library #17
Conversation
There was a problem hiding this comment.
Pull request overview
This pull request adopts shadcn/ui as the core component library, integrating Radix UI primitives with a custom design system and Tailwind CSS for styling. The PR adds reusable Button and Table components following the shadcn pattern and updates existing components to use these new primitives.
Changes:
- Added shadcn/ui configuration with path aliases and design system tokens
- Implemented Button and Table components using Radix UI and class-variance-authority
- Migrated existing components (HomePage, StatusMessage, ExerciseTable, DashboardHeader) to use the new UI components
Reviewed changes
Copilot reviewed 10 out of 12 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| components.json | Configures shadcn/ui with aliases, style preferences, and icon library settings |
| tsconfig.json | Adds path alias configuration for @/* imports (duplicates tsconfig.app.json) |
| package.json | Adds dependencies: Radix UI, clsx, tailwind-merge, lucide-react, class-variance-authority, and animation libraries |
| yarn.lock | Locks versions for new dependencies including Radix UI components and utility libraries |
| src/styles/index.css | Adds comprehensive design tokens for light/dark themes and custom Tailwind variant for dark mode |
| src/lib/utils.ts | Implements cn utility function for merging Tailwind classes |
| src/components/ui/button.tsx | Creates Button component with multiple variants using Radix Slot and CVA |
| src/components/ui/table.tsx | Implements accessible Table components with forwarded refs |
| src/pages/index.tsx | Replaces native button with shadcn Button component |
| src/components/dashboard/StatusMessage.tsx | Updates to use Button component with asChild pattern for links |
| src/components/dashboard/ExerciseTable.tsx | Migrates from native table elements to shadcn Table components |
| src/components/dashboard/DashboardHeader.tsx | Replaces links and buttons with shadcn Button components |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 10 out of 12 changed files in this pull request and generated 3 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 11 out of 13 changed files in this pull request and generated 2 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Fixes #2