From 9ee581c4e31e9e4ac552b6a6e432240d3b820d7a Mon Sep 17 00:00:00 2001
From: orosmatthew <orosmatthew@pm.me>
Date: Mon, 22 Jan 2024 21:38:58 -0500
Subject: [PATCH] [web] Improve confirm modals

---
 .../admin/contests/[contestId]/+page.svelte   | 65 +++++++++++++------
 1 file changed, 46 insertions(+), 19 deletions(-)

diff --git a/web/src/routes/admin/contests/[contestId]/+page.svelte b/web/src/routes/admin/contests/[contestId]/+page.svelte
index 682fcd6..d94f3ed 100644
--- a/web/src/routes/admin/contests/[contestId]/+page.svelte
+++ b/web/src/routes/admin/contests/[contestId]/+page.svelte
@@ -8,6 +8,17 @@
 	export let data: PageData;
 
 	let confirmModal: ConfirmModal;
+
+	function enhanceConfirm(form: HTMLFormElement, text: string) {
+		enhance(form, async ({ cancel }) => {
+			if ((await confirmModal.prompt(text)) !== true) {
+				cancel();
+			}
+			return async ({ update }) => {
+				await update();
+			};
+		});
+	}
 </script>
 
 <svelte:head>
@@ -29,25 +40,41 @@
 		<a href="/admin/contests" class="btn btn-outline-primary">All Contests</a>
 	</div>
 	<div class="col-6 text-end">
-		<form
-			method="POST"
-			use:enhance={async ({ cancel }) => {
-				if ((await confirmModal.prompt('Are you sure?')) !== true) {
-					cancel();
-				}
-				return async ({ update }) => {
-					await update();
-				};
-			}}
-		>
-			{#if data.activeTeams === 0}
-				<button type="submit" formaction="?/delete" class="btn btn-danger">Delete</button>
-				<button type="submit" formaction="?/repo" class="btn btn-warning">Recreate Repos</button>
-				<button type="submit" formaction="?/start" class="btn btn-success">Start</button>
-			{:else}
-				<button type="submit" formaction="?/stop" class="btn btn-outline-danger">Stop</button>
-			{/if}
-		</form>
+		{#if data.activeTeams === 0}
+			<form
+				method="POST"
+				action="?/delete"
+				class="d-inline"
+				use:enhanceConfirm={'Are you sure you want to delete the contest? This WILL DELETE ALL DATA AND SUBMISSIONS!!'}
+			>
+				<button type="submit" class="btn btn-danger">Delete</button>
+			</form>
+			<form
+				method="POST"
+				action="?/repo"
+				class="d-inline"
+				use:enhanceConfirm={'Are you sure you want to recreate repos? This WILL DELETE ALL DATA on the repos currently.'}
+			>
+				<button type="submit" class="btn btn-warning">Recreate Repos</button>
+			</form>
+			<form
+				method="POST"
+				action="?/start"
+				class="d-inline"
+				use:enhanceConfirm={'Are you sure you want to start the contest?'}
+			>
+				<button type="submit" class="btn btn-success">Start</button>
+			</form>
+		{:else}
+			<form
+				method="POST"
+				action="?/stop"
+				class="d-inline"
+				use:enhanceConfirm={'Are you sure you want to stop the contest?'}
+			>
+				<button type="submit" class="btn btn-outline-danger">Stop</button>
+			</form>
+		{/if}
 	</div>
 </div>