Code Quiz

MVVM ViewModel State Mutation Bug

Spot the subtle state-layer bug in a React Native MVVM view model hook.

Codetypescript

// ViewModel layer for a Todo feature module
function useTodoViewModel() {
  const [todos, setTodos] = useState<Todo[]>([]);

  const addTodo = (title: string) => {
    const newTodo = { id: Date.now(), title, done: false };
    todos.push(newTodo);
    setTodos(todos);
  };

  const toggle = (id: number) => {
    setTodos(prev =>
      prev.map(t => (t.id === id ? { ...t, done: !t.done } : t))
    );
  };

  return { todos, addTodo, toggle };
}

What is the bug that prevents the View from re-rendering when a todo is added?

← PreviousBridge vs JSI Architecture Trade-offs Next →Layered Architecture and State Ownership