Fix bug in with-apollo example leading to cached lists being duplicat…

…ed. (vercel#19812)

Closes vercel#19759

examples/with-apollo/lib/apolloClient.js

@@ -2,6 +2,7 @@ import { useMemo } from 'react'
 import { ApolloClient, HttpLink, InMemoryCache } from '@apollo/client'
 import { concatPagination } from '@apollo/client/utilities'
 import merge from 'deepmerge'
+import isEqual from 'lodash/isEqual'
 
 export const APOLLO_STATE_PROP_NAME = '__APOLLO_STATE__'
 
@@ -36,7 +37,15 @@ export function initializeApollo(initialState = null) {
     const existingCache = _apolloClient.extract()
 
     // Merge the existing cache into data passed from getStaticProps/getServerSideProps
-    const data = merge(initialState, existingCache)
+    const data = merge(initialState, existingCache, {
+      // combine arrays using object equality (like in sets)
+      arrayMerge: (destinationArray, sourceArray) => [
+        ...sourceArray,
+        ...destinationArray.filter((d) =>
+          sourceArray.every((s) => !isEqual(d, s))
+        ),
+      ],
+    })
 
     // Restore the cache with the merged data
     _apolloClient.cache.restore(data)

examples/with-apollo/package.json

@@ -9,6 +9,7 @@
   "dependencies": {
     "@apollo/client": "3.1.1",
     "deepmerge": "^4.2.2",
+    "lodash": "4.17.20",
     "graphql": "^15.3.0",
     "next": "latest",
     "prop-types": "^15.6.2",