xerbalind/planetwars.dev
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases 1 Wiki Activity

show bot name validations in frontend

Browse source
This commit is contained in:
Ilion Beyst 2022-04-15 19:18:27 +02:00
parent 0027fef74e
commit a41b4c48cb
1 changed files with 16 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
web/pw-server/src/lib/components/SubmitPane.svelte
View file

@ -1,8 +1,8 @@
<script lang="ts"> <script lang="ts">
import { get_session_token } from "$lib/auth"; import { get_session_token } from "$lib/auth";
import { currentUser } from "$lib/stores/current_user"; import { currentUser } from "$lib/stores/current_user";
import { createEventDispatcher, onMount } from "svelte"; import { createEventDispatcher, onMount } from "svelte";
import Select from "svelte-select"; import Select from "svelte-select";
export let editSession; export let editSession;
@ -11,7 +11,7 @@ import { createEventDispatcher, onMount } from "svelte";
let selectedOpponent = undefined; let selectedOpponent = undefined;
let botName: string | undefined = undefined; let botName: string | undefined = undefined;
let saveErrorText = undefined; let saveErrors: string[] = [];
onMount(async () => { onMount(async () => {
const res = await fetch("/api/bots", { const res = await fetch("/api/bots", {
@ -57,7 +57,7 @@ import { createEventDispatcher, onMount } from "svelte";
method: "POST", method: "POST",
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
"Authorization": `Bearer ${get_session_token()}`, Authorization: `Bearer ${get_session_token()}`,
}, },
body: JSON.stringify({ body: JSON.stringify({
bot_name: botName, bot_name: botName,
@ -69,10 +69,13 @@ import { createEventDispatcher, onMount } from "svelte";
if (response.ok) { if (response.ok) {
dispatch("botSaved", responseData); dispatch("botSaved", responseData);
// clear errors // clear errors
saveErrorText = undefined; saveErrors = [];
} else { } else {
if (responseData["error"] === "BotNameTaken") { const error = responseData["error"];
saveErrorText = "Bot name is already taken"; if (error["type"] === "validation_failed") {
saveErrors = error["validation_errors"];
} else if (error["type"] === "bot_name_taken") {
saveErrors = ["Bot name is already taken"];
} else { } else {
// unexpected error // unexpected error
throw responseData; throw responseData;
@ -101,8 +104,12 @@ import { createEventDispatcher, onMount } from "svelte";
{#if $currentUser} {#if $currentUser}
<div>Add your bot to the opponents list</div> <div>Add your bot to the opponents list</div>
<input type="text" class="bot-name-input" placeholder="bot name" bind:value={botName} /> <input type="text" class="bot-name-input" placeholder="bot name" bind:value={botName} />
{#if saveErrorText} {#if saveErrors.length > 0}
<div class="error-text">{saveErrorText}</div> <ul>
{#each saveErrors as errorText}
<li class="error-text">{errorText}</li>
{/each}
</ul>
{/if} {/if}
<button class="submit-button save-button" on:click={saveBot}>Save</button> <button class="submit-button save-button" on:click={saveBot}>Save</button>
{:else} {:else}