From f70417fb60a2aadf8e8323a13a6dcfda51a7b6c7 Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Tue, 26 Sep 2023 17:31:12 -0700
Subject: refactor(anime): move list to component

---
 src/lib/List/AnimeList.svelte | 74 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 74 insertions(+)
 create mode 100644 src/lib/List/AnimeList.svelte

(limited to 'src/lib/List/AnimeList.svelte')

diff --git a/src/lib/List/AnimeList.svelte b/src/lib/List/AnimeList.svelte
new file mode 100644
index 00000000..ad39cae5
--- /dev/null
+++ b/src/lib/List/AnimeList.svelte
@@ -0,0 +1,74 @@
+<script lang="ts">
+	/* eslint svelte/no-at-html-tags: "off" */
+
+	import type { AniListAuthorisation, UserIdentity } from '$lib/AniList/identity';
+	import type { Media } from '$lib/AniList/media';
+	import Error from '$lib/Error.svelte';
+	import { airingTime, cleanCache, totalEpisodes, updateMedia } from '$lib/Media/anime';
+	import settings from '../../stores/settings';
+	import ListTitle from './ListTitle.svelte';
+
+	export let endTime: number;
+	export let cleanMedia: (media: Media[], displayUnresolved: boolean) => Media[];
+	export let animeLists: Promise<Media[]>;
+	export let user: AniListAuthorisation;
+	export let identity: UserIdentity;
+	export let displayUnresolved: boolean;
+</script>
+
+{#await animeLists}
+	<ListTitle anime />
+
+	<ul><li>Loading ...</li></ul>
+{:then media}
+	{@const cleanedMedia = cleanMedia(media, displayUnresolved)}
+
+	<ListTitle time={endTime / 1000} count={cleanedMedia.length} anime />
+
+	{#if cleanedMedia.length === 0}
+		<ul>
+			<li>
+				No anime to display. <a
+					href={'#'}
+					on:click={() => (animeLists = cleanCache(user, identity))}>Force refresh</a
+				>
+			</li>
+		</ul>
+	{/if}
+
+	<ul>
+		{#each cleanedMedia as anime}
+			<li>
+				<a
+					href={$settings.linkToAniList
+						? `https://anilist.co/anime/${anime.id}`
+						: `https://www.livechart.me/search?q=${
+								anime.title.native || anime.title.english || anime.title.romaji
+						  }`}
+					target="_blank"
+				>
+					{anime.title.english || anime.title.romaji || anime.title.native}
+				</a>
+				<span style="opacity: 50%;">|</span>
+				{(anime.mediaListEntry || { progress: 0 }).progress}{@html totalEpisodes(anime)}
+				<a
+					href={'#'}
+					on:click={() =>
+						updateMedia(
+							anime.id,
+							anime.mediaListEntry?.progress,
+							() => (animeLists = cleanCache(user, identity))
+						)}>+</a
+				>
+				[{anime.nextAiringEpisode?.episode === -1
+					? '?'
+					: (anime.nextAiringEpisode?.episode || 1) - 1}]
+				{@html airingTime(anime)}
+			</li>
+		{/each}
+	</ul>
+{:catch}
+	<ListTitle time={0} count={'?'} anime />
+
+	<Error />
+{/await}
-- 
cgit v1.2.3