import { useRoute } from '@react-navigation/native' import React, { useCallback, useMemo, useState } from 'react' import { Linking, StyleSheet, Text, View } from 'react-native' import useMinuit from 'react-native-minuit/src/hooks/useMinuit.js' import { background } from '../../assets' import AppCheckbox from '../../components/AppCheckbox' import BorderGradientButton from '../../components/BorderGradientButton' import GradientButton from '../../components/GradientButton' import MusicLandHeader from '../../components/MusicLandHeader' import alert from '../../components/Alert' import firebase, { projectsRef, serverTimestamp } from '../../config/firebase' import Page from '../../layouts/Page' import { goBack } from '../../navigation/NavigationService' import { useUser } from '../../providers/UserDataProvider' import { Palette, gutters } from '../../styles' import { FONT_FAMILY } from '../../styles/Fonts' const PublishYoutube = () => { const route = useRoute() const routeProjectId = route?.params?.projectId ?? null const { userProjects = [], selectedProject } = useUser() const { setTooltip } = useMinuit() const project = useMemo(() => { if (routeProjectId) { return userProjects.find((item) => item?.id === routeProjectId) || selectedProject || null } if (selectedProject?.id) { return selectedProject } return userProjects.length ? userProjects[0] : null }, [routeProjectId, selectedProject, userProjects]) const projectId = project?.id || routeProjectId || null const [saving, setSaving] = useState(false) const [hasAcceptedPublication, setHasAcceptedPublication] = useState(true) const youtubeUrl = project?.youtubeUrl ?? null const youtubeStatus = project?.youtubeStatus ?? null const youtubeError = project?.youtubeError ?? null const playbackReady = !!project?.playbackUrl const hasYoutubePublication = !!youtubeUrl const isPublishing = useMemo( () => ['PUBLISHING', 'UPLOADING', 'PROCESSING', 'QUEUED'].includes(youtubeStatus), [youtubeStatus] ) const publishDisabled = saving || isPublishing || !playbackReady || !projectId || !hasAcceptedPublication const publishButtonLabel = isPublishing ? 'Publication en cours...' : hasYoutubePublication ? 'Mettre à jour sur YouTube' : 'Publier sur YouTube' const statusMessage = useMemo(() => { if (!playbackReady) { return 'Termine la création de ton playback avec Theo pour débloquer la publication YouTube.' } if (isPublishing) { return 'La publication de ta vidéo est en cours... Patiente un instant.' } if (youtubeError || youtubeStatus === 'FAILED') { return 'La dernière tentative de publication a échoué. Tu peux réessayer ci-dessous.' } if (hasYoutubePublication) { return 'Ta vidéo est publiée sur la chaîne YouTube MusicLand. Tu peux la partager dès maintenant.' } return 'Partage ton playback sur la chaîne YouTube MusicLand.' }, [hasYoutubePublication, isPublishing, playbackReady, youtubeError, youtubeStatus]) const handleOpenYoutube = useCallback(async () => { if (!youtubeUrl) { return } try { await Linking.openURL(youtubeUrl) } catch (_error) { setTooltip?.({ type: 'error', text: "Impossible d'ouvrir le lien YouTube", }) } }, [setTooltip, youtubeUrl]) const handleMarkPublished = useCallback(async () => { if (!projectId) { setTooltip?.({ type: 'error', text: 'Sélectionnez un projet avant de publier', }) return } if (!playbackReady) { setTooltip?.({ type: 'error', text: "Aucun playback n'est disponible pour la publication", }) return } setSaving(true) try { // publication sur youtube en standby // const publishCallable = firebase.functions().httpsCallable('youtube-publishPlaybackToYoutube') // await publishCallable({ projectId }) setTooltip?.({ type: 'success', text: 'Publication lancée sur YouTube', }) } catch (error) { setTooltip?.({ type: 'error', text: error?.message || 'Impossible de lancer la publication', }) } finally { setSaving(false) } }, [playbackReady, projectId, setTooltip]) const handleConfirmPublish = useCallback(() => { if (!hasAcceptedPublication) { setTooltip?.({ type: 'error', text: 'Confirme la diffusion sur YouTube avant de publier', }) return } if (publishDisabled) { return } const confirmTitle = hasYoutubePublication ? 'Confirmer la mise à jour' : 'Confirmer la publication' const confirmDescription = hasYoutubePublication ? 'La vidéo existe déjà sur YouTube. Confirme que tu souhaites remplacer la version publiée.' : 'Confirme que tu souhaites publier ce playback sur YouTube. Il sera visible publiquement.' alert(confirmTitle, confirmDescription, [ { text: 'Annuler', style: 'cancel' }, { text: hasYoutubePublication ? 'Mettre à jour' : 'Je confirme', onPress: handleMarkPublished, }, ]) }, [ handleMarkPublished, hasAcceptedPublication, hasYoutubePublication, publishDisabled, setTooltip, ]) const handleResetPublication = useCallback(async () => { if (!projectId) { setTooltip?.({ type: 'error', text: 'Sélectionnez un projet avant de réinitialiser', }) return } setSaving(true) try { await projectsRef.doc(projectId).set( { youtubePublished: false, youtubeUrl: null, youtubeVideoId: null, youtubePublishedAt: null, youtubeStatus: 'IDLE', youtubeError: null, updatedAt: serverTimestamp(), }, { merge: true } ) setTooltip?.({ type: 'success', text: 'Publication YouTube réinitialisée', }) } catch (error) { setTooltip?.({ type: 'error', text: error?.message || 'Réinitialisation impossible', }) } finally { setSaving(false) } }, [projectId, setTooltip]) return ( {hasYoutubePublication ? 'Ta vidéo est déjà sur YouTube' : 'Publier sur YouTube'} {statusMessage} {youtubeError && ( {youtubeError} )} {hasYoutubePublication && youtubeUrl && ( {youtubeUrl} )} setHasAcceptedPublication((prevState) => !prevState)} label="J'accepte la diffusion de mon contenu sur YouTube." /> Cette confirmation est requise avant toute publication sur YouTube. {hasYoutubePublication && youtubeUrl && ( )} {hasYoutubePublication && ( )} ) } const styles = StyleSheet.create({ consentContainer: { gap: 6, }, consentDescription: { fontSize: 13, fontFamily: FONT_FAMILY.InterRegular, color: Palette.white, opacity: 0.8, }, }) export default PublishYoutube