Files
edh-stats/docker-compose.yml
Michael d69a14d80b Migrate frontend to SvelteKit with comprehensive deployment (#2)
* Migrate frontend to SvelteKit with comprehensive deployment
documentation

- Create new SvelteKit project structure with routing, stores, and
  components
- Implement complete authentication system with auth store and protected
  routes
- Build all application pages: Home, Login, Register, Dashboard, Games,
  Stats, Commanders, Profile, and Round Counter
- Configure Vite, TailwindCSS, PostCSS, and Nginx for production
  deployment
- Add Dockerfile.svelte for containerized builds with multi-stage
  optimization
- Create comprehensive SVELTE_DEPLOYMENT.md and SVELTE_MIGRATION.md
  guides
- Update deployment scripts and package dependencies for SvelteKit
  ecosystem

* feat: Add user authentication and game tracking pages to EDH Stats
Tracker

* Migrate frontend to SvelteKit and update Docker configuration

- Replace Alpine.js with SvelteKit for improved DX and hot module
  replacement
- Switch frontend service to `Dockerfile.dev` with volume mounts and
  Vite dev server
- Update `docker-compose.yml` to map ports 5173 and use
  `http://localhost:5173` for CORS
- Add `Dockerfile.svelte` for production static builds
- Configure Vite proxy to target `http://backend:3000` in containers and
  `localhost:3002` locally
- Migrate existing components to new routes and update authentication
  store logic
- Add Chart.js integration to stats page and handle field name mapping
  for forms
- Include static assets (`fonts/Beleren-Bold.ttf`) and update deployment
  scripts
- Document migration status, testing checklist, and known minor issues
  in guides

* Refactor frontend state properties from snake_case to camelCase

This commit standardizes frontend property access across Dashboard,
Games, and Stats pages.
Changes include:
- Renaming API data fields (e.g., `commanderName`, `playerCount`,
  `winRate`).
- Updating `startEdit` logic to normalize mixed snake_case/camelCase
  inputs.
- Replacing template literals like `_player_won` with camelCase
  versions.
- Consistent usage of `totalGames` and `wins` instead of snake_case
  variants.

* Update version to 2.1.12 and refactor commander management

- Upgrade application version to 2.1.12
- Add Footer component and include in all pages
- Refactor `/commanders` page to fetch commanders and stats separately
- Fix commander API endpoint to load all commanders instead of only
  those with stats
- Add stats merging logic to calculate wins, win rate, and avg rounds
- Split add/edit command logic into shared `loadCommanders` function
- Fix color toggle logic to work with both new and editing command modes
- Update API methods for update requests to send `PUT` for existing
  commanders
- Enhance commander delete functionality with proper API response
  handling
- Refactor dashboard and stats pages to reuse shared data loading logic
- Add chart cleanup on destroy for both dashboard and stats pages
- Implement Chart.js for Win Rate by Color and Player Count charts
- Reorganize round counter component state and timer functions
- Add localStorage persistence for round counter with pause/resume
  support
- Update game log page to integrate footer component

* Refactor auth store and backend to use stable user ID

*   Backend: Switch user lookup from username to ID in auth routes to
    maintain stability across username changes.
*   Frontend: Update user store to reflect ID-based updates.
*   UI: Refactor user menu Svelte component to use ID-based user data.
*   Profile: Switch profile page to use ID-based user data for
    validation and state management.

* format date formatting options consistently across dashboard and games
pages

* format date formatting options consistently across dashboard and games
pages

* Refactor card action buttons to use icons with semantic text

- Switch "Edit" and "Delete" button text to SVG icons in `commanders`
  and `games` pages
- Update icon colors and font styles to match standard design tokens
  (indigo/red, bold text)
- Improve responsive spacing by adding `lg:grid-cols-3`

* grids
- Clarify hover states and titles for better UX accessibility
  Bump application versions to 2.2.0 and update deployment configuration

* Convert `+page.svelte` to use template strings for multiline strings and
fix syntax errors.

* Update static version to 2.2.2 and tighten nginx cache headers
2026-04-11 10:42:46 +02:00

132 lines
3.7 KiB
YAML

# Docker Compose configuration for EDH Stats Tracker
# DEVELOPMENT ENVIRONMENT with hot reload
# For production deployment, use docker-compose.prod.deployed.yml (generated by deploy.sh or GitHub Actions)
services:
# PostgreSQL database service
postgres:
image: postgres:16-alpine
container_name: edh-stats-postgres
environment:
- POSTGRES_USER=${DB_USER:-postgres}
- POSTGRES_PASSWORD=${DB_PASSWORD:-edh_password}
- POSTGRES_DB=${DB_NAME:-edh_stats}
volumes:
- ./postgres_data:/var/lib/postgresql/data
- ./scripts:/scripts:ro
- ./backups:/backups
healthcheck:
test:
[
'CMD-SHELL',
'PGPASSWORD=${DB_PASSWORD:-edh_password} pg_isready -U postgres -h localhost'
]
interval: 10s
timeout: 5s
retries: 5
networks:
- edh-stats-network
restart: unless-stopped
# Database migration service - runs once on startup
db-migrate:
build:
context: ./backend
dockerfile: Dockerfile
target: production
container_name: edh-stats-db-migrate
depends_on:
postgres:
condition: service_healthy
environment:
- NODE_ENV=${NODE_ENV:-development}
- DB_HOST=${DB_HOST:-postgres}
- DB_NAME=${DB_NAME:-edh_stats}
- DB_USER=${DB_USER:-postgres}
- DB_PASSWORD=${DB_PASSWORD:-edh_password}
# Set DB_SEED=true to automatically seed database with sample data after migrations
- DB_SEED=${DB_SEED:-false}
command: node src/database/migrate.js migrate
networks:
- edh-stats-network
restart: 'no'
# Backend API service
backend:
build:
context: ./backend
dockerfile: Dockerfile
target: production
container_name: edh-stats-backend
ports:
- '3002:3000'
depends_on:
db-migrate:
condition: service_completed_successfully
environment:
- NODE_ENV=${NODE_ENV:-development}
- DB_HOST=${DB_HOST:-postgres}
- DB_NAME=${DB_NAME:-edh_stats}
- DB_USER=${DB_USER:-postgres}
- DB_PASSWORD=${DB_PASSWORD:-edh_password}
- JWT_SECRET=${JWT_SECRET:-dev-jwt-secret-key-change-in-production}
- CORS_ORIGIN=${CORS_ORIGIN:-http://localhost:5173}
- LOG_LEVEL=${LOG_LEVEL:-info}
- ALLOW_REGISTRATION=${ALLOW_REGISTRATION:-true}
- MAX_USERS=${MAX_USERS:-}
volumes:
- ./backend/src:/app/src
restart: unless-stopped
healthcheck:
test:
[
'CMD',
'wget',
'--no-verbose',
'--tries=1',
'--spider',
'http://localhost:3000/api/health'
]
interval: 30s
timeout: 10s
retries: 3
start_period: 40s
networks:
- edh-stats-network
# Frontend web server (SvelteKit) - Development Mode with Hot Reload
frontend:
build:
context: ./frontend
dockerfile: Dockerfile.dev
container_name: edh-stats-frontend
ports:
- '5173:5173' # Vite dev server
depends_on:
- backend
environment:
- NODE_ENV=development
- DOCKER=true
- VITE_API_URL=http://localhost:3002
volumes:
- ./frontend/src:/app/src
- ./frontend/static:/app/static
- ./frontend/svelte.config.js:/app/svelte.config.js
- ./frontend/vite.config.js:/app/vite.config.js
- ./frontend/tailwind.config.js:/app/tailwind.config.js
- ./frontend/postcss.config.js:/app/postcss.config.js
# Exclude node_modules and build artifacts from volume mount
- /app/node_modules
- /app/.svelte-kit
command: npm run dev -- --host 0.0.0.0
restart: unless-stopped
networks:
- edh-stats-network
volumes:
postgres_data:
driver: local
networks:
edh-stats-network:
driver: bridge