From 15bb51582b4020b53b37bef9d42e3cb67197cb2f Mon Sep 17 00:00:00 2001
From: NeilClack <cnclack@pm.me>
Date: Fri, 11 Sep 2026 18:30:08 -0500
Subject: [PATCH] Move Cancel left and rename Back to Accept in the block modal

---
 src/lib/components/schedule/BlockModal.svelte | 28 +++++++++----------
 .../schedule/BlockModal.svelte.spec.ts        | 20 +++++++++++++
 2 files changed, 34 insertions(+), 14 deletions(-)

diff --git a/src/lib/components/schedule/BlockModal.svelte b/src/lib/components/schedule/BlockModal.svelte
index 1743433..305e61a 100644
--- a/src/lib/components/schedule/BlockModal.svelte
+++ b/src/lib/components/schedule/BlockModal.svelte
@@ -316,16 +316,8 @@
 				<div
 					class="flex shrink-0 items-center justify-between gap-3 border-t border-slate-200 px-6 py-4 dark:border-slate-800"
 				>
-					<div>
-						{#if step === 'browse'}
-							<button
-								type="button"
-								onclick={() => (step = 'details')}
-								class="rounded-md border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-700 transition hover:bg-slate-50 dark:border-slate-700 dark:bg-slate-900 dark:text-slate-300 dark:hover:bg-slate-800"
-							>
-								Back
-							</button>
-						{:else if mode === 'edit' && blockId}
+					<div class="flex items-center gap-3">
+						{#if step === 'details' && mode === 'edit' && blockId}
 							<button
 								type="submit"
 								name="intent"
@@ -336,9 +328,6 @@
 								Delete
 							</button>
 						{/if}
-					</div>
-
-					<div class="flex items-center gap-3">
 						<button
 							type="button"
 							onclick={() => onClose?.()}
@@ -346,7 +335,18 @@
 						>
 							Cancel
 						</button>
-						{#if step === 'details'}
+					</div>
+
+					<div class="flex items-center gap-3">
+						{#if step === 'browse'}
+							<button
+								type="button"
+								onclick={() => (step = 'details')}
+								class="rounded-md bg-indigo-600 px-4 py-2 text-sm font-medium text-white transition hover:bg-indigo-700"
+							>
+								Accept
+							</button>
+						{:else}
 							<button
 								type="submit"
 								name="intent"
diff --git a/src/lib/components/schedule/BlockModal.svelte.spec.ts b/src/lib/components/schedule/BlockModal.svelte.spec.ts
index b9f66cb..30ef6a0 100644
--- a/src/lib/components/schedule/BlockModal.svelte.spec.ts
+++ b/src/lib/components/schedule/BlockModal.svelte.spec.ts
@@ -113,4 +113,24 @@ describe('BlockModal', () => {
 		expect(typeof result).toBe('function');
 		await expect.element(page.getByRole('alert')).not.toBeInTheDocument();
 	});
+
+	it('shows Cancel with Accept in the browse step, and Accept returns to the details', async () => {
+		mount();
+
+		const browse = page.getByRole('button', { name: 'Browse proclamations' });
+		await expect.element(browse).toBeInTheDocument();
+		(browse.element() as HTMLElement).click();
+
+		await expect.element(page.getByRole('button', { name: 'Cancel' })).toBeInTheDocument();
+		const accept = page.getByRole('button', { name: 'Accept' });
+		await expect.element(accept).toBeInTheDocument();
+		await expect
+			.element(page.getByRole('button', { name: 'Create Block' }))
+			.not.toBeInTheDocument();
+
+		(accept.element() as HTMLElement).click();
+
+		await expect.element(page.getByRole('button', { name: 'Create Block' })).toBeInTheDocument();
+		await expect.element(page.getByRole('button', { name: 'Accept' })).not.toBeInTheDocument();
+	});
 });