apollo-angular.config.ts

import { HttpLink } from 'apollo-angular/http';
import { ApolloLink, InMemoryCache } from '@apollo/client/core';
import { setContext } from '@apollo/client/link/context';
import { environment } from '@environments/environment';
import { extractFiles } from 'extract-files';

export function createApolloClient(httpLink: HttpLink) {
    const uri = `${environment.backendURL}/graphql`;

    const auth = setContext((operation, context) => {
        const accessToken = localStorage.getItem('accessToken');
        return {
            ...context['headers'],
            headers: {
                Authorization: accessToken ? `Bearer ${accessToken}` : '',
            },
        };
    });

    const link = ApolloLink.from([
        auth,
        httpLink.create({
            uri,
            useMultipart: true,
            extractFiles,
        }),
    ]);

    const cache = new InMemoryCache();

    const defaultOptions = {
        watchQuery: {
            fetchPolicy: 'cache-first',
        },
        query: {
            fetchPolicy: 'cache-first',
        },
    };

    return {
        link,
        cache,
        defaultOptions,
    };
}