chore: wire up django and streamlit in an environment-dependent way

the django and streamlit apps are now wired up in a way that works
both for a local dev environment as well as a Cloud deployment.

Author: lalver1

copilot/web/manifest.yml

@@ -10,9 +10,9 @@ type: Load Balanced Web Service
 http:
   # Requests to this path will be forwarded to your service.
   # To match all requests you can use the "/" path.
-  path: '/'
+  path: "/"
   # You can specify a custom health check path. The default is "/".
-  healthcheck: '/healthcheck'
+  healthcheck: "/healthcheck"
 
 # Configuration for your containers and service.
 image:
@@ -23,24 +23,24 @@ image:
   # Port exposed through your container to route traffic to it.
   port: 8000
 
-cpu: 256       # Number of CPU units for the task.
-memory: 512    # Amount of memory in MiB used by the task.
-platform: linux/x86_64  # See https://aws.github.io/copilot-cli/docs/manifest/lb-web-service/#platform
-count: 1       # Number of tasks that should be running in your service.
-exec: true     # Enable running commands in your container.
+cpu: 256 # Number of CPU units for the task.
+memory: 512 # Amount of memory in MiB used by the task.
+platform: linux/x86_64 # See https://aws.github.io/copilot-cli/docs/manifest/lb-web-service/#platform
+count: 1 # Number of tasks that should be running in your service.
+exec: true # Enable running commands in your container.
 network:
   connect: true # Enable Service Connect for intra-environment traffic between services.
 
 # storage:
-  # readonly_fs: true       # Limit to read-only access to mounted root filesystems.
+# readonly_fs: true       # Limit to read-only access to mounted root filesystems.
 
 # Optional fields for more advanced use-cases.
 #
-#variables:                    # Pass environment variables as key value pairs.
-#  LOG_LEVEL: info
+variables: # Pass environment variables as key value pairs.
+  STREAMLIT_HOST: streamlit.local
 
-secrets:                      # Pass secrets from AWS Systems Manager (SSM) Parameter Store.
- DJANGO_ALLOWED_HOSTS: /pems/web/DJANGO_ALLOWED_HOSTS  # The key is the name of the environment variable, the value is the name of the SSM parameter.
+secrets: # Pass secrets from AWS Systems Manager (SSM) Parameter Store.
+  DJANGO_ALLOWED_HOSTS: /pems/web/DJANGO_ALLOWED_HOSTS # The key is the name of the environment variable, the value is the name of the SSM parameter.
 
 # You can override any of the values defined above by environment.
 #environments:

pems/core/context_processors.py

@@ -3,9 +3,16 @@
 """
 
 from pems import __version__
+from django.conf import settings
 
 
 def pems_version(request):
     """Context processor adds information about the PeMS application's version."""
 
     return {"pems_version": __version__}
+
+
+def streamlit_host(request):
+    """Context processor to add the Streamlit host URL part to the context."""
+
+    return {"streamlit_host": settings.STREAMLIT_HOST}

pems/districts/templates/districts/district.html

@@ -12,7 +12,8 @@ <h2>Form</h2>
     </div>
     <div class="row" style="min-height: 450px;">
         <div class="col-lg-12 border">
-            <iframe class="streamlit-app" src="http://localhost:8501/stations--stations?embed=true&district_number={{ current_district.number }}">
+            <iframe class="streamlit-app"
+                    src="http://{{ streamlit_host }}:8501/stations--stations?embed=true&district_number={{ current_district.number }}">
             </iframe>
         </div>
 

pems/districts/templates/districts/index.html

@@ -25,10 +25,9 @@ <h2>Chart</h2>
                     </div>
                     <div class="row" style="min-height: 450px;">
                         <div class="col-lg-12 border">
-                            <iframe class="streamlit-app" src="http://localhost:8501/stations--stations?embed=true">
+                            <iframe class="streamlit-app" src="http://{{ streamlit_host }}:8501/stations--stations?embed=true">
                             </iframe>
                         </div>
-
                     </div>
                 </div>
             {% endblock districts-content %}

pems/settings.py

@@ -61,6 +61,7 @@ def _filter_empty(ls):
                 "django.contrib.auth.context_processors.auth",
                 "django.contrib.messages.context_processors.messages",
                 "pems.core.context_processors.pems_version",
+                "pems.core.context_processors.streamlit_host",
             ],
         },
     },
@@ -138,3 +139,6 @@ def _filter_empty(ls):
 # https://docs.djangoproject.com/en/5.1/ref/settings/#default-auto-field
 
 DEFAULT_AUTO_FIELD = "django.db.models.BigAutoField"
+
+# Streamlit settings
+STREAMLIT_HOST = os.environ.get("STREAMLIT_HOST", "localhost")

pems/streamlit_sample/templates/streamlit_sample/index.html

@@ -1,6 +1,4 @@
 <h1>Streamlit inside Django</h1>
 
-<iframe
-    src="http://localhost:8501/sample--bikeshare?embed=true"
-    style="height: 100%; width: 100%;">
+<iframe src="http://{{ streamlit_host }}:8501/sample--bikeshare?embed=true" style="height: 100%; width: 100%;">
 </iframe>

tests/pytest/pems/core/test_context_processors.py

@@ -0,0 +1,11 @@
+import pytest
+from pems.core.context_processors import streamlit_host
+
+
+@pytest.mark.parametrize("host_name", ["localhost", "other.host"])
+def test_streamlit_host(app_request, settings, host_name):
+    """Test that the streamlit_host context processor returns the correct host."""
+    settings.STREAMLIT_HOST = host_name
+    context = streamlit_host(app_request)
+
+    assert context["streamlit_host"] == host_name