fix: Radarr & Sonarr requests fail due to wrong indexerId, fix: Invalid backdrop urls

src/lib/components/Card/card.ts

@@ -10,7 +10,7 @@ import type Card from './Card.svelte';
 import { TMDB_BACKDROP_SMALL } from '$lib/constants';
 
 export const fetchCardTmdbMovieProps = async (movie: TmdbMovie2): Promise<ComponentProps<Card>> => {
-	const backdropUri = getTmdbMovieBackdrop(movie.id || 0);
+	const backdropUri = await getTmdbMovieBackdrop(movie.id || 0);
 
 	const movieAny = movie as any;
 	const genres =
@@ -25,7 +25,7 @@ export const fetchCardTmdbMovieProps = async (movie: TmdbMovie2): Promise<Compon
 		title: movie.title || '',
 		genres,
 		runtimeMinutes: movie.runtime,
-		backdropUrl: TMDB_BACKDROP_SMALL + (await backdropUri) || '',
+		backdropUrl: backdropUri ? TMDB_BACKDROP_SMALL + backdropUri : '',
 		rating: movie.vote_average || 0
 	};
 };
@@ -33,7 +33,7 @@ export const fetchCardTmdbMovieProps = async (movie: TmdbMovie2): Promise<Compon
 export const fetchCardTmdbSeriesProps = async (
 	series: TmdbSeries2
 ): Promise<ComponentProps<Card>> => {
-	const backdropUri = getTmdbSeriesBackdrop(series.id || 0);
+	const backdropUri = await getTmdbSeriesBackdrop(series.id || 0);
 
 	const seriesAny = series as any;
 	const genres =
@@ -48,7 +48,7 @@ export const fetchCardTmdbSeriesProps = async (
 		title: series.name || '',
 		genres,
 		runtimeMinutes: series.episode_run_time?.[0],
-		backdropUrl: TMDB_BACKDROP_SMALL + (await backdropUri) || '',
+		backdropUrl: backdropUri ? TMDB_BACKDROP_SMALL + backdropUri : '',
 		rating: series.vote_average || 0,
 		type: 'series'
 	};

src/lib/components/Modal/Modal.ts

@@ -3,8 +3,8 @@ import { writable } from 'svelte/store';
 import TitlePageModal from '../TitlePageLayout/TitlePageModal.svelte';
 
 type ModalItem = {
-	id: Symbol;
-	group: Symbol;
+	id: symbol;
+	group: symbol;
 	component: ConstructorOfATypedSvelteComponent;
 	props: Record<string, any>;
 };
@@ -14,7 +14,7 @@ function createDynamicModalStack() {
 		top: undefined
 	});
 
