AppStateProvider.js

import React, { useEffect } from "react";

export const AppStateContext = React.createContext(null);

export default function AppStateProvider({ children }) {
  const [message, SetMessage] = React.useState();
  const [error, SetError] = React.useState();

  const state = {
    SetMessage: SetMessage,
    SetError: SetError
  };

  useEffect(() => {
    if (message !== undefined) alert(message);
  }, [message]);

  useEffect(() => {
    if (error !== undefined) alert(error);
  }, [error]);

  return (
    <AppStateContext.Provider value={state}>
      {children}
    </AppStateContext.Provider>
  );
}