diff --git a/AGENTS.md b/AGENTS.md index f582952..e76e5df 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -81,6 +81,7 @@ The command outputs instructions for setting the required environment variable t - **Naming**: PascalCase for components, camelCase for variables/functions - **Types**: Use `import type` for type-only imports, define interfaces/types - **Styling**: Tailwind CSS with `clsx` utility for conditional classes +- **UI Components**: shadcn/ui components for consistent design system - **Icons**: lucide-react with consistent naming - **Data fetching**: @tanstack/react-query with proper error handling - **Components**: Functional components with hooks, proper TypeScript typing @@ -94,7 +95,7 @@ The command outputs instructions for setting the required environment variable t - **Routes**: `frontend/src/routes/` - TanStack Router file-based routing ### Key Components Location -- **UI Components**: `frontend/src/components/ui/` - Reusable UI primitives +- **UI Components**: `frontend/src/components/ui/` - shadcn/ui components and reusable UI primitives - **Feature Components**: `frontend/src/components/` - Main app components - **Pages**: `frontend/src/routes/` - Route components (index.tsx, transactions.tsx, etc.) - **Hooks**: `frontend/src/hooks/` - Custom React hooks @@ -121,6 +122,16 @@ The command outputs instructions for setting the required environment variable t - Avoid including specific numbers, counts, or data-dependent information that may become outdated - **Security**: Never log sensitive data, use environment variables for secrets +## AI Development Support + +### shadcn/ui Integration +This project uses shadcn/ui for consistent UI components. The MCP server is configured for AI agents to: +- Search and browse available shadcn/ui components +- View component implementation details and examples +- Generate proper installation commands for new components + +Use the shadcn MCP tools when working with UI components to ensure consistency with the existing design system. + ## Contributing Guidelines This repository follows conventional changelog practices. Refer to `CONTRIBUTING.md` for detailed contribution guidelines including: diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 8a64526..38ae714 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,9 +1,19 @@ # Contributing -Install Poetry and run `poetry install` to install dependencies. Then run `poetry shell` to activate the virtual environment. +This project uses **uv** for Python dependency management and **shadcn/ui** for frontend components. + +## Setup +Install uv and run `uv sync` to install dependencies. Run `pre-commit install` to install the pre-commit hooks. +## Frontend Development +The frontend uses shadcn/ui components for consistent design. When adding new UI components: +- Check if a shadcn/ui component exists for your use case +- Follow the existing component patterns in `frontend/src/components/ui/` +- Use Tailwind CSS classes for styling +- Ensure components are accessible and follow the design system + ## Commit messages type(scope/[subscope]): Title starting with uppercase and sentence ending with period. diff --git a/README.md b/README.md index b087dcb..9c10a60 100644 --- a/README.md +++ b/README.md @@ -20,6 +20,7 @@ Having your bank data accessible through both CLI and REST API gives you the pow - [React](https://reactjs.org/): Modern web interface with TypeScript - [Vite](https://vitejs.dev/): Fast build tool and development server - [Tailwind CSS](https://tailwindcss.com/): Utility-first CSS framework + - [shadcn/ui](https://ui.shadcn.com/): Modern component system built on Radix UI - [TanStack Query](https://tanstack.com/query): Powerful data synchronization for React ## ✨ Features