player, song generation again, home and design fixes

src/screens/Studio/ComposeSong.web.js

@@ -5,6 +5,7 @@ import React, {
   useRef,
   useState,
 } from "react";
+import { useRoute } from "@react-navigation/native";
 import { Dimensions, FlatList, Modal, Text, View } from "react-native";
 import { background } from "../../assets";
 import BorderGradientButton from "../../components/BorderGradientButton";
@@ -38,6 +39,7 @@ const ComposeSong = () => {
   const [progress, setProgress] = useState(18);
   const [parentLayout, setParentLayout] = useState(null);
   const containerWidth = parentLayout?.width || windowWidth || 1;
+  const route = useRoute();
   const {
     selectedProjectId,
     selectedProject,
@@ -53,6 +55,7 @@ const ComposeSong = () => {
   const [isConfirmVisible, setIsConfirmVisible] = useState(false);
   const [isProcessingConfirmation, setIsProcessingConfirmation] =
     useState(false);
+  const isRegenerationFlow = route?.params?.isRegeneration === true;
 
   const coinBalance = useMemo(() => {
     const value = currentUserData?.coins;
@@ -164,6 +167,11 @@ const ComposeSong = () => {
     [containerWidth]
   );
 
+  const handleCancelGeneration = () => {
+    setIsConfirmVisible(false);
+    navigate(Routes.SongReady);
+  };
+
   const persistMusicConfig = useCallback(async () => {
     try {
       if (!selectedProjectId) return;
@@ -304,11 +312,19 @@ const ComposeSong = () => {
           />
         </View>
         {selectedIndex !== steps.length && (
-          <GradientButton
-            title={selectedIndex === steps.length - 1 ? "Générer" : "Suivant"}
-            onPress={onPressNext}
-            disabled={!isStepValid}
-          />
+          <View style={{ gap: 12 }}>
+            {selectedIndex === steps.length - 1 && isRegenerationFlow && (
+              <BorderGradientButton
+                title="Annuler la nouvelle génération"
+                onPress={handleCancelGeneration}
+              />
+            )}
+            <GradientButton
+              title={selectedIndex === steps.length - 1 ? "Générer" : "Suivant"}
+              onPress={onPressNext}
+              disabled={!isStepValid}
+            />
+          </View>
         )}
       </View>
       <Modal