individualcomponents.js

const User = ({ id, children }) => {
  <Query query={GET_USER} variables={{ userId }}>
    {({ loading, data }) => (children({ user: data}))
  </Query>
}

const UserStartup = ({ user: { email }, children }) => (
  <Query query={GET_HACKERNEWS_STARTUP} variables={{ email }}>
    {({ loading, data: { startup } }) => (
      <Query query={GET_REPO} variables = {{ startup }}>
        {({loading, error, data: { correspondingRepo: repo } }) => (
          children({ repo, email, startup })
        )}
      </Query>
    )}
  </Query>
)

const UI = ({ repo, email, startup, loading, error }) => {
  if (loading) return <p>Loading...</p>;
  if (error) return <p>Error...</p>;

  return (
    <div>
        <p> corresponding Repo for { email } and { startup } : { repo } </p>
    </div>
  );
}