continue flow integartion

src/screens/Writing/CreateLyricsWithAi.js

@@ -1,5 +1,6 @@
 import { View, Dimensions } from "react-native";
-import React, { useRef, useState } from "react";
+import React, { useMemo, useRef, useState } from "react";
+import { useRoute } from "@react-navigation/native";
 import Page from "../../layouts/Page";
 import MusicLandHeader from "../../components/MusicLandHeader";
 import GradientButton from "../../components/GradientButton";
@@ -21,10 +22,100 @@ const { width } = Dimensions.get("window");
 
 const CreateLyricsWithAi = () => {
   const scrollRef = useRef(null);
+  const route = useRoute();
+  const regenerateKey = route?.params?.regenerateKey;
   const [selectedIndex, setSelectedIndex] = useState(0);
   const [progress, setProgress] = useState(16);
   const [parentLayout, setparentLayout] = useState(null);
 
+  // Collected state across steps
+  const [objective, setObjective] = useState(
+    __DEV__ ? "Pour mon entreprise" : null,
+  ); // from Goals list
+  const [otherObjective, setOtherObjective] = useState("");
+  const [context, setContext] = useState(
+    __DEV__
+      ? "L'agence minuit est une agence de développement mobile et web qui accompagnes ses client dans la réalisations de projets divers et variés"
+      : "",
+  );
+  const [emotion, setEmotion] = useState(
+    __DEV__
+      ? {
+          title: "La Joie",
+          description:
+            "expose un bonheur profond, l'émerveillement, la gratitude, satisfaction intense, énergie positive",
+        }
+      : null,
+  ); // { title, description }
+  const [style, setStyle] = useState(__DEV__ ? "Upbeat" : null); // from list
+  const [otherStyle, setOtherStyle] = useState("");
+  const [audience, setAudience] = useState(
+    __DEV__ ? "Aux clients de l'agence minuit" : "",
+  );
+  const [structure, setStructure] = useState(
+    __DEV__ ? "1 couplet, 1 refrain, 1 couplet, 1 refrain" : null,
+  ); // selected structure string
+  const [rhymes, setRhymes] = useState(__DEV__ ? "Avec rimes" : null);
+  const [customStructure, setCustomStructure] = useState(null); // array like ['couplet','refrain']
+
+  const parsedStructure = useMemo(() => {
+    // Parses strings like "1 couplet, 1 refrain, 1 couplet, 1 refrain"
+    try {
+      if (!structure || typeof structure !== "string") return null;
+      const parts = structure.split(",");
+      const result = [];
+      parts.forEach((seg) => {
+        const s = seg.trim().toLowerCase();
+        const coupletMatch = s.match(/(\d+)\s+couplet/);
+        const refrainMatch = s.match(/(\d+)\s+refrain/);
+        if (coupletMatch) {
+          const count = parseInt(coupletMatch[1], 10);
+          for (let i = 0; i < count; i++) result.push("couplet");
+        }
+        if (refrainMatch) {
+          const count = parseInt(refrainMatch[1], 10);
+          for (let i = 0; i < count; i++) result.push("refrain");
+        }
+      });
+      return result.length ? result : null;
+    } catch (e) {
+      return null;
+    }
+  }, [structure]);
+
+  const lyricsConfig = useMemo(() => {
+    return {
+      objective: otherObjective?.trim()
+        ? otherObjective.trim()
+        : objective || undefined,
+      context: context?.trim() ? context.trim() : undefined,
+      emotion:
+        emotion?.title && emotion?.description
+          ? `${emotion.title} : ${emotion.description}`
+          : undefined,
+      style: otherStyle?.trim() ? otherStyle.trim() : style || undefined,
+      audience: audience?.trim() ? audience.trim() : undefined,
+      structure:
+        (customStructure &&
+        parsedStructure &&
+        customStructure.length === parsedStructure.length
+          ? customStructure
+          : parsedStructure) || undefined,
+      rhymes: rhymes || undefined,
+    };
+  }, [
+    objective,
+    otherObjective,
+    context,
+    emotion,
+    style,
+    otherStyle,
+    audience,
+    parsedStructure,
+    rhymes,
+    customStructure,
+  ]);
+
   const onPressNext = () => {
     setSelectedIndex(selectedIndex + 1);
     setProgress(progress + 9);
@@ -77,7 +168,12 @@ const CreateLyricsWithAi = () => {
                 paddingHorizontal: gutters,
               }}
             >
-              <Goals />
+              <Goals
+                selected={objective}
+                setSelected={setObjective}
+                otherObjective={otherObjective}
+                setOtherObjective={setOtherObjective}
+              />
             </View>
             <View
               style={{
@@ -86,7 +182,7 @@ const CreateLyricsWithAi = () => {
                 paddingHorizontal: gutters,
               }}
             >
-              <SpecificityContext />
+              <SpecificityContext context={context} setContext={setContext} />
             </View>
             <View
               style={{
@@ -95,7 +191,7 @@ const CreateLyricsWithAi = () => {
                 paddingHorizontal: gutters,
               }}
             >
-              <EmotionConvey />
+              <EmotionConvey selected={emotion} setSelected={setEmotion} />
             </View>
             <View
               style={{
@@ -104,7 +200,12 @@ const CreateLyricsWithAi = () => {
                 paddingHorizontal: gutters,
               }}
             >
-              <SongStyle />
+              <SongStyle
+                selected={style}
+                setSelected={setStyle}
+                otherStyle={otherStyle}
+                setOtherStyle={setOtherStyle}
+              />
             </View>
             <View
               style={{
@@ -113,7 +214,7 @@ const CreateLyricsWithAi = () => {
                 paddingHorizontal: gutters,
               }}
             >
-              <SongTo />
+              <SongTo audience={audience} setAudience={setAudience} />
             </View>
             <View
               style={{
@@ -122,7 +223,7 @@ const CreateLyricsWithAi = () => {
                 paddingHorizontal: gutters,
               }}
             >
-              <SongStructure />
+              <SongStructure selected={structure} setSelected={setStructure} />
             </View>
             <View
               style={{
@@ -131,7 +232,10 @@ const CreateLyricsWithAi = () => {
                 paddingHorizontal: gutters,
               }}
             >
-              <CustomizeSongStructure />
+              <CustomizeSongStructure
+                baseStructure={parsedStructure || []}
+                onChange={setCustomStructure}
+              />
             </View>
             <View
               style={{
@@ -140,7 +244,7 @@ const CreateLyricsWithAi = () => {
                 paddingHorizontal: gutters,
               }}
             >
-              <Rhymes />
+              <Rhymes selected={rhymes} setSelected={setRhymes} />
             </View>
             <View
               style={{
@@ -149,7 +253,24 @@ const CreateLyricsWithAi = () => {
                 paddingHorizontal: gutters,
               }}
             >
-              <CreatingLyrics active={selectedIndex === 8} />
+              <CreatingLyrics
+                active={selectedIndex === 8}
+                config={lyricsConfig}
+                regenerateKey={regenerateKey}
+                selections={{
+                  objective,
+                  otherObjective,
+                  context,
+                  emotion,
+                  style,
+                  otherStyle,
+                  audience,
+                  structure,
+                  parsedStructure,
+                  customStructure,
+                  rhymes,
+                }}
+              />
             </View>
           </SwiperFlatList>
         </View>

src/screens/Writing/CreatingLyrics.js

@@ -9,9 +9,23 @@ import { FONT_FAMILY } from "../../styles/Fonts";
 import GradientButton from "../../components/GradientButton";
 import { goBack, navigate } from "../../navigation/NavigationService";
 import { Routes } from "../../navigation";
+import firebase from "../../config/firebase";
+import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
 
-const CreatingLyrics = ({ active }) => {
+const CreatingLyrics = ({ active, config, regenerateKey, selections }) => {
   const [progress, setProgress] = useState(0);
+  const [called, setCalled] = useState(false);
+  const [result, setResult] = useState(null);
+  const { setIsLoading } = useMinuit();
+
+  // When asked to regenerate, reset flags so effect runs again
+  useEffect(() => {
+    if (active) {
+      setCalled(false);
+      setResult(null);
+      setProgress(0);
+    }
+  }, [regenerateKey, active]);
 
   useEffect(() => {
     if (active) {
@@ -29,6 +43,39 @@ const CreatingLyrics = ({ active }) => {
     }
   }, [active]);
 
+  useEffect(() => {
+    const run = async () => {
+      try {
+        setCalled(true);
+        await setIsLoading(true);
+        const callable = firebase
+          .functions()
+          .httpsCallable("lyrics-generateLyrics");
+        const { data } = await callable({
+          objective: config?.objective,
+          context: config?.context,
+          emotion: config?.emotion,
+          style: config?.style,
+          audience: config?.audience,
+          structure: config?.structure,
+          rhymes: config?.rhymes,
+        });
+        setResult(data);
+        setProgress(100);
+      } catch (e) {
+        console.log(e);
+      } finally {
+        await setIsLoading(false);
+      }
+    };
+
+    if (active && !called) {
+      run();
+    }
+  }, [active, called, config, setIsLoading]);
+
+  console.log(result);
+
   return (
     <View
       style={{
@@ -113,7 +160,9 @@ const CreatingLyrics = ({ active }) => {
                   width: "80%",
                   alignSelf: "center",
                 }}
-                onPress={() => navigate(Routes.Lyrics)}
+                onPress={() =>
+                  navigate(Routes.Lyrics, { lyricsData: result, config, selections })
+                }
               />
             </View>
           </BlurView>

src/screens/Writing/CustomizeSongStructure.js

@@ -1,16 +1,33 @@
 import { View, Text, StyleSheet, ScrollView } from "react-native";
-import React, { useState } from "react";
+import React, { useMemo, useState } from "react";
 import CreateLyricsHeader from "./components/CreateLyricsHeader";
 import { BlurView } from "expo-blur";
 import { Palette } from "../../styles";
 import { FONT_FAMILY } from "../../styles/Fonts";
 import ItemContainer from "../../components/ItemContainer/ItemContainer";
 import { CUSTOM_SONG_STRUCTURE } from "../../data/data";
-import DragDropTest from "../../components/DragDropTest";
+import SongStructureDragDrop from "../../components/SongStructureDragDrop";
 
-const CustomizeSongStructure = () => {
+// baseStructure: array like ['couplet','refrain',...]
+// onChange: callback that receives array like ['couplet','refrain',...]
+const CustomizeSongStructure = ({ baseStructure = [], onChange }) => {
   const [containerLayout, setContainerLayout] = useState(null);
 
+  const sourceItems = useMemo(() => {
+    // create unique ids for duplicates
+    const counters = { couplet: 0, refrain: 0 };
+    return (baseStructure || []).map((type) => {
+      const key = (type || '').toLowerCase();
+      counters[key] = (counters[key] || 0) + 1;
+      const idx = counters[key];
+      return {
+        id: `${key}-${idx}`,
+        label: `${type} ${idx}`,
+        value: key,
+      };
+    });
+  }, [baseStructure]);
+
   return (
     <View style={{ flex: 1, gap: 10, marginTop: 16 }}>
       <CreateLyricsHeader
@@ -59,7 +76,10 @@ const CustomizeSongStructure = () => {
         </View>
       </View> */}
       <View style={{ flex: 1 }}>
-        <DragDropTest />
+        <SongStructureDragDrop
+          sourceItems={sourceItems}
+          onChange={(arr) => onChange?.(arr)}
+        />
       </View>
     </View>
   );

src/screens/Writing/EmotionConvey.js

@@ -7,15 +7,18 @@ import { FONT_FAMILY } from "../../styles/Fonts";
 import { EMOTION_CONVEY } from "../../data/data";
 import ItemContainer from "../../components/ItemContainer/ItemContainer";
 
-const EmotionConvey = () => {
+const EmotionConvey = ({ selected: selectedProp, setSelected: setSelectedProp }) => {
   const [containerLayout, setContainerLayout] = useState(null);
-  const [selected, setSelected] = useState(null);
+  const [internalSelected, setInternalSelected] = useState(null);
+  const selected = selectedProp ?? internalSelected;
+  const setSelected = setSelectedProp ?? setInternalSelected;
 
   const onPressSelect = (item) => {
-    if (selected === item) {
+    // item is full object { title, description, color }
+    if (selected?.title === item.title) {
       setSelected(null);
     } else {
-      setSelected(item);
+      setSelected({ title: item.title, description: item.description });
     }
   };
 
@@ -40,14 +43,14 @@ const EmotionConvey = () => {
               paddingTop: 5,
             }}
             renderItem={({ item, index }) => {
-              const selectedItem = selected === item.title;
+              const selectedItem = selected?.title === item.title;
 
               return (
                 <View style={{ paddingHorizontal: 5 }}>
                   <CreateLyricsHeader
                     colors={item.color}
                     tint={selectedItem ? "default" : "dark"}
-                    onPress={() => onPressSelect(item.title)}
+                    onPress={() => onPressSelect(item)}
                   >
                     <Text
                       style={{

src/screens/Writing/Goals.js

@@ -7,8 +7,11 @@ import { FONT_FAMILY } from "../../styles/Fonts";
 import CustomInput from "./components/CustomInput";
 import ItemContainer from "../../components/ItemContainer/ItemContainer";
 
-const Goals = () => {
-  const [selected, setSelected] = useState(null);
+const Goals = ({ selected: selectedProp, setSelected: setSelectedProp, otherObjective, setOtherObjective }) => {
+  const [internalSelected, setInternalSelected] = useState(null);
+
+  const selected = selectedProp ?? internalSelected;
+  const setSelected = setSelectedProp ?? setInternalSelected;
 
   const onPressSelect = (item) => {
     if (selected === item) {
@@ -60,6 +63,8 @@ const Goals = () => {
       <CustomInput
         label="Tu as un autre objectif?"
         placeholder="Décrire l’objectif"
+        value={otherObjective}
+        setValue={setOtherObjective}
       />
     </View>
   );

src/screens/Writing/Lyrics.js

@@ -1,5 +1,5 @@
-import { View, Text, ScrollView } from "react-native";
-import React, { useState } from "react";
+import { View, Text, ScrollView, Alert } from "react-native";
+import React, { useMemo, useState, useCallback } from "react";
 import Page from "../../layouts/Page";
 import MusicLandHeader from "../../components/MusicLandHeader";
 import { goBack, navigate } from "../../navigation/NavigationService";
@@ -10,9 +10,92 @@ import { Routes } from "../../navigation";
 import CustomInput from "./components/CustomInput";
 import { FONT_FAMILY } from "../../styles/Fonts";
 import ItemContainer from "../../components/ItemContainer/ItemContainer";
+import { useRoute } from "@react-navigation/native";
+import firebase from "../../config/firebase";
+import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
 
-const Lyrics = () => {
+const Lyrics = ({ navigation }) => {
   const [containerLayout, setContainerLayout] = useState(null);
+  const route = useRoute();
+  const lyricsData = route?.params?.lyricsData;
+  const config = route?.params?.config;
+  const selections = route?.params?.selections;
+  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 [titleValue, setTitleValue] = useState(initial.title || "");
+  const [coupletValue, setCoupletValue] = useState(initial.couplet || "");
+  const [refrainValue, setRefrainValue] = useState(initial.refrain || "");
+
+  // Plus d'appel direct à la cloud function ici: on retourne à l'étape précédente
+  const regenerate = useCallback(() => {
+    navigate(Routes.CreateLyricsWithAi, { regenerateKey: Date.now() });
+  }, []);
+
+  const sanitize = (obj) => {
+    if (obj === undefined) return null;
+    if (obj === null) return null;
+    if (Array.isArray(obj)) return obj.map((v) => sanitize(v));
+    if (typeof obj === "object") {
+      const out = {};
+      Object.keys(obj).forEach((k) => {
+        const v = obj[k];
+        if (v === undefined) return; // omit undefined
+        out[k] = sanitize(v);
+      });
+      return out;
+    }
+    return obj;
+  };
+
+  const onValidate = useCallback(async () => {
+    try {
+      await setIsLoading(true);
+      const user = firebase.auth().currentUser;
+      const payload = {
+        title: titleValue?.trim() || "",
+        lyrics: {
+          couplet: coupletValue || "",
+          refrain: refrainValue || "",
+        },
+        config: sanitize(config),
+        selections: sanitize(selections),
+        userId: user ? user.uid : null,
+        createdAt: firebase.firestore.FieldValue.serverTimestamp(),
+        updatedAt: firebase.firestore.FieldValue.serverTimestamp(),
+      };
+      await firebase.firestore().collection("projects").add(payload);
+      navigate(Routes.Studio);
+    } catch (e) {
+      console.log(e);
+      Alert.alert("Erreur", "Échec de l'enregistrement dans le projet.");
+    } finally {
+      await setIsLoading(false);
+    }
+  }, [
+    titleValue,
+    coupletValue,
+    refrainValue,
+    config,
+    selections,
+    setIsLoading,
+  ]);
 
   return (
     <Page headerType="NONE">
@@ -34,7 +117,13 @@ const Lyrics = () => {
               flexGrow: 1,
             }}
           >
-            <CustomInput label="Titre" placeholder="Titre" height={45} />
+            <CustomInput
+              label="Titre"
+              placeholder="Titre"
+              height={45}
+              value={titleValue}
+              setValue={setTitleValue}
+            />
             <View
               style={{
                 height: 45,
@@ -55,8 +144,20 @@ const Lyrics = () => {
                 Introduction instrumentale longue
               </Text>
             </View>
-            <CustomInput label="Couplet" placeholder="Couplet" height={225} />
-            <CustomInput label="Refrain" placeholder="Refrain" height={170} />
+            <CustomInput
+              label="Couplet"
+              placeholder="Couplet"
+              height={225}
+              value={coupletValue}
+              setValue={setCoupletValue}
+            />
+            <CustomInput
+              label="Refrain"
+              placeholder="Refrain"
+              height={170}
+              value={refrainValue}
+              setValue={setRefrainValue}
+            />
           </ScrollView>
         </ItemContainer>
       </View>
@@ -68,11 +169,11 @@ const Lyrics = () => {
           gap: 12,
         }}
       >
-        <BorderGradientButton title="Générer des autres paroles" />
-        <GradientButton
-          title="Valider"
-          onPress={() => navigate(Routes.FinishedWriting)}
+        <BorderGradientButton
+          title="Générer d'autre paroles"
+          onPress={regenerate}
         />
+        <GradientButton title="Valider" onPress={onValidate} />
       </View>
     </Page>
   );

src/screens/Writing/Rhymes.js

@@ -6,8 +6,10 @@ import { Palette, Style } from "../../styles";
 import { FONT_FAMILY } from "../../styles/Fonts";
 import ItemContainer from "../../components/ItemContainer/ItemContainer";
 
-const Rhymes = () => {
-  const [selected, setSelected] = useState(null);
+const Rhymes = ({ selected: selectedProp, setSelected: setSelectedProp }) => {
+  const [internalSelected, setInternalSelected] = useState(null);
+  const selected = selectedProp ?? internalSelected;
+  const setSelected = setSelectedProp ?? setInternalSelected;
 
   const onPressSelect = (item) => {
     if (selected === item) {

src/screens/Writing/SongStructure.js

@@ -7,8 +7,10 @@ import { Palette, Style } from "../../styles";
 import { FONT_FAMILY } from "../../styles/Fonts";
 import ItemContainer from "../../components/ItemContainer/ItemContainer";
 
-const SongStructure = () => {
-  const [selected, setSelected] = useState(null);
+const SongStructure = ({ selected: selectedProp, setSelected: setSelectedProp }) => {
+  const [internalSelected, setInternalSelected] = useState(null);
+  const selected = selectedProp ?? internalSelected;
+  const setSelected = setSelectedProp ?? setInternalSelected;
 
   const onPressSelect = (item) => {
     if (selected === item) {

src/screens/Writing/SongStyle.js

@@ -8,8 +8,10 @@ import CustomInput from "./components/CustomInput";
 import { FONT_FAMILY } from "../../styles/Fonts";
 import ItemContainer from "../../components/ItemContainer/ItemContainer";
 
-const SongStyle = () => {
-  const [selected, setSelected] = useState(null);
+const SongStyle = ({ selected: selectedProp, setSelected: setSelectedProp, otherStyle, setOtherStyle }) => {
+  const [internalSelected, setInternalSelected] = useState(null);
+  const selected = selectedProp ?? internalSelected;
+  const setSelected = setSelectedProp ?? setInternalSelected;
 
   const onPressSelect = (item) => {
     if (selected === item) {
@@ -70,6 +72,8 @@ const SongStyle = () => {
       <CustomInput
         label="Tu as un autre style de chanson ?"
         placeholder="Décrire l’objectif"
+        value={otherStyle}
+        setValue={setOtherStyle}
       />
     </View>
   );

src/screens/Writing/SongTo.js

@@ -3,11 +3,16 @@ import React from "react";
 import CreateLyricsHeader from "./components/CreateLyricsHeader";
 import CustomInput from "./components/CustomInput";
 
-const SongTo = () => {
+const SongTo = ({ audience, setAudience }) => {
   return (
     <View style={{ flex: 1, gap: 10, marginTop: 16 }}>
       <CreateLyricsHeader title="À qui s’adresse ta chanson ?" />
-      <CustomInput placeholder="Ecrire mon contexte" height={283} />
+      <CustomInput
+        placeholder="Ecrire mon contexte"
+        height={283}
+        value={audience}
+        setValue={setAudience}
+      />
     </View>
   );
 };

src/screens/Writing/SpecificityContext.js

@@ -3,14 +3,19 @@ import React from "react";
 import CreateLyricsHeader from "./components/CreateLyricsHeader";
 import CustomInput from "./components/CustomInput";
 
-const SpecificityContext = () => {
+const SpecificityContext = ({ context, setContext }) => {
   return (
     <View style={{ flex: 1, gap: 10, marginTop: 16 }}>
       <CreateLyricsHeader
         title="Spécificité du contexte"
         subTitle="Dis-nous en un peu plus pour qu’on puisse mieux t’aider."
       />
-      <CustomInput placeholder="Ecrire mon contexte" height={283} />
+      <CustomInput
+        placeholder="Ecrire mon contexte"
+        height={283}
+        value={context}
+        setValue={setContext}
+      />
     </View>
   );
 };

src/screens/Writing/Writing.js

@@ -9,34 +9,33 @@ import firebase from "../../config/firebase";
 import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
 
 const Writing = () => {
+  const { setIsLoading } = useMinuit();
 
-    const { setIsLoading } = useMinuit();
-
-    async function generateTestLyrics() {
-        try {
-            await setIsLoading(true);
-            const { data } = await firebase
-                .functions()
-                .httpsCallable("lyrics-generateLyrics")({
-                    objective:
-                        "Célébrer l’agence Minuit et mettre en avant son expertise digitale, son esprit d’équipe et sa créativité.",
-                    context:
-                        "L’agence Minuit accompagne les startups et entreprises innovantes dans la création de produits digitaux, du prototype à la version de financement, jusqu’à l’optimisation et la mise à l’échelle. Spécialisée dans le développement sur-mesure d’applications mobiles, elle valorise l’humain, le design et l’accompagnement personnalisé. Esprit nocturne, équipe passionnée.",
-                    emotion:
-                        "La Joie : expose un bonheur profond, l'émerveillement, la gratitude, satisfaction intense, énergie positive.",
-                    style: "Upbeat : Pour une ambiance joyeuse et rythmée.",
-                    audience:
-                        "L’équipe Minuit et ses clients fidèles, startups ambitieuses et partenaires visionnaires.",
-                    structure: ["couplet", "refrain", "couplet", "refrain"],
-                    rhymes: "Avec rimes",
-                });
-            console.log("data", data);
-        } catch (e) {
-            console.log(e);
-        } finally {
-            await setIsLoading(false);
-        }
+  async function generateTestLyrics() {
+    try {
+      await setIsLoading(true);
+      const { data } = await firebase
+        .functions()
+        .httpsCallable("lyrics-generateLyrics")({
+        objective:
+          "Célébrer l’agence Minuit et mettre en avant son expertise digitale, son esprit d’équipe et sa créativité.",
+        context:
+          "L’agence Minuit accompagne les startups et entreprises innovantes dans la création de produits digitaux, du prototype à la version de financement, jusqu’à l’optimisation et la mise à l’échelle. Spécialisée dans le développement sur-mesure d’applications mobiles, elle valorise l’humain, le design et l’accompagnement personnalisé. Esprit nocturne, équipe passionnée.",
+        emotion:
+          "La Joie : expose un bonheur profond, l'émerveillement, la gratitude, satisfaction intense, énergie positive.",
+        style: "Upbeat : Pour une ambiance joyeuse et rythmée.",
+        audience:
+          "L’équipe Minuit et ses clients fidèles, startups ambitieuses et partenaires visionnaires.",
+        structure: ["couplet", "refrain", "couplet", "refrain"],
+        rhymes: "Avec rimes",
+      });
+      console.log("data", data);
+    } catch (e) {
+      console.log(e);
+    } finally {
+      await setIsLoading(false);
     }
+  }
 
   return (
     <Page

src/screens/Writing/components/CreateLyricsHeader.js

@@ -17,31 +17,34 @@ const CreateLyricsHeader = ({
   containerStyle = {},
   onPress,
   blurViewStyle = {},
+  showBorder = true,
 }) => {
   const [onLayout, setOnLayout] = useState(null);
   const { isWeb } = useLayoutType();
 
   return (
     <Pressable onPress={onPress}>
-      <BorderGradient
-        gradientProps={{
-          colors: colors,
-          locations: [0.2, 1],
-          start: { x: 0, y: 0 },
-          end: { x: 1, y: 0 },
-          ...gradientProps,
-        }}
-        style={{
-          height: isWeb ? onLayout?.height + 2 : onLayout?.height,
-          top: isWeb ? -1 : 0,
-          borderWidth: 1,
-          borderRadius: containerStyle?.borderRadius ?? 18,
-          position: "absolute",
-          width: isWeb ? onLayout?.width + 2 : onLayout?.width,
-          left: -1,
-          alignSelf: "center",
-        }}
-      />
+      {showBorder && (
+        <BorderGradient
+          gradientProps={{
+            colors: colors,
+            locations: [0.2, 1],
+            start: { x: 0, y: 0 },
+            end: { x: 1, y: 0 },
+            ...gradientProps,
+          }}
+          style={{
+            height: isWeb ? onLayout?.height + 2 : onLayout?.height,
+            top: isWeb ? -1 : 0,
+            borderWidth: 1,
+            borderRadius: containerStyle?.borderRadius ?? 18,
+            position: "absolute",
+            width: isWeb ? onLayout?.width + 2 : onLayout?.width,
+            left: -1,
+            alignSelf: "center",
+          }}
+        />
+      )}
       <View
         style={{
           backgroundColor: Palette.glass,