From 29d942322d24105eb73556e7b6238929f622ae8a Mon Sep 17 00:00:00 2001
From: Samir Boulahtit <samir.boulahtit@wizard.lu>
Date: Wed, 11 Mar 2026 20:08:38 +0100
Subject: [PATCH] feat(loyalty): make logo URL mandatory on program edit forms

Logo URL is required by Google Wallet API for LoyaltyClass creation.
Added validation across all three program edit screens (admin, merchant, store)
with a helpful hint explaining the requirement.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .env.example                                                 | 1 +
 app/modules/loyalty/static/admin/js/loyalty-program-edit.js  | 1 +
 app/modules/loyalty/static/merchant/js/loyalty-settings.js   | 1 +
 app/modules/loyalty/static/shared/js/loyalty-program-form.js | 5 ++++-
 app/modules/loyalty/static/store/js/loyalty-settings.js      | 1 +
 .../loyalty/templates/loyalty/shared/program-form.html       | 5 +++--
 6 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/.env.example b/.env.example
index fecc58f8..ae422cb0 100644
--- a/.env.example
+++ b/.env.example
@@ -224,6 +224,7 @@ R2_BACKUP_BUCKET=orion-backups
 # Get Issuer ID from https://pay.google.com/business/console
 # LOYALTY_GOOGLE_ISSUER_ID=3388000000012345678
 # LOYALTY_GOOGLE_SERVICE_ACCOUNT_JSON=/path/to/service-account.json
+# LOYALTY_DEFAULT_LOGO_URL=https://yourdomain.com/path/to/default-logo.png
 
 # Apple Wallet integration (requires Apple Developer account)
 # LOYALTY_APPLE_PASS_TYPE_ID=pass.com.example.loyalty
diff --git a/app/modules/loyalty/static/admin/js/loyalty-program-edit.js b/app/modules/loyalty/static/admin/js/loyalty-program-edit.js
index fe0f7a9b..fd3b97c7 100644
--- a/app/modules/loyalty/static/admin/js/loyalty-program-edit.js
+++ b/app/modules/loyalty/static/admin/js/loyalty-program-edit.js
@@ -100,6 +100,7 @@ function adminLoyaltyProgramEdit() {
 
             try {
                 const payload = this.buildPayload();
+                if (!payload) { this.saving = false; return; }
 
                 if (this.isNewProgram) {
                     const response = await apiClient.post(
diff --git a/app/modules/loyalty/static/merchant/js/loyalty-settings.js b/app/modules/loyalty/static/merchant/js/loyalty-settings.js
index b2e0bc3c..0cf29711 100644
--- a/app/modules/loyalty/static/merchant/js/loyalty-settings.js
+++ b/app/modules/loyalty/static/merchant/js/loyalty-settings.js
@@ -52,6 +52,7 @@ function merchantLoyaltySettings() {
 
             try {
                 const payload = this.buildPayload();
+                if (!payload) { this.saving = false; return; }
 
                 if (this.isNewProgram) {
                     await apiClient.post('/merchants/loyalty/program', payload);
diff --git a/app/modules/loyalty/static/shared/js/loyalty-program-form.js b/app/modules/loyalty/static/shared/js/loyalty-program-form.js
index f9cda4be..53244db6 100644
--- a/app/modules/loyalty/static/shared/js/loyalty-program-form.js
+++ b/app/modules/loyalty/static/shared/js/loyalty-program-form.js
@@ -98,7 +98,10 @@ function createProgramFormMixin() {
             if (!payload.minimum_purchase_cents) payload.minimum_purchase_cents = null;
             if (!payload.card_name) payload.card_name = null;
             if (!payload.card_secondary_color) payload.card_secondary_color = null;
-            if (!payload.logo_url) payload.logo_url = null;
+            if (!payload.logo_url) {
+                this.error = 'Logo URL is required for wallet integration.';
+                return null;
+            }
             if (!payload.hero_image_url) payload.hero_image_url = null;
             if (!payload.terms_text) payload.terms_text = null;
             if (!payload.privacy_url) payload.privacy_url = null;
diff --git a/app/modules/loyalty/static/store/js/loyalty-settings.js b/app/modules/loyalty/static/store/js/loyalty-settings.js
index 3cd6efa9..711878f6 100644
--- a/app/modules/loyalty/static/store/js/loyalty-settings.js
+++ b/app/modules/loyalty/static/store/js/loyalty-settings.js
@@ -82,6 +82,7 @@ function loyaltySettings() {
 
             try {
                 const payload = this.buildPayload();
+                if (!payload) { this.saving = false; return; }
 
                 let response;
                 if (this.isNewProgram) {
diff --git a/app/modules/loyalty/templates/loyalty/shared/program-form.html b/app/modules/loyalty/templates/loyalty/shared/program-form.html
index db561671..510b60a2 100644
--- a/app/modules/loyalty/templates/loyalty/shared/program-form.html
+++ b/app/modules/loyalty/templates/loyalty/shared/program-form.html
@@ -226,9 +226,10 @@
             </div>
         </div>
         <div>
-            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Logo URL</label>
-            <input type="url" x-model="settings.logo_url" maxlength="500" placeholder="https://..."
+            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Logo URL <span class="text-red-500">*</span></label>
+            <input type="url" x-model="settings.logo_url" maxlength="500" placeholder="https://..." required
                    class="w-full px-4 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300">
+            <p class="mt-1 text-xs text-gray-500 dark:text-gray-400">Required for Google Wallet integration. Must be a publicly accessible image URL (PNG or JPG).</p>
         </div>
         <div>
             <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Hero Image URL</label>