end of lyricks and misic generation

src/screens/Writing/Lyrics.js

@@ -23,25 +23,35 @@ const Lyrics = ({ navigation }) => {
   const { setIsLoading } = useMinuit();
 
   const initial = useMemo(() => {
-    if (!lyricsData || !lyricsData?.success) return {};
     const title = lyricsData?.title || "";
-    const sections = Array.isArray(lyricsData?.lyrics) ? lyricsData.lyrics : [];
-    const couplets = sections
-      .filter((s) => (s?.type || "").toLowerCase().includes("couplet"))
-      .map((s) => s?.lyrics || "");
-    const refrains = sections
-      .filter((s) => (s?.type || "").toLowerCase().includes("refrain"))
-      .map((s) => s?.lyrics || "");
-    return {
-      title,
-      couplet: couplets.join("\n\n"),
-      refrain: refrains.join("\n\n"),
-    };
-  }, [lyricsData]);
+    const aiSections = Array.isArray(lyricsData?.lyrics) ? lyricsData.lyrics : [];
+    // Respecter l'ordre de la structure choisie si disponible
+    const targetStructure = Array.isArray(config?.structure)
+      ? config.structure.map((t) => (t || "").toLowerCase())
+      : null;
+    if (aiSections.length && targetStructure && aiSections.length === targetStructure.length) {
+      return { title, sections: aiSections.map((s) => ({ type: (s?.type || "").toLowerCase(), lyrics: s?.lyrics || "" })) };
+    }
+    // Sinon, créer à partir de la structure
+    if (targetStructure && targetStructure.length) {
+      return {
+        title,
+        sections: targetStructure.map((t) => ({ type: t, lyrics: "" })),
+      };
+    }
+    // Fallback vide
+    return { title, sections: [] };
+  }, [lyricsData, config]);
 
   const [titleValue, setTitleValue] = useState(initial.title || "");
-  const [coupletValue, setCoupletValue] = useState(initial.couplet || "");
-  const [refrainValue, setRefrainValue] = useState(initial.refrain || "");
+  const [sections, setSections] = useState(initial.sections || []);
+  const setSectionAt = (index, value) => {
+    setSections((prev) => {
+      const next = [...prev];
+      if (next[index]) next[index] = { ...next[index], lyrics: value };
+      return next;
+    });
+  };
 
   // Plus d'appel direct à la cloud function ici: on retourne à l'étape précédente
   const regenerate = useCallback(() => {
@@ -70,10 +80,10 @@ const Lyrics = ({ navigation }) => {
       const user = firebase.auth().currentUser;
       const payload = {
         title: titleValue?.trim() || "",
-        lyrics: {
-          couplet: coupletValue || "",
-          refrain: refrainValue || "",
-        },
+        lyrics: (sections || []).map((s) => ({
+          type: (s?.type || "").toLowerCase(),
+          lyrics: s?.lyrics || "",
+        })),
         config: sanitize(config),
         selections: sanitize(selections),
         userId: user ? user.uid : null,
@@ -88,14 +98,7 @@ const Lyrics = ({ navigation }) => {
     } finally {
       await setIsLoading(false);
     }
-  }, [
-    titleValue,
-    coupletValue,
-    refrainValue,
-    config,
-    selections,
-    setIsLoading,
-  ]);
+  }, [titleValue, sections, config, selections, setIsLoading]);
 
   return (
     <Page headerType="NONE">
@@ -124,40 +127,25 @@ const Lyrics = ({ navigation }) => {
               value={titleValue}
               setValue={setTitleValue}
             />
-            <View
-              style={{
-                height: 45,
-                justifyContent: "center",
-                backgroundColor: "#00000080",
-                borderRadius: 14,
-                paddingHorizontal: 12,
-                marginTop: 20,
-              }}
-            >
-              <Text
-                style={{
-                  fontSize: 16,
-                  color: Palette.white,
-                  fontFamily: FONT_FAMILY.InterRegular,
-                }}
-              >
-                Introduction instrumentale longue
-              </Text>
-            </View>
-            <CustomInput
-              label="Couplet"
-              placeholder="Couplet"
-              height={225}
-              value={coupletValue}
-              setValue={setCoupletValue}
-            />
-            <CustomInput
-              label="Refrain"
-              placeholder="Refrain"
-              height={170}
-              value={refrainValue}
-              setValue={setRefrainValue}
-            />
+            {sections.map((s, idx) => {
+              // Calculer l'index humain par type
+              const type = (s?.type || "").toLowerCase();
+              const countBefore = sections
+                .slice(0, idx)
+                .filter((x) => (x?.type || "").toLowerCase() === type).length;
+              const labelBase = type === "refrain" ? "Refrain" : "Couplet";
+              const label = `${labelBase} ${countBefore + 1}`;
+              return (
+                <CustomInput
+                  key={idx}
+                  label={label}
+                  placeholder={labelBase}
+                  height={type === "refrain" ? 170 : 225}
+                  value={s?.lyrics || ""}
+                  setValue={(val) => setSectionAt(idx, val)}
+                />
+              );
+            })}
           </ScrollView>
         </ItemContainer>
       </View>