diff --git a/packages/builder/src/components/start/CreateAppModal.svelte b/packages/builder/src/components/start/CreateAppModal.svelte index 77e31a5823..d2232f7604 100644 --- a/packages/builder/src/components/start/CreateAppModal.svelte +++ b/packages/builder/src/components/start/CreateAppModal.svelte @@ -11,26 +11,44 @@ let name = "" let description = "" let loading = false + let error = {} const createNewApp = async () => { - const data = { name, description } - loading = true - try { - const response = await fetch("/api/applications", { - method: "POST", // *GET, POST, PUT, DELETE, etc. - credentials: "same-origin", // include, *same-origin, omit - headers: { - "Content-Type": "application/json", - // 'Content-Type': 'application/x-www-form-urlencoded', - }, - body: JSON.stringify(data), // body data type must match "Content-Type" header - }) + if ((name.length > 100 || name.length < 1) && description.length < 1) { + error = { + name: true, + description: true, + } + } else if (description.length < 1) { + error = { + name: false, + description: true, + } + } else if (name.length > 100 || name.length < 1) { + error = { + name: true, + } + } else { + error = {} + const data = { name, description } + loading = true + try { + const response = await fetch("/api/applications", { + method: "POST", // *GET, POST, PUT, DELETE, etc. + credentials: "same-origin", // include, *same-origin, omit + headers: { + "Content-Type": "application/json", + // 'Content-Type': 'application/x-www-form-urlencoded', + }, + body: JSON.stringify(data), // body data type must match "Content-Type" header + }) - const res = await response.json() + const res = await response.json() - $goto(`./${res._id}`) - } catch (error) { - console.error(error) + $goto(`./${res._id}`) + } catch (error) { + console.error(error) + } } } @@ -60,11 +78,19 @@ placeholder="Enter application name" on:change={e => (name = e.target.value)} on:input={e => (name = e.target.value)} /> + {#if error.name} + You need to enter a name for your application. + {/if}