import React, { useState, useCallback } from 'react' export const APIErrorContext = React.createContext({ errors: [], addError: () => {}, removeError: () => {} }) export default function APIErrorProvider ({ children }) { const [errors, setErrors] = useState([]) const removeError = (errorToRemove) => { setErrors(errors => errors.filter(error => error !== errorToRemove)) } const addError = (code, message, debug) => { setErrors(errors => ([...errors, { code, message, debug }])) } const contextValue = { errors, addError: useCallback((code, message, debug) => addError(code, message, debug), []), removeError: useCallback((error) => removeError(error), []) } return ( <APIErrorContext.Provider value={contextValue}> {children} </APIErrorContext.Provider> ) }