-	function close(symbol: Symbol) {
+	function close(symbol: symbol) {
 		store.update((s) => {
 			s.stack = s.stack.filter((i) => i.id !== symbol);
 			s.top = s.stack[s.stack.length - 1];
@@ -22,7 +22,7 @@ function createDynamicModalStack() {
 		});
 	}
 
-	function closeGroup(group: Symbol) {
+	function closeGroup(group: symbol) {
 		store.update((s) => {
 			s.stack = s.stack.filter((i) => i.group !== group);
 			s.top = s.stack[s.stack.length - 1];
@@ -33,7 +33,7 @@ function createDynamicModalStack() {
 	function create(
 		component: ConstructorOfATypedSvelteComponent,
 		props: Record<string, any>,
-		group: Symbol | undefined = undefined
+		group: symbol | undefined = undefined
 	) {
 		const id = Symbol();
 		const item = { id, component, props, group: group || id };
@@ -60,7 +60,7 @@ function createDynamicModalStack() {
 
 export const modalStack = createDynamicModalStack();
 
-let lastTitleModal: Symbol | undefined = undefined;
+let lastTitleModal: symbol | undefined = undefined;
 export function openTitleModal(tmdbId: number, type: TitleType) {
 	if (lastTitleModal) {
 		modalStack.close(lastTitleModal);

src/lib/components/Navbar/TitleSearchModal.svelte

@@ -9,7 +9,7 @@
 	import { onMount } from 'svelte';
 	import type { TitleType } from '$lib/types';
 
-	export let modalId: Symbol;
+	export let modalId: symbol;
 
 	let inputValue = '';
 	let inputElement: HTMLInputElement;

src/lib/components/RequestModal/EpisodeSelectModal.svelte

@@ -6,8 +6,8 @@
 	import ModalHeader from '../Modal/ModalHeader.svelte';
 	import RequestModal from './RequestModal.svelte';
 
-	export let modalId: Symbol;
-	export let groupId: Symbol;
+	export let modalId: symbol;
+	export let groupId: symbol;
 
 	export let sonarrId: number;
 	export let seasonNumber: number;
@@ -22,8 +22,8 @@
 		modalStack.create(
 			RequestModal,
 			{
-				episode,
-				sonarrId,
+				sonarrEpisodeId: episode.id,
+				// sonarrId,
 				groupId
 			},
 			groupId

src/lib/components/RequestModal/RequestModal.svelte

@@ -16,10 +16,11 @@
 
 	const dispatch = createEventDispatcher();
 
-	export let modalId: Symbol;
-	export let groupId: Symbol | undefined = undefined;
+	export let modalId: symbol;
+	export let groupId: symbol | undefined = undefined;
 
 	export let title = 'Releases';
+
 	export let radarrId: number | undefined = undefined;
 	export let sonarrEpisodeId: number | undefined = undefined;
 	export let seasonPack: { sonarrId: number; seasonNumber: number } | undefined = undefined;
@@ -66,10 +67,10 @@
 		};
 	}
 
-	function handleDownload(guid: string) {
+	function handleDownload(guid: string, indexerId: number) {
 		downloadFetchingGuid = guid;
 		if (radarrId) {
-			downloadRadarrMovie(guid).then((ok) => {
+			downloadRadarrMovie(guid, indexerId).then((ok) => {
 				dispatch('download');
 				downloadFetchingGuid = undefined;
 				if (ok) {
@@ -77,7 +78,7 @@
 				}
 			});
 		} else {
-			downloadSonarrEpisode(guid).then((ok) => {
+			downloadSonarrEpisode(guid, indexerId).then((ok) => {
 				dispatch('download');
 				downloadFetchingGuid = undefined;
 				if (ok) {
@@ -130,7 +131,10 @@
 								<div class="text-zinc-400">{formatSize(release?.size || 0)}</div>
 								{#if release.guid !== downloadingGuid}
 									<IconButton
-										on:click={() => release.guid && handleDownload(release.guid)}
+										on:click={() =>
+											release.guid &&
+											release.indexerId &&
+											handleDownload(release.guid, release.indexerId)}
 										disabled={downloadFetchingGuid === release.guid}
 									>
 										<Plus size={20} />

src/lib/components/RequestModal/SeriesRequestModal.svelte

@@ -8,7 +8,7 @@
 	import EpisodeSelectModal from './EpisodeSelectModal.svelte';
 	import RequestModal from './RequestModal.svelte';
 
-	export let modalId: Symbol;
+	export let modalId: symbol;
 	export let sonarrId: number;
 	export let seasons: number;
 	export let heading = 'Seasons';

src/lib/components/TitlePageLayout/TitlePageModal.svelte

@@ -7,7 +7,7 @@
 
 	export let tmdbId: number;
 	export let type: TitleType;
-	export let modalId: Symbol;
+	export let modalId: symbol;
 
 	function handleCloseModal() {
 		modalStack.close(modalId);

src/lib/components/VideoPlayer/VideoPlayer.svelte

@@ -16,7 +16,7 @@
 	import { playerState } from './VideoPlayer';
 	import { modalStack } from '../Modal/Modal';
 
-	export let modalId: Symbol;
+	export let modalId: symbol;
 
 	let uiVisible = true;