How to use the apollo-client-preset.HttpLink function in apollo-client-preset

private async createClient(user: User, path: string) {
    // Create a configuration from the user
    const config = await GraphQLConfig.create(user, path, null, true);
    // Construct an HTTP link that knows how to authenticate against ROS
    const httpLink = concat(
      config.authLink,
      new HttpLink({ uri: config.httpEndpoint }),
    );
    // Construct a link based on WebSocket that can be used for real-time subscriptions
    const webSocketLink = new WebSocketLink({
      options: {
        connectionParams: config.connectionParams,
      },
      uri: config.webSocketEndpoint,
    });
    // Combine the links in a way that splits based on the operation
    const link = split(
      ({ query }) => {
        const definition = getMainDefinition(query);
        return (
          definition.kind === "OperationDefinition" &&
          definition.operation === "subscription"
        );

const wsLink = new WebSocketLink({
    uri: !isDev ? prodUri.socket : uri.socket,
    options: {
      reconnect: true,
      connectionParams: () => {
        return new Promise(async resolve => {
          const token = await AsyncStorage.getItem(USER_ACCESS_TOKEN);
          resolve({
            Authorization: token ? `Bearer ${token}` : null
          });
        });
      }
    }
  });

  const httpLink = new HttpLink({
    uri: !isDev ? prodUri.link : uri.link
  });

  const authMiddleware = setContext(
    (_, { headers }) =>
      new Promise(async resolve => {
        // get the authentication token from local storage if it exists
        const token = await AsyncStorage.getItem(USER_ACCESS_TOKEN);
        resolve({
          headers: {
            ...headers,
            authorization: token ? `Bearer ${token}` : null
          }
        });
      })
  );

export function create({ initialState }: InitApollo): ApolloClient {
  if (process.browser) {
    persist();
  }

  return new ApolloClient({
    connectToDevTools: process.browser, // comes from webpack
    cache: cache().restore(initialState || {}),
    ssrMode: !process.browser,
    link: new HttpLink({ uri: API }) as ApolloLink, // TODO: types are wrong in graphql
    queryDeduplication: true
  });
}

// Store
const persistConfig = {
  key: 'root',
  storage,
}
const persistedReducer = persistReducer(persistConfig, mainReducer)

const finalCreateStore = applyMiddleware(...middlewares)(createStore);
const store = finalCreateStore(persistedReducer);

let persistor = persistStore(store)

// APOLLO

// HttpLink
const httpLink = new HttpLink({
  uri: process.env.HTTP_BACKEND_URL,
  fetch: fetch
});

const middlewareLink = new ApolloLink((operation, forward) => {
  const token = localStorage.getItem(process.env.AUTH_TOKEN);

  operation.setContext({
    headers: {
      Authorization: token ? `Bearer ${token}` : ""
    }
  });

  return forward(operation);
});

export function setupApolloClient() {
  const wsLink = new WebSocketLink({
    uri: 'ws://localhost:4000/',
    options: {
      reconnect: true,
    },
  });

  const httpLink = new HttpLink({
    uri: 'http://localhost:4000/',
  });

  const authMiddleware = setContext(
    (_, { headers }) =>
      new Promise(async resolve => {
        // get the authentication token from local storage if it exists
        const token = await getAuthorizationToken();

        cachedToken = token;

        // return the headers to the context so httpLink can read them
        resolve({
          headers: {
            ...headers,
            authorization: token ? `Bearer ${token}` : null,

import React from 'react'
import { ApolloProvider } from 'react-apollo'
import { ApolloClient, HttpLink, InMemoryCache } from 'apollo-client-preset'
import ListPage from './components/ListPage'

const httpLink = new HttpLink({ uri: 'http://localhost:4000' })

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

export default class App extends React.Component {
  render() {
    return (
      
        
      
    )
  }
}

*
 * @format
 * @flow
 */

import React, { Component } from 'react';

import { ApolloProvider } from 'react-apollo';
import { ApolloClient, HttpLink, InMemoryCache } from 'apollo-client-preset';

import AppContainer from './src/AppContainer';

import ListPage from './src/components/ListPage';

const simpleApi = 'https://api.graph.cool/simple/v1/cjrh62bkka7l501132k2sp85b';
const httpLink = new HttpLink({ uri: simpleApi });

const client = new ApolloClient({
  link: httpLink,
  cache: new InMemoryCache(),
});
export default class App extends Component {
  render() {
    return (
      
        
      
    );
  }
}

import React from 'react'
import ReactDOM from 'react-dom'
import './index.css'
import App from './App'
import registerServiceWorker from './registerServiceWorker'
import { ApolloProvider } from 'react-apollo'
import { ApolloClient, HttpLink, InMemoryCache } from 'apollo-client-preset'

const httpLink = new HttpLink({ uri: 'http://localhost:4000' })

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

ReactDOM.render(
  
    
  , 
  document.getElementById('root')
)
registerServiceWorker()

import {
  ApolloClient,
  ApolloLink,
  InMemoryCache,
  HttpLink,
} from 'apollo-client-preset';

const httpLink = new HttpLink({
  uri: process.env.REACT_APP_GRAPHCOOL_SIMPLE_API,
});

const middlewareLink = new ApolloLink((operation, forward) => {
  const token = localStorage.getItem('graphcoolToken');
  const authorizationHeader = token ? `Bearer ${token}` : null;

  operation.setContext({
    headers: {
      authorization: authorizationHeader,
    },
  });

  return forward(operation);
});