diff options
Diffstat (limited to 'web/pw-server/src/routes/bots')
-rw-r--r-- | web/pw-server/src/routes/bots/[bot_name]/matches.svelte | 53 |
1 files changed, 31 insertions, 22 deletions
diff --git a/web/pw-server/src/routes/bots/[bot_name]/matches.svelte b/web/pw-server/src/routes/bots/[bot_name]/matches.svelte index a3c97cb..979054c 100644 --- a/web/pw-server/src/routes/bots/[bot_name]/matches.svelte +++ b/web/pw-server/src/routes/bots/[bot_name]/matches.svelte @@ -1,26 +1,21 @@ <script lang="ts" context="module"> import { ApiClient } from "$lib/api_client"; - import type { Match } from "$lib/api_types"; - - const PAGE_SIZE = "50"; export async function load({ params, fetch }) { try { const apiClient = new ApiClient(fetch); const botName = params["bot_name"]; - let { matches, has_next } = await apiClient.get("/api/matches", { bot: botName }); - - // TODO: should this be done client-side? - // if (query["after"]) { - // matches = matches.reverse(); - // } + const [allBots, allMaps] = await Promise.all([ + apiClient.get("/api/bots"), + apiClient.get("/api/maps"), + ]); return { props: { - matches, botName, - hasNext: has_next, + allBots, + allMaps, }, }; } catch (error) { @@ -33,20 +28,35 @@ </script> <script lang="ts"> - import LinkButton from "$lib/components/LinkButton.svelte"; import BotMatchList from "$lib/components/matches/BotMatchList.svelte"; - import { apiMatchtoBotMatch } from "$lib/matches"; + import Select from "svelte-select"; - export let matches: Match[]; - export let botName: string | null; - // whether a next page exists in the current iteration direction (before/after) - // export let hasNext: boolean; + export let botName: string; + export let allBots: object[]; + export let allMaps: object[]; - $: botMatches = matches.map((match) => apiMatchtoBotMatch(botName, match)); + let opponentName: string | undefined; + let mapName: string | undefined; </script> <div class="container"> - <BotMatchList {botMatches} /> + <div class="selections"> + <Select + items={allBots} + placeholder="Select opponent" + label="name" + itemId="name" + bind:justValue={opponentName} + /> + <Select + items={allMaps} + placeholder="Select map" + label="name" + itemId="name" + bind:justValue={mapName} + /> + </div> + <BotMatchList {botName} {opponentName} {mapName} /> </div> <style lang="scss"> @@ -56,9 +66,8 @@ width: 100%; } - .page-controls { + .selections { display: flex; - justify-content: center; - margin: 24px 0; + padding: 16px 4px; } </style> |