Move Cancel left and rename Back to Accept in the block modal

This commit is contained in:
NeilClack
2026-09-11 18:30:08 -05:00
parent 46d7cf66b8
commit 15bb51582b
2 changed files with 34 additions and 14 deletions
+14 -14
View File
@@ -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"
@@ -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();
});
});