Skip to content

Instantly share code, notes, and snippets.

@Georgegriff
Last active January 10, 2022 10:35
Show Gist options
  • Select an option

  • Save Georgegriff/1a47ca1552799a414c272086bddba04f to your computer and use it in GitHub Desktop.

Select an option

Save Georgegriff/1a47ca1552799a414c272086bddba04f to your computer and use it in GitHub Desktop.
hooks mutations article - TodoProvider
export const TodoContext = createContext();
export const TodoProvider = ({ children }) => {
const [apiResponse, setApiResponse] = useState(undefined);
const [draftTodos, setTodoList] = useState();
useEffect(() => {
const fetchTodos = async () => {
const res = await fetch("./todos.json");
const response = await res.json();
setApiResponse(response);
};
fetchTodos();
}, []);
// Transforming the data, use of useCallback looks odd here...
// We'll get to that!
const existingTodos = useCallback(() => {
const todoMap = new Map();
apiResponse?.todos.forEach((todo) => {
todoMap.set(todo.id, todo);
});
return todoMap;
}, [apiResponse]);
return return (
<TodoContext.Provider value={{
/* code coming soon */
}}>
{children}
</TodoContext.Provider>
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment