Dispatching Actions to Update State

Illustrate how to dispatch actions to update the state, such as adding a new todo item, using the `useStoreActions` hook, highlighting the pattern for immutable state updates.

import { useStoreActions } from 'easy-peasy'; // Importing the useStoreActions hook from easy-peasy

This piece of code shows how to import the necessary hook to dispatch actions in a component.

const addTodo = useStoreActions(actions => actions.todos.add); // Accessing the add action from our todos model

Here, we access the 'add' action from the 'todos' model using the useStoreActions hook. This action will be used to update the state.

const newTodo = { id: Date.now(), text: 'Learn easy-peasy', completed: false }; // Creating a new todo item

This constructs a new todo item object that we want to add to our store's state.

addTodo(newTodo); // Dispatching the action to add the new todo item to our state

Finally, we dispatch the 'add' action, passing the newTodo object as an argument. This updates the state immutably by adding the new todo item.