From b0cf4a20abbcb50f7fc2524db3dcb44613a51dc3 Mon Sep 17 00:00:00 2001 From: leon-morival Date: Mon, 8 Dec 2025 14:13:39 +0100 Subject: [PATCH] feat: tickets --- src/components/player/GlobalAudioPlayer.js | 2 +- src/providers/PlayerProvider.js | 1 + src/screens/cover/PouchReady.js | 560 +++++++++++---------- 3 files changed, 290 insertions(+), 273 deletions(-) diff --git a/src/components/player/GlobalAudioPlayer.js b/src/components/player/GlobalAudioPlayer.js index c09b7db..06ccbb1 100644 --- a/src/components/player/GlobalAudioPlayer.js +++ b/src/components/player/GlobalAudioPlayer.js @@ -165,7 +165,7 @@ const GlobalAudioPlayer = () => { } const project = currentTrack?.metadata?.project && - typeof currentTrack.metadata.project === "object" + typeof currentTrack.metadata.project === "object" ? currentTrack.metadata.project : null; navigateToMusicDetails({ diff --git a/src/providers/PlayerProvider.js b/src/providers/PlayerProvider.js index 6b89661..802df04 100644 --- a/src/providers/PlayerProvider.js +++ b/src/providers/PlayerProvider.js @@ -42,6 +42,7 @@ const HIDDEN_ROUTE_NAMES = new Set([ Routes.PlaybackExample, Routes.PlaybackOnboarding, Routes.Playback, + Routes.PlaybackGuide, Routes.RecordPlayback, Routes.RecordedPlayback, Routes.ChooseDecor, diff --git a/src/screens/cover/PouchReady.js b/src/screens/cover/PouchReady.js index be137de..af8ee59 100644 --- a/src/screens/cover/PouchReady.js +++ b/src/screens/cover/PouchReady.js @@ -1,6 +1,12 @@ import { BlurView } from "expo-blur"; import { Image as ExpoImage } from "expo-image"; -import React, { useCallback, useEffect, useMemo, useRef, useState } from "react"; +import React, { + useCallback, + useEffect, + useMemo, + useRef, + useState, +} from "react"; import { ActivityIndicator, Image, @@ -9,6 +15,8 @@ import { Text, TextInput, View, + KeyboardAvoidingView, + Platform, } from "react-native"; import { background, icons } from "../../assets"; import alert from "../../components/Alert"; @@ -220,10 +228,7 @@ const PouchReady = () => { const start = coverProgressStartRef.current; if (!start) return; const elapsed = Date.now() - start.getTime(); - const ratio = Math.max( - 0, - Math.min(1, elapsed / COVER_FAKE_DURATION_MS), - ); + const ratio = Math.max(0, Math.min(1, elapsed / COVER_FAKE_DURATION_MS)); const next = COVER_PROGRESS_MAX * ratio; setCoverProgress((prev) => { if (prev >= COVER_PROGRESS_MAX) return COVER_PROGRESS_MAX; @@ -310,45 +315,82 @@ const PouchReady = () => { return ( - - - - - - {displayOptions.length > 0 ? ( - displayOptions.map((option, index) => { - const optionUri = - option?.finalUrl || option?.generatedUrl || ""; - if (!optionUri) return null; - if (hasGeneratedOptions) { - const isSelected = option?.id === selectedOption?.id; - const cardWidthStyle = isWeb - ? styles.coverOptionCardWeb - : styles.coverOptionCardMobile; + + + + + + + {displayOptions.length > 0 ? ( + displayOptions.map((option, index) => { + const optionUri = + option?.finalUrl || option?.generatedUrl || ""; + if (!optionUri) return null; + if (hasGeneratedOptions) { + const isSelected = option?.id === selectedOption?.id; + const cardWidthStyle = isWeb + ? styles.coverOptionCardWeb + : styles.coverOptionCardMobile; + return ( + handleSelectOption(option)} + disabled={isSelecting} + style={[ + styles.coverOptionCard, + cardWidthStyle, + isSelected ? styles.coverOptionCardSelected : null, + isSelecting ? styles.coverOptionCardDisabled : null, + ]} + > + + + + {`Option ${index + 1}`} + + + {isSelected && ( + + + Sélectionnée + + + )} + + ); + } return ( - handleSelectOption(option)} - disabled={isSelecting} style={[ - styles.coverOptionCard, - cardWidthStyle, - isSelected ? styles.coverOptionCardSelected : null, - isSelecting ? styles.coverOptionCardDisabled : null, + styles.coverPreviewCard, + isWeb + ? styles.coverPreviewCardWeb + : styles.coverPreviewCardMobile, ]} > { priority="high" contentFit="cover" transition={120} - style={styles.coverOptionImage} + style={styles.coverPreviewImage} /> - - - {`Option ${index + 1}`} - - - {isSelected && ( - - - Sélectionnée - - - )} - + ); - } - return ( - - - - ); - }) - ) : ( - <> - {isGenerating && ( - - - {isWeb ? ( - coverBackgroundMessage ? ( + }) + ) : ( + <> + {isGenerating && ( + + + {isWeb ? ( + coverBackgroundMessage ? ( + + {coverBackgroundMessage} + + ) : null + ) : ( { opacity: 0.9, }} > - {coverBackgroundMessage} + Génération en cours. + + )} + + + + {coverProgressValue}% - ) : null - ) : ( - - Génération en cours. - - )} - - - - {coverProgressValue}% - - - - )} - - // - )} - - {shouldShowStylePanel && ( - - - Style de la pochette - - Choisis une ambiance ou écris ton propre brief créatif. - - - - - { - setStyleMode("preset"); - setIsPresetDropdownOpen(false); - if (!selectedPresetStyle) { - setSelectedPresetStyle(COVER_STYLE_PRESETS[0]); - } - }} - /> - - {styleMode === "preset" && ( - - setIsPresetDropdownOpen((prev) => !prev)} - > - - {selectedPresetStyle} - - - - {isPresetDropdownOpen && ( - - {COVER_STYLE_PRESETS.map((styleOption, index) => { - const isActive = - selectedPresetStyle === styleOption; - const isLast = - index === COVER_STYLE_PRESETS.length - 1; - return ( - { - setSelectedPresetStyle(styleOption); - setIsPresetDropdownOpen(false); - }} - > - - {styleOption} - - {isActive && ( - - )} - - ); - })} - )} - - )} - + + )} + + // + )} + + {shouldShowStylePanel && ( + + + Style de la pochette + + Choisis une ambiance ou écris ton propre brief créatif. + + + { - setStyleMode("custom"); + setStyleMode("preset"); setIsPresetDropdownOpen(false); + if (!selectedPresetStyle) { + setSelectedPresetStyle(COVER_STYLE_PRESETS[0]); + } }} /> - {styleMode === "custom" && ( - - + {styleMode === "preset" && ( + + + setIsPresetDropdownOpen((prev) => !prev) + } + > + + {selectedPresetStyle} + + + + {isPresetDropdownOpen && ( + + {COVER_STYLE_PRESETS.map((styleOption, index) => { + const isActive = + selectedPresetStyle === styleOption; + const isLast = + index === COVER_STYLE_PRESETS.length - 1; + return ( + { + setSelectedPresetStyle(styleOption); + setIsPresetDropdownOpen(false); + }} + > + + {styleOption} + + {isActive && ( + + )} + + ); + })} + + )} )} + + + { + setStyleMode("custom"); + setIsPresetDropdownOpen(false); + }} + /> + + {styleMode === "custom" && ( + + + + )} + - - - )} + + )} + - - - {!hasGeneratedOptions && ( - - )} - {hasGeneratedOptions && ( - - )} - + + {!hasGeneratedOptions && ( + + )} + {hasGeneratedOptions && ( + + )} + + ); };