fix(todos): only clear title on submit, preserve product dropdown selection

Replace form.reset() with a titleRef so successful submission clears
the title input while leaving the selected product unchanged.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Janpeter Visser 2026-04-25 19:20:37 +02:00
parent 4d08c92af5
commit ca6510c98e

View file

@ -42,15 +42,15 @@ interface TodoListProps {
function QuickInput({ products, isDemo }: { products: Product[]; isDemo: boolean }) {
const [state, formAction] = useActionState(createTodoAction, undefined)
const ref = useRef<HTMLFormElement>(null)
const titleRef = useRef<HTMLInputElement>(null)
useEffect(() => {
if (state?.success) ref.current?.reset()
if (state?.success && titleRef.current) titleRef.current.value = ''
}, [state])
return (
<div className="mb-6 space-y-1">
<form ref={ref} action={formAction} className="flex gap-2">
<form action={formAction} className="flex gap-2">
<select
name="productId"
disabled={isDemo}
@ -60,6 +60,7 @@ function QuickInput({ products, isDemo }: { products: Product[]; isDemo: boolean
{products.map(p => <option key={p.id} value={p.id}>{p.name}</option>)}
</select>
<Input
ref={titleRef}
name="title"
placeholder={isDemo ? 'Alleen-lezen in demo' : 'Nieuwe todo… (Enter om op te slaan)'}
disabled={isDemo}