From 6573d684a013f04b6c604d8bd326a35773892723 Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Mon, 25 Sep 2023 21:43:26 -0700
Subject: refactor(upcoming): title component

---
 src/lib/List/UpcomingAnimeList.svelte | 10 ++++------
 src/routes/+page.svelte               |  3 ++-
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/lib/List/UpcomingAnimeList.svelte b/src/lib/List/UpcomingAnimeList.svelte
index 41ffcee3..d45b3633 100644
--- a/src/lib/List/UpcomingAnimeList.svelte
+++ b/src/lib/List/UpcomingAnimeList.svelte
@@ -8,6 +8,7 @@
 	import lastPruneTimes from '../../stores/lastPruneTimes';
 	import settings from '../../stores/settings';
 	import { airingTime, cleanCache } from '$lib/Media/anime';
+	import ListTitle from './Due/ListTitle.svelte';
 
 	export let user: AniListAuthorisation;
 	export let identity: UserIdentity;
@@ -75,16 +76,13 @@
 </script>
 
 {#await animeLists}
-	<summary>Upcoming Episodes [...] <small style="opacity: 50%">...s</small></summary>
+	<ListTitle custom="Upcoming Episodes" />
 
 	<ul><li>Loading ...</li></ul>
 {:then media}
 	{@const cleanedMedia = cleanMedia(media, displayUnresolved)}
 
-	<summary
-		>Upcoming Episodes [{cleanedMedia.length}]
-		<small style="opacity: 50%">{endTime / 1000}s</small></summary
-	>
+	<ListTitle count={cleanedMedia.length} time={endTime / 1000} custom="Upcoming Episodes" />
 
 	{#if cleanedMedia.length === 0}
 		<ul>
@@ -116,7 +114,7 @@
 		{/each}
 	</ul>
 {:catch}
-	<summary>Upcoming Episodes [?] <small style="opacity: 50%">0s</small></summary>
+	<ListTitle count="?" time="0" custom="Upcoming Episodes" />
 
 	<ul>
 		<li>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index f617f618..54e433eb 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -91,7 +91,8 @@
 					displayUnresolved={$settings.displayUnresolved}
 				/>
 			{:else}
-				<summary>Upcoming Episodes [...] <small style="opacity: 50%">...s</small></summary>
+				<ListTitle custom="Upcoming Episodes" />
+
 				<ul><li>Loading ...</li></ul>
 			{/if}
 		</details>
-- 
cgit v1.2.3