@startuml
!define RECTANGLE class

title Notification System - Component Architecture

package "Event Sources" {
  [Message Service] as MSG
  [Status Service] as STATUS
  [Alert Service] as ALERT
}

package "Notification Core" {
  [Event Processor] as PROC
  [Notification Store] as STORE
  [Delivery Coordinator] as COORD
  
  note right of PROC
    Responsibilities:
    - Validate event schema
    - Check user preferences
    - Sanitize content (XSS prevention)
    - Enforce rate limits
    - Authorize (user_id matching)
  end note
  
  note right of STORE
    Tables:
    - notifications (id, user_id, event_type, 
      message, created_at, read)
    - user_preferences (user_id, 
      event_type, enabled)
    - rate_limits (user_id, count, window)
  end note
}

package "Delivery Mechanisms" {
  [Polling Endpoint] as POLL
  [WebSocket Gateway] as WS
  
  note bottom of POLL
    MVP Implementation:
    GET /api/notifications/unread
    - Uses existing session auth
    - Returns JSON array
    - 30s polling interval
  end note
  
  note bottom of WS
    Future Implementation:
    - Socket.IO or raw WebSocket
    - Token-based auth
    - Real-time push
    (Not in MVP)
  end note
}

package "Clients" {
  [React Frontend] as FRONTEND
  [Browser Notification API] as BROWSER
}

' Event flow
MSG --> PROC : emit event
STATUS --> PROC : emit event
ALERT --> PROC : emit event

PROC --> STORE : store notification
PROC --> COORD : trigger delivery

COORD --> POLL : via polling (MVP)
COORD ..> WS : via push (future)

POLL --> FRONTEND : HTTP response
WS ..> FRONTEND : WebSocket message

FRONTEND --> BROWSER : show notification

' Component boundaries
package "Security Boundary" {
  PROC
  COORD
}

note bottom of "Security Boundary"
  All security measures enforced here:
  - Input sanitization
  - Rate limiting (100/min per user)
  - Authentication (session/token)
  - Authorization (user_id ACL)
end note

@enduml