122 lines
5.8 KiB
Markdown
122 lines
5.8 KiB
Markdown
# Agents Rules
|
|
|
|
## Project Overview
|
|
|
|
TrainUs is a fitness tracking progressive web application built with:
|
|
|
|
- **Frontend**: Vue 3 (Composition API) + Vue Router
|
|
- **Database**: SQLite WASM (client-side, in-browser)
|
|
- **Build tool**: Vite 7
|
|
- **Styling**: Custom CSS + Bootstrap Icons
|
|
- **i18n**: i18next + i18next-vue (English, French & Danish)
|
|
- **Tests**: Playwright (Python) with pytest
|
|
- **Formatting**: Prettier
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
src/ # All application source code
|
|
components/ # Reusable Vue components
|
|
composables/ # Vue composables (shared logic)
|
|
db/ # SQLite WASM database layer
|
|
i18n/ # Internationalization config and translations
|
|
router/ # Vue Router configuration
|
|
styles/ # CSS styles
|
|
utils/ # Utility functions
|
|
views/ # Page-level Vue components
|
|
App.vue # Root component
|
|
main.js # Application entry point
|
|
public/ # Static assets served as-is
|
|
tests/ # Playwright (Python) test suite
|
|
conftest.py # Pytest fixtures (Vite dev server, browser config)
|
|
test_step*.py # Test files per feature step
|
|
docs/ # Non-website documentation
|
|
tutorials/ # Step tutorials (EN & FR)
|
|
tutorials/codelabs/ # Google Codelabs format (EN & FR)
|
|
decisions-log.md # Decision log
|
|
plan.md # Feature plan and progress tracking
|
|
specification.md # Project specification
|
|
website/ # Hugo project site (docs + blog), two separate sections
|
|
# by audience, each with its own nav entry
|
|
content/docs/ # User docs ("Documentation" in nav). Diataxis split,
|
|
# both languages: demarrage-rapide/ (tutorial),
|
|
# guides-pratiques.{en,fr}.md (how-to), user-guide/
|
|
# (reference), comprendre.{en,fr}.md (explanation).
|
|
content/developers/ # Contributor docs ("Developers"/"Développeurs" in nav):
|
|
# technical.en.md, technical.fr.md
|
|
content/blog/ # Blog posts (news, release announcements)
|
|
```
|
|
|
|
## Build & Run Commands
|
|
|
|
- `npm run dev` -- Start Vite dev server
|
|
- `npm run build` -- Production build to `dist/`
|
|
- `npm run preview` -- Preview production build
|
|
- `npm run format` -- Format code with Prettier
|
|
- `npm run format:check` -- Check formatting
|
|
|
|
## Plan
|
|
|
|
- Prepare a step-by-step plan to implement one feature at a time (do not rush the full application in one shot)
|
|
- Validate the plan with me before doing anything
|
|
- Validation is required between each step
|
|
|
|
## Code
|
|
|
|
Respect these principles:
|
|
|
|
- KISS (Keep It Simple, Stupid)
|
|
- SOLID (Single Responsibility, Open/Closed, Liskov Substitution, Interface Segregation, Dependency Inversion)
|
|
- DRY (Don't Repeat Yourself)
|
|
- Minimal impact: prefer small, focused changes over large refactors
|
|
- All application source code goes in `src/`
|
|
- All new Vue components use Composition API with `<script setup>`
|
|
- Use existing composables and utilities before creating new ones
|
|
|
|
## Documentation
|
|
|
|
- Keep the decision log updated in `docs/decisions-log.md` with date, decision, and rationale
|
|
- Use Mermaid diagrams to illustrate architecture and flows (prefer: flowchart, sequence diagram, state diagram)
|
|
- `README.md` at project root presents an overview of the application and how to get started
|
|
- All documentation files go in `docs/`
|
|
- **Technical Documentation** (`website/content/developers/`, "Developers"/"Développeurs" nav entry):
|
|
- Technical overview (`technical.en.md`): what the app does, tech stack, global architecture
|
|
- Description of each feature with rationale (why this approach, what was considered and rejected)
|
|
- **User Documentation** (`website/content/docs/`, "Documentation" nav entry):
|
|
- Diataxis-style split, in both English and French: `demarrage-rapide/`
|
|
(tutorial), `guides-pratiques.{en,fr}.md` (how-to), `user-guide/`
|
|
(reference — kept this name across languages so the bundle pairs as a
|
|
Hugo translation), `comprendre.{en,fr}.md` (explanation). Text-based
|
|
preferred, screenshots where they clarify a screen or flow.
|
|
- **Tutorials & Codelabs (for each step):**
|
|
- A tutorial in `docs/tutorials/` explaining what was done (commands, key files, code snippets)
|
|
- Both in English (`_en` suffix) and French (`_fr` suffix)
|
|
- Tutorials and codelabs are optional — only generate when explicitly requested
|
|
|
|
## Tests
|
|
|
|
- Tests are written using Playwright in Python (see `tests/requirements.txt` for dependencies)
|
|
- The Vite dev server starts automatically via the `app_url` fixture in `tests/conftest.py` on port 5199
|
|
- Test files follow the naming convention `test_step<N>_<feature_name>.py`
|
|
- Tests are documented with a short description per test function
|
|
- **Browser targets**: Firefox (primary), Chromium (must also pass)
|
|
- Test both "green" paths (happy flow) and "red" paths (bad inputs, edge cases, error states)
|
|
- All test files go in `tests/`
|
|
- The dev server is stopped automatically by the pytest fixture after tests complete
|
|
|
|
## Schema Version
|
|
|
|
- **Do NOT increment `SCHEMA_VERSION` without asking first.**
|
|
- In-place schema changes (adding columns directly in `SCHEMA_SQL`) are acceptable as long as the app has not been released to users.
|
|
- A version bump is only needed once a schema has been deployed — at that point, a migration script must accompany the bump. Ask before doing either.
|
|
|
|
## Definition of Done
|
|
|
|
Before a step is considered complete, all of the following must be true:
|
|
|
|
- [ ] Code implemented in `src/`
|
|
- [ ] `docs/plan.md` updated to track what is done and what remains
|
|
- [ ] Documentation updated (`website/content/developers/technical.en.md`, `website/content/docs/user-guide/index.en.md`, `docs/decisions-log.md`)
|
|
- [ ] Tests written and passing on both Firefox and Chromium
|
|
- [ ] Manual validation by the user before moving to the next step
|