fix(ui): replace form submit with explicit key and click handlers in image block

- remove form element and onSubmit in favor of a plain div
- add handleKeyDown to trigger submit on Enter key press
- attach onClick handler directly to the insert button with type="button"
This commit is contained in:
2026-04-26 16:03:28 -04:00
parent b721574e58
commit 5ecbf13348
@@ -18,12 +18,18 @@ function ImageBlock({ block, onChange, disabled }) {
} }
}, [block.src, disabled]); }, [block.src, disabled]);
function submit(e) { function submit() {
e.preventDefault();
if (!url.trim()) return; if (!url.trim()) return;
onChange?.({ src: url.trim() }); onChange?.({ src: url.trim() });
} }
function handleKeyDown(e) {
if (e.key === 'Enter') {
e.preventDefault();
submit();
}
}
function handleAltChange(e) { function handleAltChange(e) {
onChange?.({ alt: e.target.value }); onChange?.({ alt: e.target.value });
} }
@@ -39,10 +45,7 @@ function ImageBlock({ block, onChange, disabled }) {
if (!block.src) { if (!block.src) {
return ( return (
<form <div className="flex items-center gap-2 rounded-lg border border-dashed border-neutral-300 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-800/40 px-3 py-3">
onSubmit={submit}
className="flex items-center gap-2 rounded-lg border border-dashed border-neutral-300 dark:border-neutral-700 bg-neutral-50 dark:bg-neutral-800/40 px-3 py-3"
>
<Image01Icon width={18} height={18} className="text-neutral-500" /> <Image01Icon width={18} height={18} className="text-neutral-500" />
<input <input
ref={inputRef} ref={inputRef}
@@ -50,17 +53,19 @@ function ImageBlock({ block, onChange, disabled }) {
placeholder="URL de l'image (https://…)" placeholder="URL de l'image (https://…)"
value={url} value={url}
onChange={(e) => setUrl(e.target.value)} onChange={(e) => setUrl(e.target.value)}
onKeyDown={handleKeyDown}
disabled={disabled} disabled={disabled}
className="flex-1 px-2 py-1 text-sm rounded border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-900 text-neutral-900 dark:text-white outline-none focus:border-blue-500" className="flex-1 px-2 py-1 text-sm rounded border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-900 text-neutral-900 dark:text-white outline-none focus:border-blue-500"
/> />
<button <button
type="submit" type="button"
onClick={submit}
disabled={disabled || !url.trim()} disabled={disabled || !url.trim()}
className="px-3 py-1 text-sm rounded bg-blue-600 hover:bg-blue-700 disabled:opacity-50 disabled:hover:bg-blue-600 text-white" className="px-3 py-1 text-sm rounded bg-blue-600 hover:bg-blue-700 disabled:opacity-50 disabled:hover:bg-blue-600 text-white"
> >
Insérer Insérer
</button> </button>
</form> </div>
); );
} }