Move Cancel left and rename Back to Accept in the block modal
This commit is contained in:
@@ -316,16 +316,8 @@
|
|||||||
<div
|
<div
|
||||||
class="flex shrink-0 items-center justify-between gap-3 border-t border-slate-200 px-6 py-4 dark:border-slate-800"
|
class="flex shrink-0 items-center justify-between gap-3 border-t border-slate-200 px-6 py-4 dark:border-slate-800"
|
||||||
>
|
>
|
||||||
<div>
|
<div class="flex items-center gap-3">
|
||||||
{#if step === 'browse'}
|
{#if step === 'details' && mode === 'edit' && blockId}
|
||||||
<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}
|
|
||||||
<button
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
name="intent"
|
name="intent"
|
||||||
@@ -336,9 +328,6 @@
|
|||||||
Delete
|
Delete
|
||||||
</button>
|
</button>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex items-center gap-3">
|
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onclick={() => onClose?.()}
|
onclick={() => onClose?.()}
|
||||||
@@ -346,7 +335,18 @@
|
|||||||
>
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</button>
|
</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
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
name="intent"
|
name="intent"
|
||||||
|
|||||||
@@ -113,4 +113,24 @@ describe('BlockModal', () => {
|
|||||||
expect(typeof result).toBe('function');
|
expect(typeof result).toBe('function');
|
||||||
await expect.element(page.getByRole('alert')).not.toBeInTheDocument();
|
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();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user