import { useMemo } from 'react' ; import { ApolloClient , InMemoryCache } from '@apollo/client' ; import { createUploadLink } from 'apollo-upload-client' ; import { setContext } from '@apollo/client/link/context' ; let apolloClient ; let token ; const apiUrl = 'https://api.keycapsets.com/graphql' ; const authLink = setContext ( ( _ , { headers } ) => { if ( typeof window !== 'undefined' ) { token = localStorage . getItem ( 'TOKEN' ) ; } return { headers : { ... headers , authorization : token ? `Bearer ${ token }` : null , } , } ; } ) ; function createApolloClient ( ) { const isBrowser = typeof window === 'undefined' ; return new ApolloClient ( { ssrMode : isBrowser , link : authLink . concat ( createUploadLink ( { uri : apiUrl , } ) ) , cache : new InMemoryCache ( ) , } ) ; } export function initializeApollo ( initialState = null ) { const _apolloClient = apolloClient ?? createApolloClient ( ) ; if ( initialState ) { const existingCache = _apolloClient . extract ( ) ; _apolloClient . cache . restore ( { ... initialState , ... existingCache } ) ; } if ( typeof window === 'undefined' ) return _apolloClient ; if ( ! apolloClient ) apolloClient = _apolloClient ; return _apolloClient ; } export function useApollo ( initialState ) { const store = useMemo ( ( ) => initializeApollo ( initialState ) , [ initialState ] ) ; return store ; }