From 772c1e5e101adc0f6bab770981ac634653fd5fce Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Sun, 24 Dec 2023 03:11:43 -0800
Subject: fix(wrapped): null check top media

---
 src/lib/Tools/Wrapped.svelte | 120 +++++++++++++++++++++++--------------------
 1 file changed, 64 insertions(+), 56 deletions(-)

diff --git a/src/lib/Tools/Wrapped.svelte b/src/lib/Tools/Wrapped.svelte
index 28749d26..58a4cafb 100644
--- a/src/lib/Tools/Wrapped.svelte
+++ b/src/lib/Tools/Wrapped.svelte
@@ -516,66 +516,74 @@
 					<div class="categories-grid" style="padding-top: 0;">
 						<div class="category-grid pure-category category">
 							<div class="grid-item image-grid">
-								<a
-									href={`https://anilist.co/${topMedia.topGenreMedia.type.toLowerCase()}/${
-										topMedia.topGenreMedia.id
-									}`}
-									target="_blank"
-								>
-									<img
-										src={proxy(topMedia.topGenreMedia.coverImage.extraLarge)}
-										alt="Highest Rated Genre Cover"
-										class="cover-image"
-										on:load={updateWidth}
-									/>
-								</a>
-								<div>
-									<b>Highest Rated Genres</b>
-									<ol>
-										{#each topMedia.genres as genre}
-											<li>
-												<a
-													href={`https://anilist.co/search/anime?genres=${genre.genre}`}
-													target="_blank"
-												>
-													{genre.genre}: {genre.averageScore}%
-												</a>
-											</li>
-										{/each}
-									</ol>
-								</div>
+								{#if topMedia}
+									<a
+										href={`https://anilist.co/${topMedia.topGenreMedia.type.toLowerCase()}/${
+											topMedia.topGenreMedia.id
+										}`}
+										target="_blank"
+									>
+										<img
+											src={proxy(topMedia.topGenreMedia.coverImage.extraLarge)}
+											alt="Highest Rated Genre Cover"
+											class="cover-image"
+											on:load={updateWidth}
+										/>
+									</a>
+									<div>
+										<b>Highest Rated Genres</b>
+										<ol>
+											{#each topMedia.genres as genre}
+												<li>
+													<a
+														href={`https://anilist.co/search/anime?genres=${genre.genre}`}
+														target="_blank"
+													>
+														{genre.genre}: {genre.averageScore}%
+													</a>
+												</li>
+											{/each}
+										</ol>
+									</div>
+								{:else}
+									{@html nbsp('Loading top genres ...')}
+								{/if}
 							</div>
 						</div>
 						<div class="category-grid pure-category category">
 							<div class="grid-item image-grid">
-								<a
-									href={`https://anilist.co/${topMedia.topTagMedia.type.toLowerCase()}/${
-										topMedia.topTagMedia.id
-									}`}
-									target="_blank"
-								>
-									<img
-										src={proxy(topMedia.topTagMedia.coverImage.extraLarge)}
-										alt="Highest Rated Tag Cover"
-										class="cover-image"
-										on:load={updateWidth}
-									/>
-								</a>
-								<div>
-									<b>Highest Rated Tags</b>
-									<ol>
-										{#each topMedia.tags as tag}
-											<li>
-												<a
-													href={`https://anilist.co/search/anime?genres=${tag.tag}`}
-													target="_blank"
-												>
-													{tag.tag}: {tag.averageScore}%
-												</a>
-											</li>
-										{/each}
-									</ol>
-								</div>
+								{#if topMedia}
+									<a
+										href={`https://anilist.co/${topMedia.topTagMedia.type.toLowerCase()}/${
+											topMedia.topTagMedia.id
+										}`}
+										target="_blank"
+									>
+										<img
+											src={proxy(topMedia.topTagMedia.coverImage.extraLarge)}
+											alt="Highest Rated Tag Cover"
+											class="cover-image"
+											on:load={updateWidth}
+										/>
+									</a>
+									<div>
+										<b>Highest Rated Tags</b>
+										<ol>
+											{#each topMedia.tags as tag}
+												<li>
+													<a
+														href={`https://anilist.co/search/anime?genres=${tag.tag}`}
+														target="_blank"
+													>
+														{tag.tag}: {tag.averageScore}%
+													</a>
+												</li>
+											{/each}
+										</ol>
+									</div>
+								{:else}
+									{@html nbsp('Loading top tags ...')}
+								{/if}
 							</div>
 						</div>
 					</div>
-- 
cgit v1.2.3