Stream personal playlists

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

@@ -39,10 +39,13 @@
 	});
 
 	let subscribed: boolean = false;
-	data.streamed.subscribed.then((isSubbed) => {
-		subscribed = isSubbed;
+	data.streamed.subscribed.then((streamedIsSubbed) => {
+		subscribed = streamedIsSubbed;
 	});
 
+	let personalPlaylists: PlaylistPage[] | null = null;
+	data.streamed.personalPlaylists?.then((streamPlaylists) => (personalPlaylists = streamPlaylists));
+
 	activePageStore.set(null);
 
 	let playlistVideos: PlaylistPageVideo[] = [];
@@ -303,9 +306,9 @@
 	}
 
 	async function toggleVideoToPlaylist(playlistId: string) {
-		if (!data.personalPlaylists) return;
+		if (!personalPlaylists) return;
 
-		const selectedPlaylist = data.personalPlaylists.filter((item) => {
+		const selectedPlaylist = personalPlaylists.filter((item) => {
 			return item.playlistId === playlistId;
 		});
 
@@ -325,7 +328,7 @@
 			await addPlaylistVideo(playlistId, data.video.videoId);
 		}
 
-		data.personalPlaylists = await getPersonalPlaylists();
+		personalPlaylists = await getPersonalPlaylists();
 	}
 
 	async function loadMoreComments() {
@@ -492,12 +495,12 @@
 							</menu></button
 						>
 					{/if}
-					{#if data.personalPlaylists}
+					{#if personalPlaylists}
 						<button class="border">
 							<i>add</i>
 							<div class="tooltip">{$_('player.addToPlaylist')}</div>
 							<menu class="no-wrap">
-								{#each data.personalPlaylists as personalPlaylist}
+								{#each personalPlaylists as personalPlaylist}
 									<a
 										href="#add"
 										on:click={async () => await toggleVideoToPlaylist(personalPlaylist.playlistId)}

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

@@ -6,7 +6,6 @@ import {
 	getVideo,
 	postHistory
 } from '$lib/Api/index.js';
-import type { PlaylistPage } from '$lib/Api/model';
 import { phaseDescription } from '$lib/misc';
 import { error } from '@sveltejs/kit';
 import { get } from 'svelte/store';
@@ -38,11 +37,10 @@ export async function load({ params, url }) {
 		});
 	}
 
-	let personalPlaylists: PlaylistPage[] | null;
-
+	let personalPlaylists;
 	if (get(authStore)) {
 		postHistory(video.videoId);
-		personalPlaylists = await getPersonalPlaylists();
+		personalPlaylists = getPersonalPlaylists();
 	} else {
 		personalPlaylists = null;
 	}
@@ -68,9 +66,9 @@ export async function load({ params, url }) {
 		video: video,
 		content: phaseDescription(video.descriptionHtml),
 		playlistId: url.searchParams.get('playlist'),
-		personalPlaylists: personalPlaylists,
 		downloadOptions: downloadOptions,
 		streamed: {
+			personalPlaylists: personalPlaylists,
 			returnYTDislikes: returnYTDislikes,
 			comments: comments,
 			subscribed: amSubscribed(video.authorId),