* feat(PBI-49): add debugProps helper + Vitest test
Adds lib/debug.ts with debugProps(id, component, file) that returns
data-debug-id and data-debug-label attrs in dev mode, empty object in
production. Adds __tests__/lib/debug.test.ts covering both modes.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* docs(PBI-49): add debug-id pattern doc + CLAUDE.md reference
Adds docs/patterns/debug-id.md documenting the named-component boundary
rule (6 punten), helper-voorbeeld, skip-criteria en motivatie voor
handmatige pad-argumenten. Voegt verwijzing toe aan CLAUDE.md
patterns-tabel.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* refactor(PBI-49): migrate 17 shared/ components to debugProps helper
Replace hardcoded data-debug-id + data-debug-label attribute pairs with
{...debugProps(id, component, file)} spread in all 17 components/shared/
files. Existing debug-ids preserved unchanged.
* feat(PBI-49): add debugProps to backlog/, sprint/, solo/ components
* feat(PBI-49): add debugProps to jobs/ + ideas/ components
* feat(PBI-49): add debugProps to products/ + settings/ + notifications/ components
* feat(PBI-49): add debugProps to admin/ + dashboard/ + dialogs/ + mobile/ + split-pane/
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* fix(PBI-49): use attr(data-debug-id) for debug tooltip in globals.css
* refactor(PBI-49): remove data-debug-label from debugProps helper + test
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* refactor(PBI-49): strip unused component/file args from debugProps in shared/
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat(PBI-49): add BEM sub-element data-debug-id to StatusBar, NavBar, PanelNavBar
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat(PBI-49): add BEM sub-element data-debug-id to components/sprint/*
- new-sprint-dialog: __submit on submit button
- sprint-backlog: __list on SprintBacklogLeft + SprintBacklogRight scroll areas
- sprint-board-client: root wrapper div (display:contents) + __drag-overlay
- sprint-header: __title on goal button, __dates on dates button, __actions on action cluster
- sprint-run-controls: root on controls div, __start/__cancel on action buttons; __blockers-dialog on dialog content
- start-sprint-button: root on trigger button, __dialog on dialog content, __submit on submit button
- sync-active-sprint-cookie: no debug-id (returns null, side-effect only), comment added
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat(PBI-49): add BEM sub-element data-debug-id to components/backlog/*
* feat(PBI-49): add BEM sub-element data-debug-id to components/ideas/*
* feat(PBI-49): add BEM sub-element data-debug-id to components/dashboard/* + components/markdown.tsx
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat(PBI-49): add BEM sub-element data-debug-id to new-product-button
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat(PBI-49): add BEM sub-element data-debug-id to components/solo/*
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat(PBI-49): add BEM sub-elements to nav-status-indicators
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat(PBI-49): add BEM sub-element data-debug-id to components/jobs/*
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat(PBI-49): add BEM sub-element data-debug-id to components/products/*
* feat(PBI-49): add BEM sub-element data-debug-id to components/notifications/*
- answer-modal: __content (scroll area), __submit (footer)
- notifications-bridge: skip comment (bridge, non-rendering wrapper)
- notifications-realtime-mount: skip comment (returns null)
- notifications-sheet: __header, __items (questions list)
- push-toggle: __switch (button), __label (button text) on subscribed/unsubscribed states
* feat(PBI-49): add BEM sub-element data-debug-id to components/settings/*
- leave-product-button: root only (single-button component)
- min-quota-editor: __input (number input), __save (save button)
- profile-editor: __username (bio/short-description input), __save (submit)
- role-manager: __roles (checkbox list), __add (save button)
- token-manager: __tokens (active tokens list), __generate (create button)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* feat(PBI-49): add BEM sub-element data-debug-id to admin, auth, dialogs, entity-dialog, mobile, split-pane
* docs(PBI-49): add debug-labels BEM pattern doc + CLAUDE.md entry
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---------
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
141 lines
6.2 KiB
Markdown
141 lines
6.2 KiB
Markdown
---
|
||
title: "CLAUDE.md — Scrum4Me"
|
||
status: active
|
||
audience: [ai-agent]
|
||
language: nl
|
||
last_updated: 2026-05-08
|
||
---
|
||
|
||
# CLAUDE.md — Scrum4Me
|
||
|
||
Desktop-first Scrum-app voor solo developers en kleine teams. Hiërarchie: product → PBI → story → taak. Zie [README.md](./README.md) voor setup.
|
||
|
||
---
|
||
|
||
## Orientatie
|
||
|
||
| Bestand | Waarvoor |
|
||
|---|---|
|
||
| `docs/INDEX.md` | Gegenereerde index van alle docs — begin hier |
|
||
| `docs/specs/functional.md` | Acceptatiecriteria, user flows |
|
||
| `docs/architecture.md` | Breadcrumb → 6 topische arch-bestanden |
|
||
| `docs/backlog/index.md` | Implementatievolgorde, "done when"-criteria |
|
||
| `docs/api/rest-contract.md` | REST API contract voor Claude Code |
|
||
| `docs/design/styling.md` | **Lees vóór elk component** — MD3-tokens, shadcn |
|
||
| `docs/plans/<key>-*.md` | Implementatieplan per milestone |
|
||
| `docs/adr/` | Architecture Decision Records — tech-keuzes (base-ui vs Radix, sort-order, demo-policy, …) |
|
||
| `docs/manual/` | 7-delige gebruiks- en operationele handleiding (workflow, git, docker, troubleshooting) |
|
||
| `docs/architecture/` | 6 topische architecture-bestanden (data-model, auth, sprint-execution, …) — uitwerking van `docs/architecture.md` |
|
||
|
||
---
|
||
|
||
## Hoe werk vinden
|
||
|
||
**Track A — MCP (aanbevolen):**
|
||
1. Branch aanmaken: `git checkout -b feat/<batch-slug>` — nog **geen** `gh pr create`
|
||
2. `mcp__scrum4me__get_claude_context` → pak de next story
|
||
3. Voer taken uit in `sort_order`; update status per taak
|
||
4. Lees het relevante patroon en styling vóór je begint
|
||
5. Verifieer: `npm run verify && npm run build` — `verify` = lint + typecheck + test
|
||
6. Commit per laag: `git add -A && git commit` — **geen** `git push` — zie [docs/runbooks/branch-and-commit.md](./docs/runbooks/branch-and-commit.md)
|
||
7. Herhaal stap 2–6 per story; branch blijft dezelfde
|
||
8. Queue leeg → `git push -u origin <branch>` + `gh pr create`
|
||
|
||
**Track B — manueel:**
|
||
1. Lees taak in `docs/backlog/index.md`
|
||
2. Zoek spec in `docs/specs/functional.md`
|
||
3. Lees patroon + styling → bouw → verifieer → vraag bevestiging → commit
|
||
|
||
Volledige MCP-tool documentatie: [docs/runbooks/mcp-integration.md](./docs/runbooks/mcp-integration.md)
|
||
|
||
---
|
||
|
||
## Hardstop regels
|
||
|
||
- **Styling:** nooit `bg-blue-500`; altijd MD3-tokens (`bg-primary`, `bg-status-done`, …)
|
||
- **UI:** gebruik `@base-ui/react` met `render`-prop, niet Radix `asChild`
|
||
- **Push:** commits accumuleren lokaal per taak (`git add -A && git commit`); push + PR pas bij lege queue of na expliciete gebruikersbevestiging — zie [branch-and-commit.md](./docs/runbooks/branch-and-commit.md)
|
||
- **Demo:** drie lagen — proxy.ts + server action + UI disabled knop
|
||
- **Enum:** DB UPPER_SNAKE ↔ API lowercase — uitsluitend via `lib/task-status.ts`
|
||
- **Foutcodes:** 400 = parse-fout, 422 = Zod-validatie, 403 = demo-token
|
||
- **Server/client grens:** `*-server.ts` bevat DB/node-only; nooit importeren in client component
|
||
- **Worker/jobs:** `ClaudeJob` queue (`QUEUED → CLAIMED → RUNNING → DONE|FAILED|SKIPPED`); MCP-worker claimt via `wait_for_job` en sluit met `update_job_status` — zie [worker-idempotency.md](./docs/runbooks/worker-idempotency.md)
|
||
- **Model/mode per ClaudeJob:** kind-default → product → job-snapshot → `task.requires_opus`. Resolver in `scrum4me-mcp/src/lib/job-config.ts` (en gespiegeld in `lib/job-config.ts`) — zie [job-model-selection.md](./docs/runbooks/job-model-selection.md)
|
||
- **Deployment:** `npm run verify && npm run build` vóór elke PR. Selectieve deploy-controle (labels + path-filter): zie [docs/runbooks/deploy-control.md](./docs/runbooks/deploy-control.md)
|
||
|
||
---
|
||
|
||
## Stack
|
||
|
||
| Laag | Technologie |
|
||
|---|---|
|
||
| Framework | Next.js 16 (App Router) + React 19 |
|
||
| Taal | TypeScript strict |
|
||
| Styling | Tailwind CSS + shadcn/ui + MD3 via `app/styles/theme.css` |
|
||
| State | Zustand + dnd-kit |
|
||
| DB | Prisma v7 + PostgreSQL (Neon) |
|
||
| Auth | iron-session + bcryptjs |
|
||
| Test | Vitest (`__tests__/`, config in `vitest.config.ts`) |
|
||
| Utilities | Zod, Sonner, Sharp, Vercel Analytics |
|
||
|
||
---
|
||
|
||
## Patterns quickref
|
||
|
||
| Patroon | Bestand |
|
||
|---|---|
|
||
| iron-session | `docs/patterns/iron-session.md` |
|
||
| Prisma singleton | `docs/patterns/prisma-client.md` |
|
||
| Server Action (auth + Zod) | `docs/patterns/server-action.md` |
|
||
| Route Handler (REST) | `docs/patterns/route-handler.md` |
|
||
| Zustand optimistic update | `docs/patterns/zustand-optimistic.md` |
|
||
| Float sort_order / drag-and-drop | `docs/patterns/sort-order.md` |
|
||
| Proxy / route protection | `docs/patterns/proxy.md` |
|
||
| QR-pairing | `docs/patterns/qr-login.md` |
|
||
| Claude ↔ user vraagkanaal | `docs/patterns/claude-question-channel.md` |
|
||
| Entity Dialog (verplicht) | `docs/patterns/dialog.md` |
|
||
| Realtime NOTIFY-payload | `docs/patterns/realtime-notify-payload.md` |
|
||
| Story met UI-component | `docs/patterns/story-with-ui-component.md` |
|
||
| Web Push | `docs/patterns/web-push.md` |
|
||
| Job-config resolver (PBI-67) | `lib/job-config.ts` ↔ `scrum4me-mcp/src/lib/job-config.ts` |
|
||
| Debug-id op component-root | `docs/patterns/debug-id.md` |
|
||
| Debug-labels (BEM) | `docs/patterns/debug-labels.md` |
|
||
|
||
---
|
||
|
||
## Env vars
|
||
|
||
```bash
|
||
DATABASE_URL="" # postgresql://...
|
||
DIRECT_URL="" # pooler-bypass voor LISTEN/NOTIFY
|
||
SESSION_SECRET="" # min 32 chars
|
||
CRON_SECRET="" # Bearer-secret /api/cron/*
|
||
```
|
||
|
||
Volledig schema: `lib/env.ts`. Canonieke lijst: `.env.example` — bevat ook web-push (`VAPID_*`, `INTERNAL_PUSH_SECRET`), Sentry (`SENTRY_*`) en optioneel `ANTHROPIC_API_KEY`.
|
||
|
||
---
|
||
|
||
## MCP & cron
|
||
|
||
- **MCP-server (extern):** standalone Node-proces in `~/Development/scrum4me-mcp/` — Prisma-schema gesynced via `sync-schema.sh`. 30+ tools (`get_claude_context`, `wait_for_job`, `update_task_status`, …)
|
||
- **Cron (vercel.json):**
|
||
- `/api/cron/expire-questions` — dagelijks 04:00 UTC
|
||
- `/api/cron/cleanup-agent-artifacts` — dagelijks 03:00 UTC
|
||
- **Realtime:** SSE op `/api/realtime/*`, gevoed door PostgreSQL `LISTEN`/`NOTIFY` op kanaal `scrum4me_changes` (vereist `DIRECT_URL` voor pooler-bypass)
|
||
|
||
---
|
||
|
||
## Scrum-terminologie
|
||
|
||
PBI (niet: Feature/Epic) · Story (niet: Ticket) · Sprint Goal (niet: Objective)
|
||
|
||
---
|
||
|
||
## Verificatie
|
||
|
||
```bash
|
||
npm run verify && npm run build # verify = lint + typecheck + test
|
||
```
|
||
|
||
Worker job-status protocol (wanneer `DONE` / `SKIPPED` / `FAILED`): zie [docs/runbooks/worker-idempotency.md](./docs/runbooks/worker-idempotency.md).
|