flowchart TB
    subgraph Users[" "]
        direction LR
        User["👤 Public User"]
        Staff["👔 EAO Staff"]
    end
    
    subgraph OpenShift["OpenShift Cluster"]
        Route["🌐 OpenShift Route<br/>projects.eao.gov.bc.ca"]
        
        subgraph Proxy["Reverse Proxy"]
            RProxy["eao-nginx"]
        end
        
        subgraph Apps["Application Layer"]
            direction LR
            Public["eagle-public<br/>Angular SPA"]
            Admin["eagle-admin<br/>Angular SPA"]
            API["eagle-api<br/>Node.js"]
        end
        
        subgraph Analytics["Analytics"]
            direction LR
            Collector["penguin-analytics<br/>Event Collector"]
            Metabase["Metabase<br/>Dashboards"]
        end
        
        subgraph Data["Data Layer"]
            direction LR
            MongoDB[("MongoDB")]
            TimescaleDB[("TimescaleDB")]
            Typesense[("Typesense")]
        end
    end
    
    subgraph External["External Services"]
        Keycloak["🔐 BC Gov Keycloak<br/>loginproxy.gov.bc.ca"]
    end

    User --> Route
    Staff --> Route
    Route --> RProxy
    
    RProxy -->|"/"|Public
    RProxy -->|"/admin/"|Admin
    RProxy -->|"/api/"|API
    RProxy -->|"/analytics"|Collector
    
    Public & Admin -.->|config|API
    Public & Admin -.->|events|Collector
    
    Staff -.->|OIDC login|Keycloak
    Admin & API -.->|token validation|Keycloak
    
    API --> MongoDB
    API -->|sync| Typesense
    Public -.->|search| Typesense
    Collector --> TimescaleDB
    Metabase --> TimescaleDB

sequenceDiagram
    participant User
    participant Route as OpenShift Route
    participant RProxy as eao-nginx
    participant Public as eagle-public
    participant API as eagle-api
    participant DB as MongoDB
    
    User->>Route: GET projects.eao.gov.bc.ca/p/project-123
    Route->>RProxy: Forward (TLS terminated)
    RProxy->>Public: GET /p/project-123
    Public->>User: Return Angular SPA
    
    Note over User,Public: Browser loads Angular app
    
    User->>Route: GET /api/public/config
    Route->>RProxy: Forward
    RProxy->>API: GET /api/public/config
    API->>User: Return app configuration
    
    User->>Route: GET /api/public/project/project-123
    Route->>RProxy: Forward
    RProxy->>API: GET /api/public/project/project-123
    API->>DB: Query project
    DB->>API: Project data
    API->>User: Return project JSON

flowchart LR
    subgraph Build["Build Time"]
        Code[Source Code] --> Build1[yarn build]
        Build1 --> Artifact[Static Files]
        Artifact --> Image[Container Image]
    end
    
    subgraph Runtime["Runtime"]
        Image --> Container[Running Container]
        Container --> Nginx[nginx serves SPA]
        Nginx --> Browser[Browser loads app]
        Browser --> Config[Fetch /api/config]
        Config --> API[eagle-api]
        API --> App[App configured]
    end