feat: pass URLs through CDN (#549)

templates/docs/document.html

@@ -123,7 +123,7 @@ <h4 class="p-table-of-contents__header">On this page</h4>
 <div class="l-docs__main u-text-max-width">
   <main class="u-fixed-width">
     <div class="p-strip is-shallow" style="overflow: visible;">
-      {{ document.body_html | safe }}
+      {{ document.body_html | safe | serve_assets }}
     </div>
     <div class="p-notification--information">
       <div class="p-notification__content">

webapp/app.py

@@ -131,3 +131,20 @@ def inject_utilities():
 @app.context_processor
 def inject_today_date():
     return {"current_year": datetime.date.today().year}
+
+
+S3_BUCKET_URL = "https://discourse-charmhub-io.s3.eu-west-2.amazonaws.com"
+CDN_PREFIX = "https://res.cloudinary.com/canonical/image/fetch/f_auto,q_auto/"
+
+
+@app.template_filter("serve_assets")
+def serve_assets(text):
+    """
+    This is a template filter that prefixes assets with the CDN so that they are serves through it.
+    Purpose:
+    This is partially a workaround for the fact that google chrome flags the S3 bucket URL as a lookalike for charmhub.io and prompts the user to visit the latter.
+
+    # noqa: E501
+    """
+
+    return text.replace(S3_BUCKET_URL, CDN_PREFIX + S3_BUCKET_URL)