fix(anime): call subsplease once

2 files changed, 61 insertions, 66 deletions

diff --git a/src/lib/List/Anime/AnimeListTemplate.svelte b/src/lib/List/Anime/AnimeListTemplate.svelte
index 9b02fa53..957376a1 100644
--- a/src/lib/List/Anime/AnimeListTemplate.svelte
+++ b/src/lib/List/Anime/AnimeListTemplate.svelte
@@ -28,31 +28,31 @@
 	let pendingUpdate: number | null = null;
 </script>
 
-{#await animeLists}
-	{#if previousAnimeList}
-		<CleanAnimeList
-			media={previousAnimeList}
-			{title}
-			bind:animeLists
-			{user}
-			{identity}
-			{endTime}
-			bind:lastUpdatedMedia
-			{completed}
-			bind:previousAnimeList
-			bind:pendingUpdate
-		/>
-	{:else}
-		<ListTitle custom={title} />
+{#await fetch(`/api/subsplease?tz=${Intl.DateTimeFormat().resolvedOptions().timeZone}`).then( (r) => r.json() )}
+	<ListTitle custom={title} />
 
-		<ul><li>Loading ...</li></ul>
-	{/if}
-{:then media}
-	{#await fetch(`/api/subsplease?tz=${Intl.DateTimeFormat().resolvedOptions().timeZone}`).then( (r) => r.json() )}
-		<ListTitle custom={title} />
+	<ul><li>Loading ...</li></ul>
+{:then subsPlease}
+	{#await animeLists}
+		{#if previousAnimeList}
+			<CleanAnimeList
+				media={previousAnimeList}
+				{title}
+				bind:animeLists
+				{user}
+				{identity}
+				{endTime}
+				bind:lastUpdatedMedia
+				{completed}
+				bind:previousAnimeList
+				bind:pendingUpdate
+			/>
+		{:else}
+			<ListTitle custom={title} />
 
-		<ul><li>Loading ...</li></ul>
-	{:then subsPlease}
+			<ul><li>Loading ...</li></ul>
+		{/if}
+	{:then media}
 		<CleanAnimeList
 			media={cleanMedia(media, $settings.displayUnresolved, subsPlease, plannedOnly)}
 			{title}
@@ -62,12 +62,15 @@
 			{endTime}
 			bind:lastUpdatedMedia
 			{completed}
+			{subsPlease}
 			bind:previousAnimeList
 			bind:pendingUpdate
 		/>
+	{:catch}
+		<ListTitle time={0} count={-1337} custom={title} />
+
+		<Error />
 	{/await}
 {:catch}
-	<ListTitle time={0} count={-1337} custom={title} />
-
-	<Error />
+	<Error type="Subtitle release data" />
 {/await}
diff --git a/src/lib/List/Anime/CleanAnimeList.svelte b/src/lib/List/Anime/CleanAnimeList.svelte
index 64af9ddd..67d6797e 100644
--- a/src/lib/List/Anime/CleanAnimeList.svelte
+++ b/src/lib/List/Anime/CleanAnimeList.svelte
@@ -11,6 +11,7 @@
 	import MediaTitle from '../MediaTitleDisplay.svelte';
 	import { outboundLink } from '$lib/Media/links';
 	import { onDestroy } from 'svelte';
+	import type { SubsPlease } from '$lib/Media/Anime/Airing/Subtitled/subsPlease';
 
 	export let media: Media[];
 	export let title: string;
@@ -22,6 +23,7 @@
 	export let completed = false;
 	export let previousAnimeList: Media[];
 	export let pendingUpdate: number | null;
+	export let subsPlease: SubsPlease | null = null;
 
 	const keyCacher = setInterval(
 		() => (media = media),
@@ -75,52 +77,42 @@
 					{#if title !== 'Upcoming Episodes' || !$settings.displayCountdownRightAligned}
 						<span style="opacity: 50%;">|</span>
 					{/if}
-					{#await fetch(`/api/subsplease?tz=${Intl.DateTimeFormat().resolvedOptions().timeZone}`).then( (r) => r.json() )}
-						<span
-							style={`opacity: 50%; ${
-								$settings.displayCountdownRightAligned ? 'float: right;' : ''
-							}`}
-						>
-							...
-						</span>
-					{:then subsPlease}
-						{#if title !== 'Upcoming Episodes'}
-							<!-- {anime.mediaListEntry?.progress || 0}{@html totalEpisodes(anime)} -->
-							{pendingUpdate === anime.id ? progress + 1 : progress}{@html totalEpisodes(anime)}
-							<a
-								href={'#'}
-								style={pendingUpdate === anime.id ? 'pointer-events: none; opacity: 50%;' : ''}
-								on:click={() => {
-									if (pendingUpdate !== anime.id) {
-										lastUpdatedMedia = anime.id;
-										pendingUpdate = anime.id;
+					{#if title !== 'Upcoming Episodes'}
+						<!-- {anime.mediaListEntry?.progress || 0}{@html totalEpisodes(anime)} -->
+						{pendingUpdate === anime.id ? progress + 1 : progress}{@html totalEpisodes(anime)}
+						<a
+							href={'#'}
+							style={pendingUpdate === anime.id ? 'pointer-events: none; opacity: 50%;' : ''}
+							on:click={() => {
+								if (pendingUpdate !== anime.id) {
+									lastUpdatedMedia = anime.id;
+									pendingUpdate = anime.id;
 
-										updateMedia(anime.id, anime.mediaListEntry?.progress, () => {
-											const mediaListEntry = media.find((m) => m.id === anime.id)?.mediaListEntry;
+									updateMedia(anime.id, anime.mediaListEntry?.progress, () => {
+										const mediaListEntry = media.find((m) => m.id === anime.id)?.mediaListEntry;
 
-											if (mediaListEntry) mediaListEntry.progress = progress + 1;
+										if (mediaListEntry) mediaListEntry.progress = progress + 1;
 
-											previousAnimeList = media;
-											animeLists = cleanCache(user, identity);
-											pendingUpdate = null;
-										});
-									}
-								}}>+</a
-							>
-							{#if !completed}
-								[{anime.nextAiringEpisode?.episode === -1
-									? '?'
-									: (anime.nextAiringEpisode?.episode || 1) - 1}]
-								<span class:countdown={$settings.displayCountdownRightAligned}>
-									{@html airingTime(anime, subsPlease)}
-								</span>
-							{/if}
-						{:else}
+										previousAnimeList = media;
+										animeLists = cleanCache(user, identity);
+										pendingUpdate = null;
+									});
+								}
+							}}>+</a
+						>
+						{#if !completed}
+							[{anime.nextAiringEpisode?.episode === -1
+								? '?'
+								: (anime.nextAiringEpisode?.episode || 1) - 1}]
 							<span class:countdown={$settings.displayCountdownRightAligned}>
-								{@html airingTime(anime, subsPlease, true)}
+								{@html airingTime(anime, subsPlease)}
 							</span>
 						{/if}
-					{/await}
+					{:else}
+						<span class:countdown={$settings.displayCountdownRightAligned}>
+							{@html airingTime(anime, subsPlease, true)}
+						</span>
+					{/if}
 				</span>
 			</li>
 		{/if}