gatsby-plugin-apollo-shopify/inject-provider.js

Gatsby plugin which injects a Shopify Apollo Client into the browser.

import React from 'react';
import { ApolloClient } from 'apollo-client';
import { ApolloProvider } from 'react-apollo';
import { createHttpLink } from 'apollo-link-http';
import { setContext } from 'apollo-link-context';
import { InMemoryCache } from 'apollo-cache-inmemory';

export default (({ element }, pluginOptions) => {
    const shopName = pluginOptions.shopName || {};
    const accessToken = pluginOptions.accessToken || {};
    const apiPath = pluginOptions.apiVersion ? `api/${pluginOptions.apiVersion}/graphql.json` : 'api/graphql';

    const httpLink = createHttpLink({ uri: `https://${shopName}.myshopify.com/${apiPath}` });

    const middlewareLink = setContext(() => ({
        headers: {
            'X-Shopify-Storefront-Access-Token': accessToken
        }
    }));

    const client = new ApolloClient({
        link: middlewareLink.concat(httpLink),
        cache: new InMemoryCache()
    });

    return React.createElement(
        ApolloProvider,
        { client: client },
        element
    );
});