Calendar_Frontend/CLAUDE.md

CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

Commands

npm start          # Dev server at http://localhost:4200/ (live reload)
npm run build      # Production build
npm run watch      # Build with watch mode (development config)
npm test           # Run unit tests (Jasmine/Karma in Chrome)

No linter is configured in this project.

Architecture

Angular 18 single-page app for managing calendar events for the "Nachklang" organization. Uses Angular Material for UI, RxJS for async data, and reactive forms. No NgRx — state lives in component local variables.

Environments:

• Dev: http://localhost:3000 (expects backend running locally)
• Prod: https://api.nachklang.art

Routing (app.routing.ts):

• / → LandingpageComponent
• /admin → AdminComponent (main calendar management page)
• ** → NotfoundComponent

Service layer (src/app/services/):

• api.service.ts — all HTTP calls to the backend REST API; session credentials are passed as query params (sessionId, sessionKey)
• utils.service.ts — localStorage helpers for persisting session and user data

Data models (src/app/models/): Event, User, Session

Admin page (src/app/pages/admin/) is the core of the app. It owns events state and passes it down to EventsTableComponent via @Input(). Key features: multi-calendar support (public, members, choir, management, birthdays), event filtering (future/past/all), sorting, and an event-move dialog (EventMovePopupComponent via Angular Material Dialog).

Calendar-specific behavior: Birthday calendar auto-sets recurrence to YEARLY. Events have a status field (DRAFT / DELETED).

Session lifecycle: checkSession() is called on AdminComponent init; on failure it redirects to /.