@apollo/client TypeError: link.request is not a function

Question

I've got this react component throwing at me this error:

Uncaught TypeError: link.request is not a function
    at ApolloLink.execute (ApolloLink.js:65)
    at QueryManager.getObservableFromLink (QueryManager.js:716)
    at QueryManager.getResultsFromLink (QueryManager.js:752)
    at resultsFromLink (QueryManager.js:999)

I'm not sure where this comes from, it's from the useQuery line in this component:

import { useQuery, gql } from "@apollo/client";

import React from "react"
import PropTypes from "prop-types"

const GET_INSURANCES = gql`
query insurances {
  insurances {
    id
    provider
    product
    user{
      name
      email
    }
  }
}
`;

function App() {
  // console.log('running graphql query');
  const { loading, error, data } =  useQuery(GET_INSURANCES);
  // console.log('graphql query done');

  if (loading) return <div>Loading...</div>;
  if (error) return <div>Error :  ${error.message}</div>;

  return (
    <React.Fragment>
      <p>{data}</p>
    </React.Fragment>
  );
}

export default App

Any ideas?

update

here's the code of the wrapping class

import {
  ApolloClient,
  InMemoryCache,
  ApolloProvider
} from "@apollo/client";

import React from "react"
import PropTypes from "prop-types"

import App from './App';

const client = new ApolloClient({ 
  link:  'http://localhost:3000/graphql',
  cache: new InMemoryCache() 
} )

class InsuranceStatus extends React.Component {
  render () {
    return (
      <ApolloProvider client={client}>
        <React.Fragment>
          Status: {this.props.status}
          <App/>
        </React.Fragment>
      </ApolloProvider>
    );
  }
}

InsuranceStatus.propTypes = {
  status: PropTypes.string
};
export default InsuranceStatus

Answer 1

I solved this by importing createHttpLink from @apollo/client, and then setting my link like this:

const httpLink = createHttpLink({
  uri: 'http://localhost:3000'
});

const client = new ApolloClient({
  link: httpLink,
  cache: new InMemoryCache()
})

I have seen plenty of tutorials setting the link as you did, but I only got past the error message by using createHttpLink