diff --git a/src/screens/cover/PouchReady.js b/src/screens/cover/PouchReady.js index d8114ed..f4f7740 100644 --- a/src/screens/cover/PouchReady.js +++ b/src/screens/cover/PouchReady.js @@ -39,6 +39,12 @@ const COVER_STYLE_PRESETS = [ 'Portrait théâtralisé', 'Livre de coloriage', 'Shooting', + 'Réaliste', + 'Artistique', + 'Afro', + 'Grunge', + 'Pop Art' + ] const COVER_PROGRESS_MAX = 98 const COVER_PROGRESS_INTERVAL_MS = 500 @@ -74,6 +80,7 @@ const PouchReady = () => { return 'Nous lançons la génération de ta pochette...' }, [coverBackgroundMessage]) + const [isEditing, setIsEditing] = useState(false) const [styleMode, setStyleMode] = useState('preset') const [selectedPresetStyle, setSelectedPresetStyle] = useState(COVER_STYLE_PRESETS[0]) const [customStyle, setCustomStyle] = useState('') @@ -115,7 +122,8 @@ const PouchReady = () => { const generateCover = useCallback( async (styleValue) => { if (!selectedProjectId) return - if (hasGeneratedOptions) { + // We allow regeneration if isEditing is true + if (hasGeneratedOptions && !isEditing) { return } const trimmedStyle = String(styleValue || '').trim() @@ -128,6 +136,12 @@ const PouchReady = () => { await updateProjectData( { coverStyle: trimmedStyle, + cover: { + options: [], + result: null, + generatedBackground: null, + selectedOptionId: null, + }, }, { merge: true } ) @@ -137,13 +151,14 @@ const PouchReady = () => { status: 'PENDING', createdAt: firebase.firestore.FieldValue.serverTimestamp(), }) + setIsEditing(false) // Exit editing mode after triggering generation } catch (e) { console.log('Cover task error', e?.message) setIsAwaitingGenerationStart(false) await setLoading(false) } }, - [hasGeneratedOptions, selectedProjectId, setLoading, showGenerationLoading, updateProjectData] + [hasGeneratedOptions, isEditing, selectedProjectId, setLoading, showGenerationLoading, updateProjectData] ) const requestCoverGeneration = useCallback(() => { @@ -159,18 +174,18 @@ const PouchReady = () => { const coverPreviewUrl = selectedProject?.cover?.result || selectedProject?.cover?.generatedBackground || null - const shouldShowStylePanel = !isGenerating && !hasGeneratedOptions && !coverPreviewUrl + const shouldShowStylePanel = (!isGenerating && !hasGeneratedOptions && !coverPreviewUrl) || isEditing const displayOptions = hasGeneratedOptions ? coverOptions : coverPreviewUrl ? [ - { - id: 'preview', - finalUrl: selectedProject?.cover?.result || null, - generatedUrl: coverPreviewUrl, - }, - ] + { + id: 'preview', + finalUrl: selectedProject?.cover?.result || null, + generatedUrl: coverPreviewUrl, + }, + ] : [] const isCoverLoading = isGenerating && !hasGeneratedOptions && !coverPreviewUrl const coverProgressValue = Math.max(0, Math.min(100, Math.round(coverProgress))) @@ -527,6 +542,10 @@ const PouchReady = () => { setIsPresetDropdownOpen(false) }} /> + + + Donne les instructions que tu veux pour créer ta pochette + {styleMode === 'custom' && ( @@ -560,16 +579,44 @@ const PouchReady = () => { gap: 12, }} > - {!hasGeneratedOptions && ( + {isEditing ? ( + + + setIsEditing(false)} + disabled={isGenerating} + style={{ alignSelf: 'center', padding: 8 }} + > + + Annuler + + + + ) : !hasGeneratedOptions ? ( - )} - {hasGeneratedOptions && ( - + ) : ( + <> + + + + setIsEditing(true)} + disabled={isGenerating} + textStyle={{ fontSize: 13 }} + /> + + )}