diff --git a/src/routes/todos.tsx b/src/routes/todos.tsx
index 1dcefac..4ad16f1 100644
--- a/src/routes/todos.tsx
+++ b/src/routes/todos.tsx
@@ -19,7 +19,15 @@ function Todo() {
   const handleCreateTodo = (e: FormEvent<HTMLFormElement>) => {
     e.preventDefault()
     if (newTodoTitle.trim()) {
-      createMutation.mutate(newTodoTitle.trim())
+      createMutation.mutate(
+        { title: newTodoTitle.trim() },
+        {
+          onSuccess: () => {
+            setNewTodoTitle('')
+            listQuery.refetch()
+          },
+        },
+      )
     }
   }
 
@@ -28,13 +36,31 @@ function Todo() {
   }
 
   const handleToggleTodo = (id: string, currentCompleted: boolean) => {
-    updateMutation.mutate({ id, completed: !currentCompleted })
+    updateMutation.mutate(
+      {
+        id,
+        data: { completed: !currentCompleted },
+      },
+      {
+        onSuccess: () => {
+          listQuery.refetch()
+        },
+      },
+    )
   }
 
   const handleDeleteTodo = (id: string) => {
-    deleteMutation.mutate(id)
+    deleteMutation.mutate(
+      { id },
+      {
+        onSuccess: () => {
+          listQuery.refetch()
+        },
+      },
+    )
   }
 
+  const todos = listQuery.data
   const completedCount = todos.filter((todo) => todo.completed).length
   const totalCount = todos.length
   const progress = totalCount > 0 ? (completedCount / totalCount) * 100 : 0