diff --git a/components/todos/todo-list.tsx b/components/todos/todo-list.tsx
index 1cdfe0f..998ebac 100644
--- a/components/todos/todo-list.tsx
+++ b/components/todos/todo-list.tsx
@@ -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}