feat: per-page SumUp admin UI and update_sumup route (Phase 3)

- Replace SumUp placeholder with real form for merchant code, API key, prefix
- Add PUT /admin/sumup/ route to save per-page SumUp credentials
- Pass sumup_configured/merchant_code/checkout_prefix to template context
- SumUp form only shown when calendar or market feature is enabled

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

bp/post/admin/routes.py

@@ -28,14 +28,25 @@ def register():
     # Load features for page admin
     post = (g.post_data or {}).get("post", {})
     features = {}
+    sumup_configured = False
+    sumup_merchant_code = ""
+    sumup_checkout_prefix = ""
     if post.get("is_page"):
         pc = (await g.s.execute(
             sa_select(PageConfig).where(PageConfig.post_id == post["id"])
         )).scalar_one_or_none()
         if pc:
             features = pc.features or {}
+            sumup_configured = bool(pc.sumup_api_key)
+            sumup_merchant_code = pc.sumup_merchant_code or ""
+            sumup_checkout_prefix = pc.sumup_checkout_prefix or ""
 
-    ctx = {"features": features}
+    ctx = {
+        "features": features,
+        "sumup_configured": sumup_configured,
+        "sumup_merchant_code": sumup_merchant_code,
+        "sumup_checkout_prefix": sumup_checkout_prefix,
+    }
 
     # Determine which template to use based on request type
     if not is_htmx_request():
@@ -104,6 +115,53 @@ def register():
         "_types/post/admin/_features_panel.html",
         features=features,
         post=post,
+        sumup_configured=bool(pc.sumup_api_key),
+        sumup_merchant_code=pc.sumup_merchant_code or "",
+        sumup_checkout_prefix=pc.sumup_checkout_prefix or "",
+    )
+    return await make_response(html)
+
+  @bp.put("/admin/sumup/")
+  @require_admin
+  async def update_sumup(slug: str):
+    """Update PageConfig SumUp credentials for a page."""
+    from models.page_config import PageConfig
+    from sqlalchemy import select as sa_select
+    from quart import jsonify
+
+    post = g.post_data.get("post")
+    if not post or not post.get("is_page"):
+        return jsonify({"error": "This is not a page."}), 400
+
+    post_id = post["id"]
+
+    pc = (await g.s.execute(
+        sa_select(PageConfig).where(PageConfig.post_id == post_id)
+    )).scalar_one_or_none()
+    if pc is None:
+        return jsonify({"error": "PageConfig not found for this page."}), 404
+
+    form = await request.form
+    merchant_code = (form.get("merchant_code") or "").strip()
+    api_key = (form.get("api_key") or "").strip()
+    checkout_prefix = (form.get("checkout_prefix") or "").strip()
+
+    pc.sumup_merchant_code = merchant_code or None
+    pc.sumup_checkout_prefix = checkout_prefix or None
+    # Only update API key if non-empty (allows updating other fields without re-entering key)
+    if api_key:
+        pc.sumup_api_key = api_key
+
+    await g.s.flush()
+
+    features = pc.features or {}
+    html = await render_template(
+        "_types/post/admin/_features_panel.html",
+        features=features,
+        post=post,
+        sumup_configured=bool(pc.sumup_api_key),
+        sumup_merchant_code=pc.sumup_merchant_code or "",
+        sumup_checkout_prefix=pc.sumup_checkout_prefix or "",
     )
     return await make_response(html)
 

templates/_types/post/admin/_features_panel.html

@@ -41,9 +41,72 @@
     </label>
   </form>
 
-  {# Phase 3: SumUp connection placeholder #}
+  {# SumUp credentials — shown when calendar or market is enabled #}
+  {% if features.get('calendar') or features.get('market') %}
   <div class="mt-4 pt-4 border-t border-stone-100">
-    <h4 class="text-sm font-medium text-stone-500">SumUp Payment</h4>
+    <h4 class="text-sm font-medium text-stone-700">
-    <p class="text-xs text-stone-400 mt-1">Payment connection coming soon.</p>
+      <i class="fa fa-credit-card text-purple-600 mr-1"></i>
+      SumUp Payment
+    </h4>
+    <p class="text-xs text-stone-400 mt-1 mb-3">
+      Configure per-page SumUp credentials. Leave blank to use the global merchant account.
+    </p>
+
+    <form
+      hx-put="{{ url_for('blog.post.admin.update_sumup', slug=post.slug)|host }}"
+      hx-target="#features-panel"
+      hx-swap="outerHTML"
+      class="space-y-3"
+    >
+      <div>
+        <label class="block text-xs font-medium text-stone-600 mb-1">Merchant Code</label>
+        <input
+          type="text"
+          name="merchant_code"
+          value="{{ sumup_merchant_code }}"
+          placeholder="e.g. ME4J6100"
+          class="w-full px-3 py-1.5 text-sm border border-stone-300 rounded focus:ring-purple-500 focus:border-purple-500"
+        >
+      </div>
+
+      <div>
+        <label class="block text-xs font-medium text-stone-600 mb-1">API Key</label>
+        <input
+          type="password"
+          name="api_key"
+          value=""
+          placeholder="{{ '••••••••' if sumup_configured else 'sup_sk_...' }}"
+          class="w-full px-3 py-1.5 text-sm border border-stone-300 rounded focus:ring-purple-500 focus:border-purple-500"
+        >
+        {% if sumup_configured %}
+        <p class="text-xs text-stone-400 mt-0.5">Key is set. Leave blank to keep current key.</p>
+        {% endif %}
+      </div>
+
+      <div>
+        <label class="block text-xs font-medium text-stone-600 mb-1">Checkout Reference Prefix</label>
+        <input
+          type="text"
+          name="checkout_prefix"
+          value="{{ sumup_checkout_prefix }}"
+          placeholder="e.g. ROSE-"
+          class="w-full px-3 py-1.5 text-sm border border-stone-300 rounded focus:ring-purple-500 focus:border-purple-500"
+        >
+      </div>
+
+      <button
+        type="submit"
+        class="px-4 py-1.5 text-sm font-medium text-white bg-purple-600 rounded hover:bg-purple-700 focus:ring-2 focus:ring-purple-500"
+      >
+        Save SumUp Settings
+      </button>
+
+      {% if sumup_configured %}
+      <span class="ml-2 text-xs text-green-600">
+        <i class="fa fa-check-circle"></i> Connected
+      </span>
+      {% endif %}
+    </form>
   </div>
+  {% endif %}
 </div>