diff --git a/materialious/src/lib/Api/index.ts b/materialious/src/lib/Api/index.ts index 9d5afc97..56bcf03b 100644 --- a/materialious/src/lib/Api/index.ts +++ b/materialious/src/lib/Api/index.ts @@ -186,9 +186,9 @@ export async function deleteUnsubscribe(authorId: string) { ); } -export async function getHistory(page: number = 1): Promise { +export async function getHistory(page: number = 1, maxResults: number = 20): Promise { const resp = await fetchErrorHandle( - await fetch(buildPath(`auth/history?page=${page}`), buildAuthHeaders()) + await fetch(buildPath(`auth/history?page=${page}&max_results=${maxResults}`), buildAuthHeaders()) ); return await resp.json(); } @@ -276,6 +276,15 @@ export async function addPlaylistVideo(playlistId: string, videoId: string) { ); } +export async function removePlaylistVideo(playlistId: string, indexId: string) { + await fetchErrorHandle( + await fetch(buildPath(`auth/playlists/${playlistId}/videos/${indexId}`), { + method: 'DELETE', + ...buildAuthHeaders() + }) + ); +} + export async function getDeArrow(videoId: string): Promise { const resp = await fetchErrorHandle( await fetch(`${get(deArrowInstance)}/api/branding?videoID=${videoId}`) diff --git a/materialious/src/lib/Api/model.ts b/materialious/src/lib/Api/model.ts index 2046fc82..dd1604b7 100644 --- a/materialious/src/lib/Api/model.ts +++ b/materialious/src/lib/Api/model.ts @@ -180,6 +180,7 @@ export interface Playlist { export interface PlaylistPageVideo extends PlaylistVideo { author: string; index: number; + indexId: string; authorId: string; viewCount: number; } diff --git a/materialious/src/lib/Search.svelte b/materialious/src/lib/Search.svelte index dcffa8fb..8bb50b24 100644 --- a/materialious/src/lib/Search.svelte +++ b/materialious/src/lib/Search.svelte @@ -23,28 +23,57 @@ suggestionsForSearch = (await getSearchSuggestions(event.target.value)).suggestions; }, 250); }; + + function handleSubmit() { + goto(`/search/${encodeURIComponent(search)}`); + } -
goto(`/search/${encodeURIComponent(search)}`)}> -
- search debouncedSearch(target)} - /> - {#if searchSuggestions} - + +
+ search + document.getElementById('search')?.focus()} /> + +
+ arrow_back + { + if (event.key === 'Enter') { + handleSubmit(); + } else { + debouncedSearch(event); + } + }} + /> + (search = '')}>close +
+ {#if searchSuggestions} {#each suggestionsForSearch as suggestion} - {suggestion} + (search = suggestion)} + class="row" + href={`/search/${encodeURIComponent(suggestion)}`} + > +
{suggestion}
+ {/each} - - {/if} + {/if} +
+ + diff --git a/materialious/src/routes/history/+page.svelte b/materialious/src/routes/history/+page.svelte index 9bc19456..3303b48a 100644 --- a/materialious/src/routes/history/+page.svelte +++ b/materialious/src/routes/history/+page.svelte @@ -18,13 +18,19 @@ async function loadPageHistory() { try { - const videoIds = await getHistory(currentPage); + const videoIds = await getHistory(currentPage, 20); let promises = []; for (const videoId of videoIds) { - promises.push(getVideo(videoId)); + promises.push( + getVideo(videoId).catch(() => { + return null; + }) + ); } - const loadedHistory = await Promise.all(promises); + const loadedHistory = (await Promise.all(promises)).filter((item) => { + return item !== null; + }) as VideoPlay[]; history = [...history, ...loadedHistory]; } catch (errorMessage: any) { error(500, errorMessage); @@ -34,6 +40,8 @@ async function loadMore(event: InfiniteEvent) { const pastHistoryLen = Number(history.length); + currentPage++; + await loadPageHistory(); if (pastHistoryLen === history.length) { diff --git a/materialious/src/routes/playlist/[slug]/+page.svelte b/materialious/src/routes/playlist/[slug]/+page.svelte index e899d9d8..c33e9c29 100644 --- a/materialious/src/routes/playlist/[slug]/+page.svelte +++ b/materialious/src/routes/playlist/[slug]/+page.svelte @@ -69,7 +69,7 @@

-
+

{data.playlist.description}

diff --git a/materialious/src/routes/watch/[slug]/+page.svelte b/materialious/src/routes/watch/[slug]/+page.svelte index ecd65e35..12b71d63 100644 --- a/materialious/src/routes/watch/[slug]/+page.svelte +++ b/materialious/src/routes/watch/[slug]/+page.svelte @@ -6,7 +6,8 @@ getComments, getPersonalPlaylists, getPlaylist, - postSubscribe + postSubscribe, + removePlaylistVideo } from '$lib/Api/index.js'; import type { PlaylistPage, PlaylistPageVideo } from '$lib/Api/model.js'; import Comment from '$lib/Comment.svelte'; @@ -294,8 +295,28 @@ } } - async function addVideoToPlaylist(playlistId: string) { - await addPlaylistVideo(playlistId, data.video.videoId); + async function toggleVideoToPlaylist(playlistId: string) { + if (!data.personalPlaylists) return; + + const selectedPlaylist = data.personalPlaylists.filter((item) => { + return item.playlistId === playlistId; + }); + + if (selectedPlaylist.length === 0) { + return; + } + + const videosToDelete = selectedPlaylist[0].videos.filter((item) => { + return item.videoId === data.video.videoId; + }); + + if (videosToDelete.length > 0) { + videosToDelete.forEach(async (toDelete) => { + await removePlaylistVideo(playlistId, toDelete.indexId); + }); + } else { + await addPlaylistVideo(playlistId, data.video.videoId); + } data.personalPlaylists = await getPersonalPlaylists(); } @@ -462,12 +483,22 @@