Added user history

materialious/src/lib/Api/index.ts

@@ -88,3 +88,15 @@ export async function deleteUnsubscribe(authorId: string) {
     ...buildAuthHeaders()
   });
 }
+
+export async function getHistory(page: number = 1): Promise<string[]> {
+  const resp = await fetch(buildPath(`auth/history?page=${page}`), buildAuthHeaders());
+  return await resp.json();
+}
+
+export async function postHistory(videoId: string) {
+  await fetch(buildPath(`auth/history/${videoId}`), {
+    method: 'POST',
+    ...buildAuthHeaders()
+  });
+}

materialious/src/routes/history/+page.svelte

@@ -0,0 +1,40 @@
+<script lang="ts">
+	import { getHistory, getVideo } from '$lib/Api';
+	import type { VideoPlay } from '$lib/Api/model';
+	import PageLoading from '$lib/PageLoading.svelte';
+	import Thumbnail from '$lib/Thumbnail.svelte';
+	import { onMount } from 'svelte';
+	import { activePage } from '../../store';
+
+	activePage.set('history');
+
+	let history: VideoPlay[] = [];
+	let loaded = false;
+
+	async function loadPageHistory(page: number = 1) {
+		const videoIds = await getHistory(page);
+		for (const videoId of videoIds) {
+			history = [...history, await getVideo(videoId)];
+		}
+	}
+
+	onMount(async () => {
+		await loadPageHistory();
+		loaded = true;
+	});
+</script>
+
+{#if loaded}
+	<div class="page right active">
+		<div class="space"></div>
+		<div class="grid">
+			{#each history as video}
+				<div class="s12 m6 l2">
+					<Thumbnail {video} />
+				</div>
+			{/each}
+		</div>
+	</div>
+{:else}
+	<PageLoading />
+{/if}

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

@@ -1,7 +1,12 @@
-import { amSubscribed, getComments, getDislikes, getVideo } from '$lib/Api/index.js';
+import { amSubscribed, getComments, getDislikes, getVideo, postHistory } from '$lib/Api/index.js';
+import { get } from 'svelte/store';
+import { auth } from '../../../store';
 
 export async function load({ params }) {
   const video = await getVideo(params.slug);
+  if (get(auth)) {
+    postHistory(video.videoId);
+  }
   return {
     video: video,
     returnYTDislikes: await getDislikes(params.slug),