From 1965e22fafcb9cee615dddc71a6385eeb7624d02 Mon Sep 17 00:00:00 2001
From: Samir Boulahtit <samir.boulahtit@wizard.lu>
Date: Mon, 2 Feb 2026 19:53:42 +0100
Subject: [PATCH] fix: pricing section toggle and translation fallbacks
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. Fix monthly/annual toggle:
   - Price suffix now changes between /month and /year using Alpine.js
   - Added € currency symbol to prices

2. Fix language translations:
   - Section title/subtitle now fall back to locale files when CMS
     content doesn't have translations for the selected language
   - Uses cms.platform.pricing.title and .subtitle from locale files

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 .../cms/platform/sections/_pricing.html       | 24 ++++++++++---------
 1 file changed, 13 insertions(+), 11 deletions(-)

diff --git a/app/modules/cms/templates/cms/platform/sections/_pricing.html b/app/modules/cms/templates/cms/platform/sections/_pricing.html
index 1d0713bc..8602b674 100644
--- a/app/modules/cms/templates/cms/platform/sections/_pricing.html
+++ b/app/modules/cms/templates/cms/platform/sections/_pricing.html
@@ -12,23 +12,23 @@
 {% if pricing and pricing.enabled %}
 <section id="pricing" class="py-16 lg:py-24 bg-gray-50 dark:bg-gray-900">
     <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-        {# Section header #}
+        {# Section header - tries CMS content first, falls back to locale files #}
         <div class="text-center mb-12">
-            {% set title = pricing.title.translations.get(lang) or pricing.title.translations.get(default_lang) or '' %}
-            {% if title %}
+            {% set title = (pricing.title.translations.get(lang) if pricing.title and pricing.title.translations else none)
+                        or (pricing.title.translations.get(default_lang) if pricing.title and pricing.title.translations else none)
+                        or _('cms.platform.pricing.title') or 'Simple, Transparent Pricing' %}
             <h2 class="text-3xl md:text-4xl font-bold text-gray-900 dark:text-white mb-4">
                 {{ title }}
             </h2>
-            {% endif %}
 
-            {% if pricing.subtitle and pricing.subtitle.translations %}
-            {% set subtitle = pricing.subtitle.translations.get(lang) or pricing.subtitle.translations.get(default_lang) %}
+            {% set subtitle = (pricing.subtitle.translations.get(lang) if pricing.subtitle and pricing.subtitle.translations else none)
+                           or (pricing.subtitle.translations.get(default_lang) if pricing.subtitle and pricing.subtitle.translations else none)
+                           or _('cms.platform.pricing.subtitle') or '' %}
             {% if subtitle %}
             <p class="text-lg text-gray-600 dark:text-gray-400 max-w-2xl mx-auto">
                 {{ subtitle }}
             </p>
             {% endif %}
-            {% endif %}
         </div>
 
         {# Pricing toggle (monthly/annual) #}
@@ -73,11 +73,13 @@
 
                         {# Price #}
                         <div class="mb-6">
-                            <span class="text-4xl font-extrabold text-gray-900 dark:text-white"
-                                  x-text="annual ? '{{ tier.price_annual or (tier.price_monthly * 10)|int }}' : '{{ tier.price_monthly }}'">
-                                {{ tier.price_monthly }}
+                            <span class="text-4xl font-extrabold text-gray-900 dark:text-white">
+                                €<span x-text="annual ? '{{ tier.price_annual or (tier.price_monthly * 10)|int }}' : '{{ tier.price_monthly }}'">{{ tier.price_monthly }}</span>
+                            </span>
+                            <span class="text-gray-500 dark:text-gray-400"
+                                  x-text="annual ? '{{ _('cms.platform.pricing.per_year') or '/year' }}' : '{{ _('cms.platform.pricing.per_month') or '/month' }}'">
+                                {{ _('cms.platform.pricing.per_month') or '/month' }}
                             </span>
-                            <span class="text-gray-500 dark:text-gray-400">{{ _('cms.platform.pricing.per_month') or '/month' }}</span>
                         </div>
 
                         {# CTA button #}