# CLAUDE.md

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

## Project Overview

This is the web application for SimpleCloudNotifier (SCN), a push notification service. It's an Angular 19 standalone component-based SPA using ng-zorro-antd (Ant Design) for UI components.

## Common Commands

- `npm start` - Start development server
- `npm run build` - Production build (outputs to `dist/scn-webapp`)
- `npm run watch` - Development build with watch mode
- `npm test` - Run tests with Karma

## Architecture

### Application Structure

The app follows a feature-based module organization with standalone components:

- `src/app/core/` - Singleton services, guards, interceptors, and data models
- `src/app/features/` - Feature modules (messages, channels, subscriptions, keys, clients, senders, account, auth)
- `src/app/shared/` - Reusable components, directives, and pipes
- `src/app/layout/` - Main layout component with sidebar navigation

### Key Patterns

**Authentication**: Uses a custom `SCN` token scheme. Credentials (user_id and admin_key) are stored in sessionStorage and attached via `authInterceptor`. The `authGuard` protects all routes except `/login`.

**API Communication**: All API calls go through `ApiService` (`src/app/core/services/api.service.ts`). The base URL is configured in `src/environments/environment.ts`.

**State Management**: Uses Angular signals throughout. No external state library - each component manages its own state with signals.

**Routing**: Lazy-loaded standalone components. All authenticated routes are children of `MainLayoutComponent`.

### Data Models

Models in `src/app/core/models/` correspond to SCN API entities:
- User, Message, Channel, Subscription, KeyToken, Client, SenderName

### UI Framework

Uses ng-zorro-antd with explicit icon imports in `app.config.ts`. Icons must be added to the `icons` array before use.

### Project Configuration

- SCSS for styling
- Strict TypeScript (`strict: true`)
- Component generation skips tests by default (configured in `angular.json`)