Moved the now playing api to the layout

Author: navneetsharmaui

src/lib/shared/components/now-playing/NowPlaying.svelte

@@ -53,25 +53,8 @@
 </style>
 
 <script lang="ts">
-	import { onDestroy, onMount } from 'svelte';
 	import { nowPlayingSong } from '$stores';
-	import ExternalLink from '$lib/shared/ui/components/external-link/ExternalLink.svelte';
-
-	let clearSetTimeout: NodeJS.Timeout;
-	const getCurrentlyPlayingSong = (): void => {
-		fetch(`/api/now-playing.json`)
-			.then((res) => res.json())
-			.then((response) => nowPlayingSong.set(response));
-
-		clearSetTimeout = setTimeout(getCurrentlyPlayingSong, 120000);
-	};
-	onMount(async () => {
-		getCurrentlyPlayingSong();
-	});
-
-	onDestroy(() => {
-		clearTimeout(clearSetTimeout);
-	});
+	import ExternalLink from '$ui/components/external-link/ExternalLink.svelte';
 </script>
 
 <div class="flex flex-row-reverse sm:flex-row mb-8 space-x-0 sm:space-x-2 w-full">

src/routes/__layout.svelte

@@ -1,8 +1,10 @@
 <script lang="ts">
 	// Start: Local Imports
 
+	import { onDestroy, onMount } from 'svelte';
+	import { nowPlayingSong } from '$stores';
 	// Start: External Imports
-	
+	import '../styles/tailwind.postcss';
 
 	// End: External Imports
 
@@ -58,6 +60,22 @@
 		htmlTag.className = event.detail.dark ? 'dark' : 'light';
 	};
 
+	let clearSetTimeout: NodeJS.Timeout;
+	const getCurrentlyPlayingSong = (): void => {
+		fetch(`/api/now-playing.json`)
+			.then((res) => res.json())
+			.then((response) => nowPlayingSong.set(response));
+
+		clearSetTimeout = setTimeout(getCurrentlyPlayingSong, 120000);
+	};
+	onMount(async () => {
+		getCurrentlyPlayingSong();
+	});
+
+	onDestroy(() => {
+		clearTimeout(clearSetTimeout);
+	});
+
 	// End: Local component methods
 </script>