Header.js

import Loader from '../components/Loader'
import UserError from '../components/UserError'
import useUser from '../hooks/useUser';

const Header = ({ id }) => {
    const { user, error, loading } = useUser(id);

     if (loading) return <Loader />
     if (error) return <UserError />

      return <div>
           <Avatar img={user.imageUrl} />         
           ...
      </div>
}