diff --git a/src/pages/discover/MoreContent.tsx b/src/pages/discover/MoreContent.tsx index 29f86efb..af562f2b 100644 --- a/src/pages/discover/MoreContent.tsx +++ b/src/pages/discover/MoreContent.tsx @@ -97,6 +97,11 @@ export function MoreContent({ onShowDetails }: MoreContentProps) { setIsContentVisible(false); }, [isLoading, mediaItems, currentPage]); + // Scroll to top when entering the page + useEffect(() => { + window.scrollTo(0, 0); + }, [contentType, mediaType, id]); + const handleBack = () => { if (lastView) { navigate(lastView.url); diff --git a/src/pages/discover/components/MediaCarousel.tsx b/src/pages/discover/components/MediaCarousel.tsx index 49c148cc..177b1f42 100644 --- a/src/pages/discover/components/MediaCarousel.tsx +++ b/src/pages/discover/components/MediaCarousel.tsx @@ -198,7 +198,7 @@ export function MediaCarousel({ ]); // Fetch media using our hook - only when carousel has been visible - const { media, sectionTitle } = useDiscoverMedia({ + const { media, sectionTitle, actualContentType } = useDiscoverMedia({ contentType, mediaType, id: selectedProviderId || selectedGenreId || selectedRecommendationId, @@ -298,7 +298,7 @@ export function MediaCarousel({ if (showRecommendations && selectedRecommendationId) { return `${baseLink}/recommendations/${selectedRecommendationId}/${mediaType}`; } - return `${baseLink}/${content.type}/${mediaType}`; + return `${baseLink}/${actualContentType}/${mediaType}`; }, [ moreLink, showProviders, @@ -308,7 +308,7 @@ export function MediaCarousel({ showRecommendations, selectedRecommendationId, mediaType, - content.type, + actualContentType, ]); // Loading state diff --git a/src/pages/discover/hooks/useDiscoverMedia.ts b/src/pages/discover/hooks/useDiscoverMedia.ts index a20f1c07..ea4e719d 100644 --- a/src/pages/discover/hooks/useDiscoverMedia.ts +++ b/src/pages/discover/hooks/useDiscoverMedia.ts @@ -121,6 +121,8 @@ export function useDiscoverMedia({ const [sectionTitle, setSectionTitle] = useState(""); const [currentContentType, setCurrentContentType] = useState(contentType); + const [actualContentType, setActualContentType] = + useState(contentType); const { t } = useTranslation(); const userLanguage = useLanguageStore((s) => s.language); @@ -131,6 +133,7 @@ export function useDiscoverMedia({ if (contentType !== currentContentType) { setMedia([]); setCurrentContentType(contentType); + setActualContentType(contentType); // Reset actual content type to original } }, [contentType, currentContentType]); @@ -475,6 +478,7 @@ export function useDiscoverMedia({ console.info(`Falling back from ${contentType} to ${fallbackType}`); try { const fallbackData = await attemptFetch(fallbackType); + setActualContentType(fallbackType); // Set actual content type to fallback setMedia((prevMedia) => { // If page is 1, replace the media array, otherwise append return page === 1 @@ -526,5 +530,6 @@ export function useDiscoverMedia({ hasMore, refetch: fetchMedia, sectionTitle, + actualContentType, }; } diff --git a/src/pages/discover/types/discover.ts b/src/pages/discover/types/discover.ts index 6343b3e2..2754fa05 100644 --- a/src/pages/discover/types/discover.ts +++ b/src/pages/discover/types/discover.ts @@ -47,6 +47,7 @@ export interface UseDiscoverMediaReturn { hasMore: boolean; refetch: () => Promise; sectionTitle: string; + actualContentType: DiscoverContentType; } export interface Provider {