Improves error handling and adds CMF alert

Refactors error handling to prioritize translated error messages, ensuring a more user-friendly experience. It introduces a default error message for cases where specific translations are unavailable.

Additionally, it adds an alert on the artist premium page for CMF members, informing them about their existing benefits and providing contact information for accessing their codes.

composables/utils/useAp2iErrorHandler.ts

@@ -12,7 +12,7 @@ export const useAp2iErrorHandler = () => {
    * @returns Processed error message
    */
   const processApiError = (error: unknown): string => {
-    let errorMessage =
+    const defaultErrorMessage =
       "Une erreur s'est produite. Veuillez réessayer plus tard ou nous contacter directement."
 
     // Try to extract the specific error message from the API response
@@ -27,7 +27,7 @@ export const useAp2iErrorHandler = () => {
       if (errorData.detail) {
         // Check if it's the specific error about organization already existing
         const organizationExistsRegex =
-          /Handling ".*" failed: An organization named '(.+)' already exists in (.+)/
+          /An organization named '(.+)' already exists in (.+)/
         const match = errorData.detail.match(organizationExistsRegex)
 
         if (match) {
@@ -35,17 +35,17 @@ export const useAp2iErrorHandler = () => {
           const organizationName = match[1]
           const cityName = match[2]
           const translationKey =
-            "An organization named '%s' already exists in %s"
+            "An organization named '{0}' already exists in {1}"
 
           const translatedMessage = $i18n.t(translationKey, [
             organizationName,
             cityName,
           ])
-          errorMessage = translatedMessage as string
-        } else {
-          // For other errors, use translation if available, otherwise use the original message
-          if (!errorData.detail) return errorData.detail
+          console.log(translatedMessage, organizationName, cityName)
 
+          // Return only the translated message
+          return translatedMessage as string
+        } else {
           // Remove the "Handling ... failed:" part if present
           let cleanedDetail = errorData.detail
           const handlingFailedRegex = /Handling ".*" failed: (.*)/
@@ -55,12 +55,21 @@ export const useAp2iErrorHandler = () => {
             cleanedDetail = handlingMatch[1]
           }
 
-          errorMessage = ($i18n.t(cleanedDetail) || cleanedDetail) as string
+          // Check if a translation exists for this error
+          const translatedMessage = $i18n.t(cleanedDetail)
+
+          // If we have a valid translation (not the same as the key), return only the translation
+          if (translatedMessage !== cleanedDetail) {
+            return translatedMessage as string
+          }
+
+          // Otherwise return the original error message
+          return cleanedDetail
         }
       }
     }
 
-    return errorMessage
+    return defaultErrorMessage
   }
 
   return {

lang/fr.json

@@ -9,6 +9,6 @@
   "OTHER": "Autre",
   "Invalid phone number": "Numéro de téléphone invalide",
   "Request expired: submission date is more than 15 minutes old": "Requête expirée : la date de soumission date de plus de 15 minutes",
-  "An organization named '%s' already exists in %s": "Une organisation nommée '{0}' existe déjà à {1}",
+  "An organization named '{0}' already exists in {1}": "Une organisation nommée '{0}' existe déjà à {1}",
   "Invalid request status": "Statut de la requête invalide"
 }

pages/shop/try/artist-premium.vue

@@ -65,6 +65,25 @@
                 </p>
               </div>
 
+              <v-alert
+                type="info"
+                variant="tonal"
+                border="start"
+                class="mb-4"
+                density="comfortable"
+                title="Vous êtes adhérents à la Confédération Musicale de France ? Et si on vous disait que vous l'aviez déjà..."
+              >
+                Dans le cadre de votre adhésion, vous bénéficiez de la version
+                Opentalent Artist Standard, et de conditions privilégiées pour
+                la version Artist Premium. Contactez votre fédération pour
+                obtenir vos codes d'accès.
+                <div class="mt-2">
+                  <a href="https://www.cmf-musique.org/contact/" target="_blank"
+                    >Je souhaite obtenir mon code d'accès</a
+                  >
+                </div>
+              </v-alert>
+
               <v-form
                 ref="form"
                 validate-on="submit lazy"
@@ -475,7 +494,6 @@ import {
 } from '~/services/utils/stringUtils'
 
 const router = useRouter()
-const i18n = useI18n()
 
 const form: Ref<HTMLElement | null> = ref(null)
 
@@ -724,12 +742,13 @@ const submit = async (): Promise<void> => {
   } catch (e) {
     console.error('Error submitting trial request:', e)
 
-    errorMsg.value =
-      "Une erreur s'est produite lors de l'activation de votre essai. Veuillez réessayer plus tard ou nous contacter directement."
-
     // Process the error message using the common error handler
     const processedError = processApiError(e)
-    errorMsg.value += '\n' + i18n.t(processedError)
+
+    // Set the error message directly from the processed error
+    // The processApiError function now returns either a translated message
+    // or a generic error message as appropriate
+    errorMsg.value = processedError
   }
 }
 
@@ -826,8 +845,16 @@ h1 {
   .error {
     color: var(--warning-color);
     width: 80%;
-    margin: 0 auto 2em;
+    margin: 0.7em auto 2em;
     text-align: center;
+    font-size: 1.05rem;
+    font-weight: 600;
+    border: 2px solid var(--warning-color);
+    border-radius: 4px;
+    padding: 0.5rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
   .legal {