diff --git a/backend/src/services/rssParserService.ts b/backend/src/services/rssParserService.ts index 8c8cdc7..22d305c 100644 --- a/backend/src/services/rssParserService.ts +++ b/backend/src/services/rssParserService.ts @@ -284,8 +284,11 @@ export const rssParserService = { podcast.lastFetched = new Date(); if (episodes.length > 0) { + console.log(`[RSS Parser] Setting last episode for ${podcast.title}: ${episodes[0].title} (${episodes[0].pubDate})`); podcast.lastEpisodeTitle = episodes[0].title; podcast.lastEpisodeDate = episodes[0].pubDate; + } else { + console.warn(`[RSS Parser] No episodes found for ${podcast.title} during creation.`); } await podcast.save(); diff --git a/frontend/src/components/SuccessModal.tsx b/frontend/src/components/SuccessModal.tsx new file mode 100644 index 0000000..264ef3d --- /dev/null +++ b/frontend/src/components/SuccessModal.tsx @@ -0,0 +1,88 @@ +import { CheckCircle2, ChevronRight, BookOpen } from 'lucide-react'; +import { Link } from 'react-router-dom'; + +interface SuccessModalProps { + isOpen: boolean; + onClose: () => void; + podcastTitle: string; + podcastAuthor?: string; + podcastImage?: string; + message?: string; +} + +export default function SuccessModal({ + isOpen, + onClose, + podcastTitle, + podcastAuthor, + podcastImage, + message = "Podcast ajouté avec succès !" +}: SuccessModalProps) { + if (!isOpen) return null; + + return ( +
+ {/* Backdrop */} +
+ + {/* Modal */} +
+ {/* Top Gradient */} +
+ +
+ {/* Animated Success Icon */} +
+ +
+ +

+ {message} +

+ +
+ {podcastImage ? ( + {podcastTitle} + ) : ( +
+ 🎙️ +
+ )} +
+

{podcastTitle}

+ {podcastAuthor && ( +

{podcastAuthor}

+ )} +
+
+ +
+ + + Voir dans ma Bibliothèque + + + + +
+
+
+
+ ); +} diff --git a/frontend/src/pages/AddPodcast.tsx b/frontend/src/pages/AddPodcast.tsx index 4185a92..0b85482 100644 --- a/frontend/src/pages/AddPodcast.tsx +++ b/frontend/src/pages/AddPodcast.tsx @@ -2,9 +2,8 @@ import { useState, useEffect } from 'react'; import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'; import { discoveryService, DiscoveryPodcast } from '../services/discoveryService'; import { podcastService } from '../services/podcastService'; -import Header from '../components/Header'; -import { Search, Plus, Loader, Rss, Check } from 'lucide-react'; import { authService } from '../services/authService'; +import SuccessModal from '../components/SuccessModal'; export default function AddPodcast() { const queryClient = useQueryClient(); @@ -15,6 +14,10 @@ export default function AddPodcast() { const [rssLoading, setRssLoading] = useState(false); const [rssError, setRssError] = useState(null); const [rssSuccess, setRssSuccess] = useState(null); + + // Modal state + const [showSuccessModal, setShowSuccessModal] = useState(false); + const [successPodcast, setSuccessPodcast] = useState(null); useEffect(() => { const loadUser = async () => { @@ -60,7 +63,8 @@ export default function AddPodcast() { try { setSubscribingId(podcast.id); await subscribeMutation.mutateAsync(podcast); - alert(`"${podcast.title}" ajouté à vos abonnements !`); + setSuccessPodcast(podcast); + setShowSuccessModal(true); queryClient.invalidateQueries({ queryKey: ['episodes', 'latest'] }); } catch (error: any) { const errorMessage = error.response?.data?.message || 'Failed to subscribe'; @@ -228,6 +232,14 @@ export default function AddPodcast() { )} + + setShowSuccessModal(false)} + podcastTitle={successPodcast?.title || ""} + podcastAuthor={successPodcast?.author || ""} + podcastImage={successPodcast?.imageUrl || ""} + />
); } diff --git a/frontend/src/pages/Trending.tsx b/frontend/src/pages/Trending.tsx index d088526..d0cd40d 100644 --- a/frontend/src/pages/Trending.tsx +++ b/frontend/src/pages/Trending.tsx @@ -2,14 +2,17 @@ import { useState, useEffect } from 'react'; import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'; import { discoveryService, DiscoveryPodcast } from '../services/discoveryService'; import { podcastService } from '../services/podcastService'; -import Header from '../components/Header'; -import { Loader, Plus, Flame, Check } from 'lucide-react'; import { authService } from '../services/authService'; +import SuccessModal from '../components/SuccessModal'; export default function Trending() { const queryClient = useQueryClient(); const [user, setUser] = useState(null); const [subscribingId, setSubscribingId] = useState(null); + + // Modal state + const [showSuccessModal, setShowSuccessModal] = useState(false); + const [successPodcast, setSuccessPodcast] = useState(null); useEffect(() => { const loadUser = async () => { @@ -54,7 +57,8 @@ export default function Trending() { try { setSubscribingId(podcast.id); await subscribeMutation.mutateAsync(podcast); - alert(`"${podcast.title}" ajouté à vos abonnements !`); + setSuccessPodcast(podcast); + setShowSuccessModal(true); queryClient.invalidateQueries({ queryKey: ['episodes', 'latest'] }); } catch (error: any) { const errorMessage = error.response?.data?.message || 'Failed to subscribe'; @@ -157,6 +161,14 @@ export default function Trending() {
)} + + setShowSuccessModal(false)} + podcastTitle={successPodcast?.title || ""} + podcastAuthor={successPodcast?.author || ""} + podcastImage={successPodcast?.imageUrl || ""} + /> ); }