# CLAUDE.md This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository. ## Monorepo Structure Three independent projects: - **`cofee_frontend/`** — Next.js 16 + TypeScript frontend (FSD architecture) - **`cofee_backend/`** — FastAPI + Python backend (layered module pattern) - **`remotion_service/`** — ElysiaJS + Remotion video captioning microservice Each subproject has its own `CLAUDE.md` and `AGENTS.md` — read the relevant one before starting work. ## Cross-Service Data Flow ``` Frontend (Next.js :3000) → Backend API (FastAPI :8000) → Remotion Service (Elysia :3001) ↕ ↕ PostgreSQL :5332 S3/MinIO :9000 Redis :6379 (pub/sub + task queue) ``` 1. Frontend calls Backend API via typed `openapi-fetch` client with JWT auth 2. Backend submits background jobs via Dramatiq (Redis broker) — e.g. transcription, silence detection 3. Backend sends video + transcription to Remotion Service for caption rendering 4. Remotion renders captions onto video, uploads result to S3, returns S3 path 5. Backend notifies Frontend of job completion via WebSocket (Redis pub/sub) ## Frontend Commands ```bash bun dev # Dev server (localhost:3000) bun run build # Production build bunx tsc --noEmit # Type-check (lint scripts are broken) bun run gc # Generate FSD component bun run gicons # Convert raw SVGs to React icon components bun run gen:api-types # Regenerate API types from OpenAPI schema (needs backend running) bun run test:e2e # Playwright E2E tests ``` ## Backend Commands ```bash uv sync # Install dependencies uv run uvicorn cpv3.main:app --reload # Dev server (localhost:8000) uv run pytest # Run all tests uv run pytest tests/integration/.py # Single test file uv run pytest -k "test_name" # Single test by name uv run dramatiq cpv3.modules.tasks.service # Start background worker uv run alembic revision --autogenerate -m "msg" # Create migration uv run alembic upgrade head # Apply migrations uv run ruff check cpv3/ # Lint uv run ruff format cpv3/ # Auto-format ``` ## Remotion Service Commands ```bash cd remotion_service bun install # Install dependencies bun run server # Start API server (localhost:3001) bun run dev # Remotion Studio for visual debugging bunx tsc --noEmit # Type-check ``` ## Frontend Architecture (FSD) Strict unidirectional imports: `pages -> widgets -> features -> entities -> shared`. No cross-slice imports within the same layer. Enforced by `eslint-plugin-boundaries`. Features are **module-aware** — grouped by domain (`features/profile/`, `features/project/`), not flat. Path aliases: `@app/*`, `@pages/*`, `@widgets/*`, `@features/*`, `@entities/*`, `@shared/*` map to `src//*`. See `cofee_frontend/CLAUDE.md` for full details on components, API client, styling, and gotchas. ## Backend Architecture Layered module pattern. Each module has exactly: `__init__.py`, `models.py`, `schemas.py`, `repository.py`, `service.py`, `router.py`. No extra files, no subdirectories within modules. When in doubt, put logic in `service.py`. 11 modules: `users`, `projects`, `media`, `files`, `transcription`, `captions`, `jobs`, `notifications`, `tasks`, `webhooks`, `system`. Flow: Router → Service → Repository → Database (async SQLAlchemy + PostgreSQL). See `cofee_backend/CLAUDE.md` for full details on patterns, commands, and gotchas. ## Remotion Service Architecture Standalone video captioning microservice. Two layers sharing types: - **Server** (`server/`): ElysiaJS API, single `POST /api/render` endpoint — receives S3 video path + transcription, spawns Remotion CLI render, uploads captioned video to S3. - **Composition** (`src/`): Remotion React components for deterministic frame rendering. All animations **must** use Remotion's `interpolate()`/`spring()`, never CSS transitions or Framer Motion. See `remotion_service/CLAUDE.md` for full details. ## Docker Services ``` postgres → localhost:5332 minio → localhost:9000 (console: 9001) redis → localhost:6379 api → localhost:8000 (OpenAPI at /api/schema/) worker → Dramatiq bg jobs remotion → localhost:3001 ``` ```bash cd cofee_backend && docker-compose up # DB, Redis, MinIO, API, Worker cd remotion_service && docker-compose up # Remotion service (dev) ``` ## Localization All user-facing UI text **must be in Russian**. The only exception is the brand name "Coffee Project" / "Cofee Project" — it stays in English. ## Code Style (Both Projects) - Simple over clever, early returns over deep nesting - Max ~30 lines per function — extract helpers if longer - Named constants instead of magic values - Descriptive names: `getUserById` not `getData` - Store user-facing error messages in named constants (`ERROR_` prefix), not inline strings ## Agent Team This project has a team of 20 agents organized in a 4-tier hierarchy: 1 orchestrator, 3 leads, 14 specialists, and 2 staff. Agent files: `.claude/agents/`. Shared protocol: `.claude/agents-shared/team-protocol.md`. ### Team Hierarchy Orchestrator (Tech Lead) ├── Architecture Lead → Backend Architect, Frontend Architect, DB Architect, Remotion Engineer, Sr. Backend Engineer, Sr. Frontend Engineer ├── Quality Lead → Frontend QA, Backend QA, Security Auditor, Design Auditor, Performance Engineer ├── Product Lead → UI/UX Designer, Technical Writer, ML/AI Engineer ├── DevOps Engineer (staff) └── Debug Specialist (staff) ### Architect vs. Engineer Role Split **Architects** (Backend Architect, Frontend Architect) design specs, API contracts, component trees, and patterns. They advise — they do NOT write implementation code. **Engineers** (Senior Backend Engineer, Senior Frontend Engineer) implement production code from architect specs. They receive designs and produce working code. This separation ensures architectural decisions are made before implementation begins. Architects and engineers may both be dispatched within the same task — the Architecture Lead sequences them. ### Developer Team Consultation For ANY non-trivial task, you MUST consult with the developer team: 1. **Announce**: "Consulting with the developer team to [task summary]" 2. Dispatch the `orchestrator` agent with your analysis — it selects the right leads and dispatches them 3. The orchestrator handles everything: dispatches leads, leads dispatch specialists, results bubble up with audit trails 4. **Credit specialists** in your final response — state which agents contributed ### When to Use the Orchestrator For ANY non-trivial task (feature, bug fix, audit, optimization, research, infrastructure, review, documentation), you MUST: 1. Think about the task yourself first — understand scope, affected areas, risks 2. Dispatch the `orchestrator` agent with your analysis as context 3. Receive the orchestrator's synthesized results (includes full audit trail) 4. Present results to the user Skip the Orchestrator ONLY for trivial tasks: rename a variable, fix a typo, answer a quick factual question. ### Dispatch Loop (Simplified) 1. Dispatch orchestrator with task context 2. Orchestrator handles everything internally (dispatches leads, collects results, resolves conflicts) 3. Receive orchestrator's final synthesis (includes recursive audit trail of all agent calls) 4. Present results to user with team credit summary You no longer need to: process handoffs, track chain history, enforce depth limits, re-invoke agents in continuation mode, dispatch individual specialists, or manage phasing. The orchestrator → lead → specialist hierarchy handles all of this. ### Conflict Handling If the orchestrator reports unresolved conflicts between leads: - Present both perspectives to the user with your analysis - Let the user decide on trade-offs that affect their product ## Compact Instructions When compacting, always preserve: - List of all modified files and their purposes - Test command results (pass/fail) - Architecture decisions made in this session - Error messages and their resolutions - Which subproject (frontend/backend/remotion) is being worked on