UI fixes

src/routes/applications/[id]/__layout.svelte

@@ -88,7 +88,14 @@
 		try {
 			const { buildId } = await post(`/applications/${id}/deploy.json`, { ...application });
 			toast.push('Deployment queued.');
-			return await goto(`/applications/${id}/logs/build?buildId=${buildId}`);
+			console.log($page.url);
+			if ($page.url.pathname.startsWith(`/applications/${id}/logs/build`)) {
+				return window.location.assign(`/applications/${id}/logs/build?buildId=${buildId}`);
+			} else {
+				return await goto(`/applications/${id}/logs/build?buildId=${buildId}`, {
+					replaceState: true
+				});
+			}
 		} catch ({ error }) {
 			return errorNotification(error);
 		}

src/routes/applications/[id]/configuration/_GithubRepositories.svelte

@@ -151,8 +151,8 @@
 		<a href={`/sources/${application.gitSource.id}`}><button>Configure it now</button></a>
 	</div>
 {:else}
-	<form on:submit|preventDefault={handleSubmit}>
-		<div>
+	<form on:submit|preventDefault={handleSubmit} class="flex flex-col justify-center text-center">
+		<div class="flex-col space-y-3 md:space-y-0 space-x-1">
 			{#if loading.repositories}
 				<select name="repository" disabled class="w-96">
 					<option selected value="">Loading repositories...</option>

src/routes/applications/[id]/configuration/source.svelte

@@ -41,7 +41,7 @@
 		gitlabApp: Prisma.GitlabApp;
 		githubApp: Prisma.GithubApp;
 	};
-	sources = sources.filter(
+	const filteredSources = sources.filter(
 		(source) =>
 			(source.type === 'github' && source.githubAppId && source.githubApp.installationId) ||
 			(source.type === 'gitlab' && source.gitlabAppId)
@@ -59,8 +59,8 @@
 <div class="flex space-x-1 p-6 font-bold">
 	<div class="mr-4 text-2xl tracking-tight">Select a Git Source</div>
 </div>
-<div class="flex justify-center">
-	{#if !sources || sources.length === 0}
+<div class="flex flex-col justify-center">
+	{#if !filteredSources || filteredSources.length === 0}
 		<div class="flex-col">
 			<div class="pb-2">No configurable Git Source found</div>
 			<div class="flex justify-center">
@@ -83,7 +83,7 @@
 		</div>
 	{:else}
 		<div class="flex flex-wrap justify-center">
-			{#each sources as source}
+			{#each filteredSources as source}
 				<div class="p-2">
 					<form on:submit|preventDefault={() => handleSubmit(source.id)}>
 						<button

src/routes/applications/[id]/index.svelte

@@ -109,7 +109,7 @@
 		try {
 			await post(`/applications/${id}/check.json`, { fqdn: application.fqdn, forceSave });
 			await post(`/applications/${id}.json`, { ...application });
-			return window.location.reload();
+			return toast.push('Configurations saved.');
 		} catch ({ error }) {
 			if (error.startsWith('DNS not set')) {
 				forceSave = true;

src/routes/applications/[id]/logs/build/_BuildLog.svelte

@@ -84,7 +84,7 @@
 			<LoadingLogs />
 		{/if}
 		{#if currentStatus === 'queued'}
-			<div class="text-center">Queued and waiting for execution.</div>
+			<div class="text-center font-bold text-xl">Queued and waiting for execution.</div>
 		{:else}
 			<div class="flex justify-end sticky top-0 p-2">
 				<button

src/routes/applications/[id]/logs/build/index.svelte

@@ -54,7 +54,6 @@
 
 					return build;
 				});
-				return window.location.reload();
 			} catch ({ error }) {
 				return errorNotification(error);
 			}

src/routes/applications/index.svelte

@@ -1,34 +1,19 @@
-<script context="module" lang="ts">
-	import type { Load } from '@sveltejs/kit';
-	export const load: Load = async ({ fetch }) => {
-		const endpoint = '/applications.json';
-		const res = await fetch(endpoint);
-
-		if (res.ok) {
-			return {
-				props: {
-					...(await res.json())
-				}
-			};
-		}
-
-		return {
-			status: res.status,
-			error: new Error(`Could not load ${endpoint}`)
-		};
-	};
-</script>
-
 <script lang="ts">
 	export let applications: Array<Application>;
 	import { session } from '$app/stores';
 	import Application from './_Application.svelte';
+	import { post } from '$lib/api';
+	import { goto } from '$app/navigation';
+	async function newApplication() {
+		const { id } = await post('/applications/new', {});
+		return await goto(`/applications/${id}`, { replaceState: true });
+	}
 </script>
 
 <div class="flex space-x-1 p-6 font-bold">
 	<div class="mr-4 text-2xl ">Applications</div>
 	{#if $session.isAdmin}
-		<a href="/new/application" class="add-icon bg-green-600 hover:bg-green-500">
+		<div on:click={newApplication} class="add-icon cursor-pointer bg-green-600 hover:bg-green-500">
 			<svg
 				class="w-6"
 				xmlns="http://www.w3.org/2000/svg"
@@ -42,7 +27,7 @@
 					d="M12 6v6m0 0v6m0-6h6m-6 0H6"
 				/></svg
 			>
-		</a>
+		</div>
 	{/if}
 </div>
 <div class="flex flex-wrap justify-center">

src/routes/applications/new.ts

@@ -0,0 +1,16 @@
+import { getUserDetails, uniqueName } from '$lib/common';
+import * as db from '$lib/database';
+import { ErrorHandler } from '$lib/database';
+import type { RequestHandler } from '@sveltejs/kit';
+
+export const post: RequestHandler = async (event) => {
+	const { teamId, status, body } = await getUserDetails(event);
+	if (status === 401) return { status, body };
+	const name = uniqueName();
+	try {
+		const { id } = await db.newApplication({ name, teamId });
+		return { status: 201, body: { id } };
+	} catch (error) {
+		return ErrorHandler(error);
+	}
+};