second flow

src/screens/Studio/GeneratingSong.js

@@ -2,14 +2,16 @@ import { useIsFocused } from "@react-navigation/native";
 import { BlurView } from "expo-blur";
 import moment from "moment";
 import React, { useEffect, useMemo, useRef, useState } from "react";
-import { Alert, Image, Platform, Text, View } from "react-native";
+import { Image, Platform, Text, View } from "react-native";
 import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
 import { responsiveHeight } from "react-native-responsive-dimensions";
 import { ai, background } from "../../assets";
+import AppAlert from "../../components/Alert";
 import GradientButton from "../../components/GradientButton";
 import MusicLandHeader from "../../components/MusicLandHeader";
 import ProgressBar from "../../components/ProgressBar";
 import firebase, { projectsRef } from "../../config/firebase";
+import { isWeb } from "../../hooks/useLayoutType";
 import Page from "../../layouts/Page";
 import { Routes } from "../../navigation";
 import { navigate } from "../../navigation/NavigationService";
@@ -36,7 +38,7 @@ const GeneratingSong = () => {
     const totalMs = 8 * 60 * 1000;
     const clearTimer = () => {
       if (progressTimerRef.current) {
-        clearInterval(progressTimerRef.current);
+        global.clearInterval(progressTimerRef.current);
         progressTimerRef.current = null;
       }
     };
@@ -80,7 +82,7 @@ const GeneratingSong = () => {
 
     update();
     clearTimer();
-    progressTimerRef.current = setInterval(update, 1000);
+    progressTimerRef.current = global.setInterval(update, 1000);
     return () => clearTimer();
   }, [selectedProject?.musicStatus, selectedProject?.generationStartAt]);
 
@@ -163,11 +165,11 @@ const GeneratingSong = () => {
       .catch(() => {})
       .finally(() => {
         // Keep locked while status transitions to GENERATING; will be prevented by guards
-        setTimeout(() => {
+        global.setTimeout(() => {
           callingRef.current = false;
         }, 500);
       });
-  }, []);
+  }, [startMusicGeneration]);
 
   // Trigger generation only when focused; ask once while idle
   useEffect(() => {
@@ -183,7 +185,7 @@ const GeneratingSong = () => {
 
     if (titleOk && isIdle && !askedRef.current) {
       askedRef.current = true;
-      Alert.alert("Attention", "Une génération va être lancée. Continuer ?", [
+      AppAlert("Attention", "Une génération va être lancée. Continuer ?", [
         {
           text: "Non",
           style: "cancel",
@@ -194,7 +196,12 @@ const GeneratingSong = () => {
         { text: "Oui", onPress: () => startMusicGenerationOnce() },
       ]);
     }
-  }, [isFocused, selectedProject?.title, selectedProject?.musicStatus]);
+  }, [
+    isFocused,
+    selectedProject?.title,
+    selectedProject?.musicStatus,
+    startMusicGenerationOnce,
+  ]);
 
   return (
     <Page headerType="NONE" backgroundImg={background.studioBG2}>
@@ -227,7 +234,11 @@ const GeneratingSong = () => {
           >
             <Image
               source={ai.theo}
-              style={{ width: "100%", height: "100%", right: -10 }}
+              style={{
+                width: "100%",
+                height: isWeb ? 300 : "100%",
+                right: -10,
+              }}
               resizeMode="contain"
             />
           </View>