import React from "react" ; import Head from "next/head" ; import { ApolloProvider } from "@apollo/react-hooks" ; import { ApolloClient , InMemoryCache , HttpLink } from "apollo-boost" ; import { persistCache } from "apollo-cache-persist" ; import fetch from "isomorphic-unfetch" ; let apolloClient = null ; export function withApollo ( PageComponent , { ssr = true } = { } ) { const WithApollo = ( { apolloClient , apolloState , ... pageProps } ) => { const client = apolloClient || initApolloClient ( apolloState ) ; return ( < ApolloProvider client = { client } > < PageComponent { ... pageProps } / > < /ApolloProvider>); } ; if ( process . env . NODE_ENV !== "production" ) { const displayName = PageComponent . displayName || PageComponent . name || "Component" ; if ( displayName === "App" ) { console . warn ( "This withApollo HOC only works with PageComponents." ) ; } WithApollo . displayName = `withApollo(${ displayName })` ; } if ( ssr || PageComponent . getInitialProps ) { WithApollo . getInitialProps = async ( ctx ) => { const { AppTree } = ctx ; const apolloClient = ( ctx . apolloClient = initApolloClient ( ) ) ; let pageProps = { } ; if ( PageComponent . getInitialProps ) { pageProps = await PageComponent . getInitialProps ( ctx ) ; } if ( typeof window === "undefined" ) { if ( ctx . res && ctx . res . finished ) { return pageProps ; } if ( ssr ) { try { const { getDataFromTree } = await import ( "@apollo/react-ssr" ) ; await getDataFromTree ( < AppTree pageProps = { { ... pageProps , apolloClient } } />); } catch ( error ) { console . error ( "Error while running `getDataFromTree`" , error ) ; } Head . rewind ( ) ; } } const apolloState = apolloClient . cache . extract ( ) ; return { ... pageProps , apolloState } ; } ; } return WithApollo ; } function initApolloClient ( initialState = { } ) { if ( typeof window === "undefined" ) { return createApolloClient ( initialState ) ; } if ( ! apolloClient ) { apolloClient = createApolloClient ( initialState ) ; } return apolloClient ; } const initCache = ( initialState ? ) => { const cache = new InMemoryCache ( ) . restore ( initialState || { } ) ; if ( typeof window !== "undefined" ) { persistCache ( { cache , storage : window . localStorage } ) ; } return cache ; } ; function createApolloClient ( initialState = { } ) { const httpLink = new HttpLink ( { uri : "https://jsquiz-server.now.sh/" , credentials : "same-origin" , fetch : typeof window !== "undefined" && fetch } ) ; return new ApolloClient ( { ssrMode : typeof window === "undefined" , link : httpLink , cache : initCache ( initialState ) } ) ; }