fix of the day, payment + sub + music generation

src/screens/Studio/GeneratingSong.js

@@ -30,6 +30,16 @@ const GeneratingSong = () => {
   const askedRef = useRef(false);
   const callingRef = useRef(false);
   const localStartRef = useRef(null);
+  const errorAlertShownRef = useRef(false);
+
+  const isFailed = selectedProject?.musicStatus === "FAILED";
+  const musicErrorMessage =
+    selectedProject?.musicError?.message ||
+    selectedProject?.musicError?.status ||
+    "Une erreur est survenue lors de la génération.";
+  const hasRefund =
+    selectedProject?.musicCreditsRefunded === true ||
+    typeof selectedProject?.musicCreditsRefundOrderId === "string";
 
   // project loaded from provider
 
@@ -249,6 +259,28 @@ const GeneratingSong = () => {
     startMusicGenerationOnce,
   ]);
 
+  useEffect(() => {
+    if (isFailed) {
+      if (!errorAlertShownRef.current) {
+        errorAlertShownRef.current = true;
+        const refundNotice = hasRefund
+          ? "\n\nTes crédits ont été automatiquement remboursés."
+          : "";
+        AppAlert("Génération échouée", `${musicErrorMessage}${refundNotice}`);
+      }
+    } else if (selectedProject?.musicStatus === "GENERATING") {
+      errorAlertShownRef.current = false;
+    }
+  }, [
+    hasRefund,
+    isFailed,
+    musicErrorMessage,
+    selectedProject?.musicStatus,
+  ]);
+
+  const progressStatus = isFailed ? "error" : "default";
+  const progressLabel = isFailed ? "Erreur" : `${progress}%`;
+
   return (
     <Page headerType="NONE" backgroundImg={background.studioBG2}>
       <MusicLandHeader
@@ -303,17 +335,37 @@ const GeneratingSong = () => {
                     Ta musique est{"\n"}en cours de création
                   </Text>
                   <View style={{ alignItems: "center", gap: 16 }}>
-                    <ProgressBar gradient progress={progress} />
+                    <ProgressBar
+                      gradient
+                      progress={progress}
+                      status={progressStatus}
+                    />
                     <Text
                       style={{
                         fontSize: 14,
-                        color: Palette.white,
+                        color: isFailed ? Palette.red : Palette.white,
                         fontFamily: FONT_FAMILY.InterRegular,
                       }}
                     >
-                      {progress}%
+                      {progressLabel}
                     </Text>
                   </View>
+                  {isFailed ? (
+                    <Text
+                      style={{
+                        fontSize: 13,
+                        color: Palette.red,
+                        fontFamily: FONT_FAMILY.InterRegular,
+                        textAlign: "center",
+                        lineHeight: 20,
+                      }}
+                    >
+                      {musicErrorMessage}
+                      {hasRefund
+                        ? "\nTes crédits ont été remboursés automatiquement."
+                        : "\nTu peux revenir en arrière pour relancer la génération."}
+                    </Text>
+                  ) : null}
                   <GradientButton
                     title={
                       selectedProject?.musicStatus === "GENERATED"