diff options
author | Ilion Beyst <ilion.beyst@gmail.com> | 2022-08-16 20:00:49 +0200 |
---|---|---|
committer | Ilion Beyst <ilion.beyst@gmail.com> | 2022-08-16 20:00:49 +0200 |
commit | 87f6a9c455726ad0cf502a316d98db8da1d1806a (patch) | |
tree | 988341499ba3704abd1df2fff28ad1e712e03632 /web/pw-server/src/routes | |
parent | 03ca884c4049f289d9b7c4700a2142967772fb4d (diff) | |
download | planetwars.dev-87f6a9c455726ad0cf502a316d98db8da1d1806a.tar.xz planetwars.dev-87f6a9c455726ad0cf502a316d98db8da1d1806a.zip |
consume matches pagination api
Diffstat (limited to 'web/pw-server/src/routes')
-rw-r--r-- | web/pw-server/src/routes/bots/[bot_name].svelte | 4 | ||||
-rw-r--r-- | web/pw-server/src/routes/matches/index.svelte | 19 |
2 files changed, 16 insertions, 7 deletions
diff --git a/web/pw-server/src/routes/bots/[bot_name].svelte b/web/pw-server/src/routes/bots/[bot_name].svelte index cf8c42a..99278df 100644 --- a/web/pw-server/src/routes/bots/[bot_name].svelte +++ b/web/pw-server/src/routes/bots/[bot_name].svelte @@ -5,7 +5,7 @@ const apiClient = new ApiClient(fetch); try { - const [botData, matches] = await Promise.all([ + const [botData, matchesPage] = await Promise.all([ apiClient.get(`/api/bots/${params["bot_name"]}`), apiClient.get("/api/matches", { bot: params["bot_name"], count: "20" }), ]); @@ -19,7 +19,7 @@ bot, owner, versions, - matches, + matches: matchesPage["matches"], }, }; } catch (error) { diff --git a/web/pw-server/src/routes/matches/index.svelte b/web/pw-server/src/routes/matches/index.svelte index 8de375b..3ae6603 100644 --- a/web/pw-server/src/routes/matches/index.svelte +++ b/web/pw-server/src/routes/matches/index.svelte @@ -15,7 +15,7 @@ bot: botName, }; - let matches = await apiClient.get("/api/matches", removeUndefined(query)); + let { matches, has_next } = await apiClient.get("/api/matches", removeUndefined(query)); // TODO: should this be done client-side? if (query["after"]) { @@ -26,6 +26,8 @@ props: { matches, botName, + hasNext: has_next, + query, }, }; } catch (error) { @@ -47,12 +49,13 @@ </script> <script lang="ts"> - import { goto } from "$app/navigation"; - import MatchList from "$lib/components/matches/MatchList.svelte"; export let matches: object[]; export let botName: string | null; + // whether a next page exists in the current iteration direction (before/after) + export let hasNext: boolean; + export let query: object; type Cursor = { before?: string; @@ -71,7 +74,7 @@ } function olderMatchesLink(matches: object[]): string { - if (matches.length == 0) { + if (matches.length == 0 || (query["before"] && !hasNext)) { return null; } const lastTimestamp = matches[matches.length - 1]["timestamp"]; @@ -79,7 +82,13 @@ } function newerMatchesLink(matches: object[]): string { - if (matches.length == 0) { + if ( + matches.length == 0 || + (query["after"] && !hasNext) || + // we are viewing the first page, so there should be no newer matches. + // alternatively, we could show a "refresh" here. + (!query["before"] && !query["after"]) + ) { return null; } const firstTimestamp = matches[0]["timestamp"]; |