React Provider Example

react-provider-example.tsx

const UserContext = React.createContext(maybe<User>());

const App: React.FC<AppProps> = ({ user }) => (
  <UserContext.Provider value={maybe(user)}>
    <Header />
  </UserContext.Provider>
);
  
const Header = () => (
  <>
    <Logo />
    <Account />
  </>
);
  
const Account = () => (
  <UserContext.Consumer>
    {user =>
      user.isNothing()
        ? <SignInButton />
        : <p>Signed in as {user.value().name}</p>
    }
  </UserContext.Consumer>
);