diff --git a/README.md b/README.md index 685767b..1aca242 100644 --- a/README.md +++ b/README.md @@ -32,7 +32,7 @@ make run ``` * Send an alert by opening [http://0.0.0.0:8889/notebooks/notebooks/send_real_alerts.ipynb](http://0.0.0.0:8889/notebooks/notebooks/send_real_alerts.ipynb) -* Observe the alert on the frontend at [http://0.0.0.0:8050/](http://0.0.0.0:8050/) +* Observe the alert on the frontend at [http://localhost:8080/](http://localhost:8080/) * Use credentials from `data/csv/API_DATA_DEV/users.csv` * Or check directly on the API at [http://0.0.0.0:5050/docs](http://0.0.0.0:5050/docs) with the same creds @@ -43,7 +43,7 @@ make run * **pyro-api**: Pyronear API (uvicorn) * **db**: PostgreSQL database * **minio**: S3-compatible storage (via MinIO) -* **frontend**: Web app (Dash) +* **frontend**: Web app (React, [pyro-platform](https://github.com/pyronear/pyro-platform)) * **pyro-engine**: Engine service (requires cameras, optional) * **reolinkdev1 / reolinkdev2**: Fake Reolink cameras sending test images * **notebooks**: Jupyter server to run helper notebooks @@ -91,10 +91,11 @@ docker logs engine ## 🔑 Access * **API**: [http://localhost:5050/docs](http://localhost:5050/docs) -* **Frontend (Dash app)**: [http://localhost:8050](http://localhost:8050) +* **Frontend (React app)**: [http://localhost:8080](http://localhost:8080) * If issues: use a private browser window * Admin access currently does not display camera alerts, use user creds from `data/csv/users.csv` + * Configuration (API URL, etc.) lives in `containers/frontend/app-config.js` * **Notebooks**: [http://localhost:8889](http://localhost:8889) * **pgAdmin (db-ui)**: [http://localhost:8888/browser/](http://localhost:8888/browser/) diff --git a/containers/frontend/app-config.js b/containers/frontend/app-config.js new file mode 100644 index 0000000..46e02be --- /dev/null +++ b/containers/frontend/app-config.js @@ -0,0 +1,21 @@ +window.AppConfig = { + API_URL: 'http://localhost:5050', + API_TIMEOUT_MS: 2000, + LIVE_STREAMING_MEDIA_URL: '', + + LIVE_STREAMING_TIMEOUT_SECONDS: 30, + CAMERAS_INACTIVITY_THRESHOLD_MINUTES: 30, + CAMERAS_LIST_REFRESH_INTERVAL_MINUTES: 2, + ALERTS_LIST_REFRESH_INTERVAL_SECONDS: 30, + ALERTS_PLAYER_INTERVAL_MILLISECONDS: 500, + ALERTS_PLAYER_CONFIDENCE_THRESHOLD: 0.15, + ALERTS_SOUND_FILE: 'notification-alert.mp3', + ALERTS_CAMERA_RANGE_KM: 30, + USER_GUIDE_URLS: { + fr: 'https://pyronear.notion.site/Guide-d-utilisation-plateforme-Pyronear-376425b63668818ebd17da60b20cc770', + en: 'https://pyronear.notion.site/Pyronear-Platform-User-Guide-389425b6366881da906ee38e93524db2', + de: 'https://pyronear.notion.site/Pyronear-Plattform-Benutzerhandbuch-389425b63668816abf44e8679fb9dd35', + es: 'https://pyronear.notion.site/Gu-a-de-uso-de-la-plataforma-Pyronear-389425b6366881e69fd6f6f1a414814d', + }, + HISTORY_NB_ALERTS_PER_PAGE: 15, +}; diff --git a/containers/frontend/sites_live_access.json b/containers/frontend/sites_live_access.json new file mode 100644 index 0000000..3b0219b --- /dev/null +++ b/containers/frontend/sites_live_access.json @@ -0,0 +1,5 @@ +{ + "st-peray": ["st-peray"], + "test07": ["brison", "serre-de-barre"], + "test77": ["croix-augas", "videlles", "moret-sur-loing", "nemours"] +} diff --git a/docker-compose.yml b/docker-compose.yml index 3699ed9..b73bec8 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -17,7 +17,7 @@ services: - S3_SECRET_KEY=${S3_SECRET_KEY} - S3_REGION=${S3_REGION} - SERVER_NAME=${SERVER_NAME} - - PLATFORM_URL=${PLATFORM_URL:-http://0.0.0.0:8050} + - PLATFORM_URL=${PLATFORM_URL:-http://localhost:8080} - TEMPORAL_API_URL=${TEMPORAL_API_URL:-} - TEMPORAL_MODEL_THRESHOLD=${TEMPORAL_MODEL_THRESHOLD:-0.45} - TEMPORAL_API_TOKEN=${TEMPORAL_API_TOKEN:-} @@ -146,17 +146,16 @@ services: pyro_api: condition: service_healthy frontend: - image: pyronear/pyro-platform:latest - command: python index.py --host 0.0.0.0 --port 8050 + image: pyronear/pyro-platform-react:latest profiles: - front ports: - - 8050:8050 - environment: - - API_URL=${API_URL} - - API_LOGIN=${SUPERADMIN_LOGIN} - - API_PWD=${SUPERADMIN_PWD} - - DEBUG=FALSE + - 8080:8080 + volumes: + # The React app runs in the browser, so API_URL in app-config.js must be + # reachable from the host (localhost:5050), not the compose network. + - ./containers/frontend/app-config.js:/usr/share/nginx/html/config/app-config.js:ro + - ./containers/frontend/sites_live_access.json:/usr/share/nginx/html/config/sites_live_access.json:ro depends_on: init_script: condition: service_started