Added additional error handling

materialious/src/routes/+error.svelte

@@ -0,0 +1,27 @@
+<script src="ts">
+	import { page } from '$app/stores';
+</script>
+
+<div class="space"></div>
+
+<div style="display: flex;align-items: center;flex-direction: column;">
+	<svg xmlns="http://www.w3.org/2000/svg" height="200" viewBox="0 -960 960 960" width="200"
+		><path
+			d="M480-420q-68 0-123.5 38.5T276-280h408q-25-63-80.5-101.5T480-420Zm-168-60 44-42 42 42 42-42-42-42 42-44-42-42-42 42-44-42-42 42 42 44-42 42 42 42Zm250 0 42-42 44 42 42-42-42-42 42-44-42-42-44 42-42-42-42 42 42 44-42 42 42 42ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-400Zm0 320q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Z"
+		/></svg
+	>
+	<h2>Oh no! You've encountered a error.</h2>
+
+	<a
+		href="https://github.com/WardPearce/Materialious/issues/new"
+		class="link"
+		target="_blank"
+		rel="noopener noreferrer"><h3>Report it here</h3></a
+	>
+
+	{#if $page.error}
+		<article>
+			<code style="white-space: pre-line;word-wrap: break-word;">{$page.error.message}</code>
+		</article>
+	{/if}
+</div>

materialious/src/routes/subscriptions/+page.ts

@@ -1,6 +1,13 @@
 import { getFeed } from '$lib/Api/index.js';
+import { error } from '@sveltejs/kit';
 
 export async function load({ params }) {
+  const feed = await getFeed(100, 1);
+
+  if ('errorBacktrace' in feed) (
+    error(500, (feed as { errorBacktrace: string; }).errorBacktrace)
+  );
+
   return {
     feed: await getFeed(100, 1)
   };

materialious/src/routes/trending/+page.ts

@@ -1,5 +1,12 @@
 import { getTrending } from '$lib/Api/index.js';
+import { error } from '@sveltejs/kit';
 
 export async function load({ params }) {
-  return { trending: await getTrending() };
+  const trending = await getTrending();
+
+  if ('errorBacktrace' in trending) (
+    error(500, (trending as { errorBacktrace: string; }).errorBacktrace)
+  );
+
+  return { trending: trending };
 }

materialious/src/routes/watch/[slug]/+page.ts

@@ -1,10 +1,17 @@
 import { amSubscribed, getComments, getDislikes, getVideo, postHistory } from '$lib/Api/index.js';
 import { phaseDescription } from '$lib/misc';
+import { error } from '@sveltejs/kit';
 import { get } from 'svelte/store';
 import { auth, playerProxyVideos, returnYtDislikes } from '../../../store';
 
 export async function load({ params }) {
-  const video = await getVideo(params.slug, get(playerProxyVideos));
+  let video;
+  video = await getVideo(params.slug, get(playerProxyVideos));
+
+  if ('errorBacktrace' in video) (
+    error(500, (video as { errorBacktrace: string; }).errorBacktrace)
+  );
+
   if (get(auth)) {
     postHistory(video.videoId);
   }
@@ -16,6 +23,10 @@ export async function load({ params }) {
     comments = null;
   }
 
+  if (comments && 'errorBacktrace' in comments) {
+    comments = null;
+  }
+
   let returnYTDislikes;
   try {
     returnYTDislikes = get(returnYtDislikes) ? await getDislikes(params.slug) : null;