# Phase 7: Production-Ready UI & Full Blueprint Feature Parity

**Status**: Planning
**Parent**: [primary-plan.md](primary-plan.md)

---

## Goal

Transform the web UI into a production-ready application with i18n, theming, OAuth, and full feature parity with the HAOS blueprint's 4 notification modes.

---

## Scope Summary

### A. Frontend Enhancements
1. **i18n**: RU/EN locale support with language switcher
2. **Theming**: Light/dark mode toggle with system preference detection
3. **OAuth**: Login via Immich OAuth (reuse existing Immich auth)

### B. Backend: New Notification Modes (from Blueprint)
4. **Periodic Summary**: Scheduled album summaries (daily/weekly/custom interval)
5. **Scheduled Assets**: Send random/curated photos on a schedule
6. **Memory Mode**: "On This Day" notifications from previous years

### C. Backend: Enhanced Tracker Configuration
7. **Asset filtering**: type (photo/video), favorites only, min rating, date range
8. **Asset sorting**: by date/rating/name/random, ascending/descending
9. **Truncation**: max assets to show, "...and X more" message
10. **Telegram media config**: max media count, group size, chunk delay, size limits, video warning

### D. Backend: Enhanced Message Templates
11. **Per-event templates**: separate templates for added/removed/renamed/deleted
12. **Formatting sub-templates**: asset item (image/video), people format, assets list wrapper
13. **Date/location formatting**: common date detection, per-asset dates, location format
14. **40+ template variables** matching the blueprint

### E. OAuth Integration
15. **Immich OAuth provider**: Login using Immich server credentials
16. **OAuth flow**: redirect to Immich -> callback -> create/link user

---

## Tasks

### A1. i18n Setup `[ ]`
- Install `svelte-i18n` or custom i18n store
- Create `$lib/i18n/en.json` and `$lib/i18n/ru.json` translation files
- Language switcher in sidebar footer
- Persist language preference in localStorage
- Translate all UI strings (~100 keys)

### A2. Dark/Light Theme `[ ]`
- CSS variables for dark theme in app.css
- Theme toggle in sidebar header
- Persist preference in localStorage
- Respect `prefers-color-scheme` as default

### A3. OAuth Support `[ ]`
- Backend: `GET /api/auth/oauth/immich` -> redirect to Immich OAuth
- Backend: `GET /api/auth/oauth/callback` -> exchange code, create/link user
- Backend: Store OAuth config (Immich server URL, client ID) in settings
- Frontend: "Login with Immich" button on login page
- Backend: `POST /api/auth/oauth/config` (admin) -> configure OAuth

### B1. Periodic Summary Mode `[ ]`
- New DB model: `ScheduledJob` (type, tracker_id, interval_days, start_date, times, enabled)
- APScheduler cron jobs for summary notifications
- Template: periodic_summary_message, periodic_album_template
- API: CRUD for scheduled jobs per tracker
- Frontend: Scheduled notifications tab in tracker edit form

### B2. Scheduled Assets Mode `[ ]`
- Uses same `ScheduledJob` model with type="scheduled_assets"
- Fetch assets via core `filter_assets` + `sort_assets`
- Album modes: per_album, combined, random
- Config: limit, favorite_only, asset_type, min_rating, date range, order_by, order

### B3. Memory Mode `[ ]`
- Uses same `ScheduledJob` model with type="memory"
- Fetch assets using `memory_date` filter (same month/day, different year)
- Album modes: per_album, combined, random
- Config: limit, favorite_only, asset_type, min_rating

### C1. Enhanced Tracker Config `[ ]`
- Add to AlbumTracker model:
  - track_images, track_videos (bool)
  - notify_favorites_only (bool)
  - include_people, include_asset_details (bool)
  - max_assets_to_show (int)
  - assets_order_by, assets_order (str)
- Update tracker form in frontend with these fields
- Update watcher to apply filters before notification

### C2. Telegram Media Config `[ ]`
- Add to NotificationTarget config (for telegram type):
  - max_media_to_send, max_media_per_group, media_delay
  - max_asset_size, video_warning, disable_url_preview, chat_action
  - send_large_photos_as_documents
- Update notifier to pass these to TelegramClient
- Frontend: Telegram-specific config section in target form

### D1. Per-Event Templates `[ ]`
- Extend MessageTemplate model with `event_type` field
- Templates per event: assets_added, assets_removed, album_renamed, album_deleted
- Sub-templates: asset_image, asset_video, people_format, assets_wrapper
- Default templates seeded on first run

### D2. Template Variable System `[ ]`
- Implement all 40+ variables from blueprint
- Date formatting (configurable strftime format)
- Common date/location detection across assets
- Favorite indicator, rating display
- Location formatting (city, state, country)
- "...and X more" truncation

---

## Estimated Scope

This is equivalent to ~3 full phases of work. Recommend implementing in order:
1. A1+A2 (i18n + themes) -- visual foundation
2. A3 (OAuth) -- auth enhancement
3. C1+C2 (tracker + telegram config) -- backend enrichment
4. D1+D2 (templates) -- notification intelligence
5. B1+B2+B3 (scheduled modes) -- new notification modes

---

## Acceptance Criteria

- [ ] UI works in Russian and English with persistent preference
- [ ] Dark and light themes with system preference detection
- [ ] OAuth login via Immich server
- [ ] All 4 notification modes functional (event, periodic, scheduled, memory)
- [ ] Tracker config matches blueprint capabilities
- [ ] Template system supports 40+ variables with per-event templates
- [ ] Telegram media config fully exposed in UI