Add UTM tracking

app.py

@@ -23,6 +23,14 @@ POLL_MAX_SECONDS = 120
 
 
 
+
+# ============ UTM Tracking ============
+UTM_CAMPAIGN = "upscaler_comparison"
+
+def add_utm(base_url: str, content: str) -> str:
+    separator = "&" if "?" in base_url else "?"
+    return f"{base_url}{separator}utm_source=huggingface&utm_medium=space&utm_campaign={UTM_CAMPAIGN}&utm_content={content}"
+
 # ============ CSS ============
 CUSTOM_CSS = """
 /* ===== Base Styles ===== */
@@ -385,7 +393,7 @@ with gr.Blocks(css=CUSTOM_CSS, title="Image Upscaler Comparison") as demo:
         <div class="hero-container">
             <div class="hero-badge">WAVESPEED AI</div>
             <h1 class="hero-title">Image Upscaler Comparison</h1>
-            <p class="hero-desc">Compare Image Upscaler vs Ultimate Upscaler side by side. Try on <a href="https://wavespeed.ai" target="_blank" style="color: #8b5cf6; text-decoration: none; font-weight: 600;">wavespeed</a></p>
+            <p class="hero-desc">Compare Image Upscaler vs Ultimate Upscaler side by side. Try on <a href="{add_utm(\'https://wavespeed.ai\', \'hero_link\')}" target="_blank" style="color: #8b5cf6; text-decoration: none; font-weight: 600;">wavespeed</a></p>
         </div>
     """)
 
@@ -399,7 +407,7 @@ with gr.Blocks(css=CUSTOM_CSS, title="Image Upscaler Comparison") as demo:
                     <svg width="20" height="20" fill="#06b6d4" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M18 8a6 6 0 01-7.743 5.743L10 14l-1 1-1 1H6v2H2v-4l4.257-4.257A6 6 0 1118 8zm-6-4a1 1 0 100 2 2 2 0 012 2 1 1 0 102 0 4 4 0 00-4-4z" clip-rule="evenodd"/></svg>
                     API Key
                 </span>
-                <a href="https://wavespeed.ai/accesskey" target="_blank" class="get-key-btn">Get API Key</a>
+                <a href="{add_utm(\'https://wavespeed.ai/accesskey\', \'api_key_button\')}" target="_blank" class="get-key-btn">Get API Key</a>
             </div>
         """)
         api_key_input = gr.Textbox(
@@ -440,7 +448,7 @@ with gr.Blocks(css=CUSTOM_CSS, title="Image Upscaler Comparison") as demo:
         <div class="cta-container">
             <h3 class="cta-title">Want More Features?</h3>
             <p class="cta-desc">Higher resolutions, batch processing, and 700+ AI models</p>
-            <a href="https://wavespeed.ai/models" target="_blank" class="cta-btn">
+            <a href="{add_utm(\'https://wavespeed.ai/models\', \'cta_button\')}" target="_blank" class="cta-btn">
                 Explore WaveSpeed.ai
             </a>
         </div>