From 8344d4025bc723a739307b82a228a1a5a1cee33a Mon Sep 17 00:00:00 2001 From: Fredrik Burmester Date: Tue, 31 Dec 2024 14:54:31 +0100 Subject: [PATCH] fix: not possible to select seasons without index --- components/series/SeasonDropdown.tsx | 2 +- components/series/SeasonPicker.tsx | 65 ++++++++++++++++++++-------- 2 files changed, 47 insertions(+), 20 deletions(-) diff --git a/components/series/SeasonDropdown.tsx b/components/series/SeasonDropdown.tsx index 574048d4..5c333f2e 100644 --- a/components/series/SeasonDropdown.tsx +++ b/components/series/SeasonDropdown.tsx @@ -19,7 +19,7 @@ type SeasonKeys = { }; export type SeasonIndexState = { - [seriesId: string]: number | null | undefined; + [seriesId: string]: number | string | null | undefined; }; export const SeasonDropdown: React.FC = ({ diff --git a/components/series/SeasonPicker.tsx b/components/series/SeasonPicker.tsx index 00093cd4..adb40bac 100644 --- a/components/series/SeasonPicker.tsx +++ b/components/series/SeasonPicker.tsx @@ -30,7 +30,10 @@ export const SeasonPicker: React.FC = ({ item, initialSeasonIndex }) => { const [user] = useAtom(userAtom); const [seasonIndexState, setSeasonIndexState] = useAtom(seasonIndexAtom); - const seasonIndex = seasonIndexState[item.Id ?? ""]; + const seasonIndex = useMemo( + () => seasonIndexState[item.Id ?? ""], + [item, seasonIndexState] + ); const { data: seasons } = useQuery({ queryKey: ["seasons", item.Id], @@ -56,16 +59,24 @@ export const SeasonPicker: React.FC = ({ item, initialSeasonIndex }) => { enabled: !!api && !!user?.Id && !!item.Id, }); - const selectedSeasonId: string | null = useMemo( - () => - seasons?.find((season: any) => season.IndexNumber === seasonIndex)?.Id, - [seasons, seasonIndex] - ); + const selectedSeasonId: string | null = useMemo(() => { + const season: BaseItemDto = seasons?.find( + (s: BaseItemDto) => + s.IndexNumber === seasonIndex || s.Name === seasonIndex + ); + + if (!season?.Id) return null; + + return season.Id!; + }, [seasons, seasonIndex]); const { data: episodes, isFetching } = useQuery({ queryKey: ["episodes", item.Id, selectedSeasonId], queryFn: async () => { - if (!api || !user?.Id || !item.Id || !selectedSeasonId) return []; + if (!api || !user?.Id || !item.Id || !selectedSeasonId) { + return []; + } + const res = await getTvShowsApi(api).getEpisodes({ seriesId: item.Id, userId: user.Id, @@ -74,6 +85,12 @@ export const SeasonPicker: React.FC = ({ item, initialSeasonIndex }) => { fields: ["MediaSources", "MediaStreams", "Overview"], }); + if (res.data.TotalRecordCount === 0) + console.warn( + "No episodes found for season with ID ~", + selectedSeasonId + ); + return res.data.Items; }, enabled: !!api && !!user?.Id && !!item.Id && !!selectedSeasonId, @@ -118,23 +135,26 @@ export const SeasonPicker: React.FC = ({ item, initialSeasonIndex }) => { seasons={seasons} state={seasonIndexState} onSelect={(season) => { + if (!item.Id) return; setSeasonIndexState((prev) => ({ ...prev, - [item.Id ?? ""]: season.IndexNumber, + [item.Id!]: season.IndexNumber ?? season.Name, })); }} /> - ( - - )} - DownloadedIconComponent={() => ( - - )} - /> + {episodes?.length || 0 > 0 ? ( + ( + + )} + DownloadedIconComponent={() => ( + + )} + /> + ) : null} {isFetching ? ( @@ -186,6 +206,13 @@ export const SeasonPicker: React.FC = ({ item, initialSeasonIndex }) => { )) )} + {episodes?.length || 0 > 0 ? ( + + + No episodes for this season + + + ) : null} );