vue-components
Vue 3 Component Architecture
Project Structure
src/
├── components/
│ ├── common/ # Shared components (BaseCard, ColorPicker, Toast)
│ └── [module-name]/ # Feature modules (cards + admin components)
├── composables/ # Reusable Vue composition functions
├── services/ # API services and utilities
└── types/ # TypeScript definitions
BaseCard Pattern
All dashboard cards extend BaseCard for consistency:
More from bwl21/bwl-flyer-generator
git-conventions
Apply when committing code, creating branches, or preparing pull requests. Covers conventional commit format, branch naming, co-author attribution, and pre-commit checklist.
12common-pitfalls
Apply when debugging errors, reviewing code for issues, or encountering unexpected behavior. Contains known mistakes with ChurchTools API, Vue components, TypeScript, Safari cookies, and form handling.
8churchtools-api
Apply when making API calls to ChurchTools, using churchtoolsClient methods, handling API responses, or working with Tags API. Covers correct HTTP method names, parameter structure, and response handling patterns.
8development-workflow
Apply when setting up the development environment, running dev server, building, testing, or deploying the extension. Covers npm commands, CORS configuration, debugging, and deployment to ChurchTools.
7