@graphcommerce/graphql 7.0.0-canary.21 → 7.0.1-canary.0

package/CHANGELOG.md

@@ -1,6 +1,208 @@
 # Change Log
 
-## 7.0.0-canary.21
+## 7.0.1-canary.0
+
+### Patch Changes
+
+- [#2047](https://github.com/graphcommerce-org/graphcommerce/pull/2047) [`136580b39`](https://github.com/graphcommerce-org/graphcommerce/commit/136580b39e3cffdd07e3fa087e049bd532c3e8f1) - Updated all dependencies to the latest version where possible. ([@paales](https://github.com/paales))
+
+## 7.0.0
+
+### Patch Changes
+
+- [#1960](https://github.com/graphcommerce-org/graphcommerce/pull/1960) [`f78caf5a8`](https://github.com/graphcommerce-org/graphcommerce/commit/f78caf5a83683f1ae4b901fb94bd22d50943fa2f) - Updated packages: `next`, `@apollo/client`, `react-hook-form`, `@emotion/*`, `@lingui/*`, `@mui/*` and various others. ([@paales](https://github.com/paales))
+
+- [#2012](https://github.com/graphcommerce-org/graphcommerce/pull/2012) [`1dbb3ae13`](https://github.com/graphcommerce-org/graphcommerce/commit/1dbb3ae13553992ee1ed77f375375560f28c418c) - Upgrade graphql to 16.7.1, add graphql as peer dependency ([@Giovanni-Schroevers](https://github.com/Giovanni-Schroevers))
+
+- [#2031](https://github.com/graphcommerce-org/graphcommerce/pull/2031) [`4d8fc9e99`](https://github.com/graphcommerce-org/graphcommerce/commit/4d8fc9e998fc9361282833316ec9564da0644ed6) - Eslint fixes and suppress accepted warnings ([@paales](https://github.com/paales))
+
+- [#1915](https://github.com/graphcommerce-org/graphcommerce/pull/1915) [`f4a8c3881`](https://github.com/graphcommerce-org/graphcommerce/commit/f4a8c388183e17c52e7f66536c5448749f494d7f) - Moved the injection of the links to plugins ([@paales](https://github.com/paales))
+
+- [#1960](https://github.com/graphcommerce-org/graphcommerce/pull/1960) [`86e14569b`](https://github.com/graphcommerce-org/graphcommerce/commit/86e14569b1f68f73be7f93b614e36b382c5debff) - Updated to the latest release of GraphQL codegen and solve compatibility issues with our own generator ([@paales](https://github.com/paales))
+
+- [#1942](https://github.com/graphcommerce-org/graphcommerce/pull/1942) [`df2b3efb2`](https://github.com/graphcommerce-org/graphcommerce/commit/df2b3efb2f906232a302218678c1524753c5a32c) - Customer related information was stored in the users local storage indefintely causing cache mismatches:
+
+  - 1. It stores a lot less by using the newly created _persistenceMapper_.
+  - 2. The 'createCacheReviver' would recreate the ApolloClient-cache on each navigation, it wont do that anymore.
+  - 3. The _persistenceMapper_ now has a hard coded blacklist of entries that aren't allowed to be stored in the local storage. In a future PR we'll make this blacklist configurable. ([@paales](https://github.com/paales))
+
+## 6.2.0-canary.98
+
+## 6.2.0-canary.97
+
+## 6.2.0-canary.96
+
+## 6.2.0-canary.95
+
+## 6.2.0-canary.94
+
+## 6.2.0-canary.93
+
+## 6.2.0-canary.92
+
+## 6.2.0-canary.91
+
+## 6.2.0-canary.90
+
+## 6.2.0-canary.89
+
+### Patch Changes
+
+- [#2031](https://github.com/graphcommerce-org/graphcommerce/pull/2031) [`4d8fc9e99`](https://github.com/graphcommerce-org/graphcommerce/commit/4d8fc9e998fc9361282833316ec9564da0644ed6) - Eslint fixes and suppress accepted warnings ([@paales](https://github.com/paales))
+
+## 6.2.0-canary.88
+
+## 6.2.0-canary.87
+
+## 6.2.0-canary.86
+
+## 6.2.0-canary.85
+
+## 6.2.0-canary.84
+
+## 6.2.0-canary.83
+
+## 6.2.0-canary.82
+
+## 6.2.0-canary.81
+
+## 6.2.0-canary.80
+
+## 6.2.0-canary.79
+
+## 6.2.0-canary.78
+
+## 6.2.0-canary.77
+
+## 6.2.0-canary.76
+
+## 6.2.0-canary.75
+
+## 6.2.0-canary.74
+
+## 6.2.0-canary.73
+
+## 6.2.0-canary.72
+
+## 6.2.0-canary.71
+
+## 6.2.0-canary.70
+
+## 6.2.0-canary.69
+
+### Patch Changes
+
+- [#2012](https://github.com/graphcommerce-org/graphcommerce/pull/2012) [`1dbb3ae13`](https://github.com/graphcommerce-org/graphcommerce/commit/1dbb3ae13553992ee1ed77f375375560f28c418c) - Upgrade graphql to 16.7.1, add graphql as peer dependency ([@Giovanni-Schroevers](https://github.com/Giovanni-Schroevers))
+
+## 6.2.0-canary.68
+
+## 6.2.0-canary.67
+
+### Patch Changes
+
+- [#2002](https://github.com/graphcommerce-org/graphcommerce/pull/2002) [`1234bb61f`](https://github.com/graphcommerce-org/graphcommerce/commit/1234bb61f8332da8a9e4dd7262b0c70beaed8c91) - Updated next and apollo/client ([@paales](https://github.com/paales))
+
+## 6.2.0-canary.66
+
+## 6.2.0-canary.65
+
+## 6.2.0-canary.64
+
+## 6.2.0-canary.63
+
+## 6.2.0-canary.62
+
+## 6.2.0-canary.61
+
+## 6.2.0-canary.60
+
+## 6.2.0-canary.59
+
+## 6.2.0-canary.58
+
+## 6.2.0-canary.57
+
+## 6.2.0-canary.56
+
+## 6.2.0-canary.55
+
+## 6.2.0-canary.54
+
+## 6.2.0-canary.53
+
+## 6.2.0-canary.52
+
+## 6.2.0-canary.51
+
+## 6.2.0-canary.50
+
+## 6.2.0-canary.49
+
+## 6.2.0-canary.48
+
+## 6.2.0-canary.47
+
+## 6.2.0-canary.46
+
+## 6.2.0-canary.45
+
+## 6.2.0-canary.44
+
+## 6.2.0-canary.43
+
+## 6.2.0-canary.42
+
+## 6.2.0-canary.41
+
+### Patch Changes
+
+- [#1960](https://github.com/graphcommerce-org/graphcommerce/pull/1960) [`f78caf5a8`](https://github.com/graphcommerce-org/graphcommerce/commit/f78caf5a83683f1ae4b901fb94bd22d50943fa2f) - Updated packages @apollo/client, react-hook-form, @emotion/\*, @lingui/\*, @mui/\* and various others. ([@paales](https://github.com/paales))
+
+- [#1960](https://github.com/graphcommerce-org/graphcommerce/pull/1960) [`86e14569b`](https://github.com/graphcommerce-org/graphcommerce/commit/86e14569b1f68f73be7f93b614e36b382c5debff) - Updated to the latest release of GraphQL codegen and solve compatibility issues with our own generator ([@paales](https://github.com/paales))
+
+## 6.2.0-canary.40
+
+## 6.2.0-canary.39
+
+## 6.2.0-canary.38
+
+## 6.2.0-canary.37
+
+## 6.2.0-canary.36
+
+## 6.2.0-canary.35
+
+## 6.2.0-canary.34
+
+## 6.2.0-canary.33
+
+## 6.2.0-canary.32
+
+## 6.2.0-canary.31
+
+## 6.2.0-canary.30
+
+### Patch Changes
+
+- [#1942](https://github.com/graphcommerce-org/graphcommerce/pull/1942) [`df2b3efb2`](https://github.com/graphcommerce-org/graphcommerce/commit/df2b3efb2f906232a302218678c1524753c5a32c) - Customer related information was stored in the users local storage indefintely causing cache mismatches: 1. It stores a lot less by using the newly created _persistenceMapper_. 2. The 'createCacheReviver' would recreate the ApolloClient-cache on each navigation, it wont do that anymore. 3. The _persistenceMapper_ now has a hard coded blacklist of entries that aren't allowed to be stored in the local storage. In a future PR we'll make this blacklist configurable. ([@paales](https://github.com/paales))
+
+## 6.2.0-canary.29
+
+## 6.2.0-canary.28
+
+## 6.2.0-canary.27
+
+## 6.2.0-canary.26
+
+## 6.2.0-canary.25
+
+## 6.2.0-canary.24
+
+## 6.2.0-canary.23
+
+## 6.2.0-canary.22
+
+## 6.2.0-canary.21
 
 ## 6.2.0-canary.20
 

package/components/GraphQLProvider/GraphQLProvider.tsx

@@ -6,7 +6,8 @@ import {
   ApolloProvider,
   HttpLink,
 } from '@apollo/client'
-import { useStorefrontConfig } from '@graphcommerce/next-ui'
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { useStorefrontConfig } from '@graphcommerce/next-ui/hooks/useStorefrontConfig'
 import type { AppProps } from 'next/app'
 import { useCallback, useEffect, useRef, useState } from 'react'
 import { ApolloClientConfig, graphqlConfig, ApolloClientConfigInput } from '../../config'

package/components/GraphQLProvider/createCacheReviver.ts

@@ -2,6 +2,7 @@ import { LocalStorageWrapper, CachePersistor } from 'apollo3-cache-persist'
 import { mergeDeep, ApolloCache, ApolloClient, NormalizedCacheObject } from '../../apollo'
 import { ApolloClientConfig } from '../../config'
 import { migrateCacheHandler } from './migrateCache'
+import { persistenceMapper } from './persistenceMapper'
 import { getTypePoliciesVersion } from './typePolicies'
 
 const APOLLO_CACHE_PERSIST = 'apollo-cache-persist'
@@ -23,24 +24,26 @@ export async function createCacheReviver(
     try {
       const { cache } = client
 
-      if (persistor) await persistor.persist()
-      // todo https://github.com/apollographql/apollo-cache-persist/tree/master/examples/react-native/src/utils/persistence
+      if (persistor) {
+        await persistor.persist()
+        return
+      }
+
       persistor = new CachePersistor({
         cache,
         storage: new LocalStorageWrapper(window.localStorage),
         maxSize: false,
         key: APOLLO_CACHE_PERSIST,
+        debounce: 10,
+        persistenceMapper,
       })
 
-      client.onClearStore(async () => {
-        client.cache.restore(incomingState)
-        await persistor?.persist()
-      })
-
-      client.onResetStore(async () => {
+      const reset = async () => {
         client.cache.restore(incomingState)
         await persistor?.persist()
-      })
+      }
+      client.onClearStore(reset)
+      client.onResetStore(reset)
 
       const storedState = window.localStorage[APOLLO_CACHE_PERSIST] as string | undefined
       const currentVersion = window.localStorage[APOLLO_CACHE_VERSION] as string | undefined
@@ -68,14 +71,12 @@ export async function createCacheReviver(
         }
       }
       window.localStorage[APOLLO_CACHE_VERSION] = typePoliciesVersion
-      window.localStorage[APOLLO_CACHE_PERSIST] = JSON.stringify(state)
-
-      // eslint-disable-next-line @typescript-eslint/no-floating-promises
-      persistor.restore()
     } catch (e) {
       console.error(e)
     }
   }
 
-  if (state) client.cache.restore(state)
+  if (state) {
+    client.cache.restore(state)
+  }
 }

package/components/GraphQLProvider/measurePerformanceLink.ts

@@ -43,7 +43,7 @@ const renderLine = (line: {
 
 export const flushMeasurePerf = () => {
   const entries = Array.from(running.entries())
-  if (entries.length === 0 || !entries.every(([k, v]) => v.end)) return
+  if (entries.length === 0 || !entries.every(([, v]) => v.end)) return
 
   /**
    * Print to the console a timeline that gives a visual reprentation of the starting time and
@@ -55,7 +55,7 @@ export const flushMeasurePerf = () => {
 
   let start = Number.MAX_VALUE
   let end = 0
-  entries.forEach(([_, value]) => {
+  entries.forEach(([, value]) => {
     if (value.start.getTime() < start) start = value.start.getTime()
     if (value.end && value.end.getTime() > end) end = value.end.getTime()
   })
@@ -63,7 +63,7 @@ export const flushMeasurePerf = () => {
 
   const colDivider = end > 1000 ? end / 50 : 1000 / 50
 
-  const lines = entries.map(([_, value]) => {
+  const lines = entries.map(([, value]) => {
     const requestStart = value.start.getTime() - start
     const requestEnd = value.end ? value.end.getTime() - start : 0
     const duration = requestEnd - requestStart
@@ -109,9 +109,10 @@ export const flushMeasurePerf = () => {
   // padd the items to the max length
   items.forEach((item) => {
     item.forEach((_, index) => {
-      const [str, link] = (
-        Array.isArray(item[index]) ? item[index] : [item[index], item[index]]
-      ) as [string, string]
+      const [str] = (Array.isArray(item[index]) ? item[index] : [item[index], item[index]]) as [
+        string,
+        string,
+      ]
 
       const val = (Array.isArray(item[index]) ? item[index][1] : item[index]) as string
 

package/components/GraphQLProvider/persistenceMapper.ts

@@ -0,0 +1,43 @@
+import { InMemoryCache, NormalizedCacheObject } from '@apollo/client'
+
+function pruneKey(cacheValue: unknown, path: string[]) {
+  if (typeof cacheValue !== 'object' || cacheValue === null) return
+
+  const [segment, ...rest] = path
+  const regexp = new RegExp(
+    segment.replace(/\*/g, '.*?').replace(/\(/g, '\\(').replace(/\)/g, '\\)').replace(/=/g, '\\='),
+  )
+
+  Object.keys(cacheValue).forEach((key) => {
+    if (!regexp.test(key)) return
+
+    if (rest.length === 0) {
+      delete cacheValue[key]
+    } else pruneKey(cacheValue[key], rest)
+  })
+}
+
+function pruneCache(cacheObject: object, patterns: string[]) {
+  patterns.forEach((pattern) => pruneKey(cacheObject, pattern.split('.')))
+}
+
+export const persistenceMapper = (data: string): Promise<string> => {
+  const parsedCache = JSON.parse(data) as NormalizedCacheObject
+
+  pruneCache(parsedCache, [
+    'ROOT_MUTATION',
+    'ROOT_QUERY.products*',
+    'ROOT_QUERY.countries',
+    'ROOT_QUERY.checkoutAgreements',
+    'ROOT_QUERY.storeConfig',
+    'ROOT_QUERY.__type*',
+    'ConfigurableProduct:*.configurable_product_options_selection*',
+    '*Product:{"uid":"*"}.crosssell_products',
+  ])
+
+  const cache = new InMemoryCache({})
+  cache.restore(parsedCache)
+  cache.gc()
+  const newCache = cache.extract()
+  return Promise.resolve(JSON.stringify(newCache))
+}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@graphcommerce/graphql",
   "homepage": "https://www.graphcommerce.org/",
   "repository": "github:graphcommerce-org/graphcommerce",
-  "version": "7.0.0-canary.21",
+  "version": "7.0.1-canary.0",
   "sideEffects": false,
   "main": "index.ts",
   "prettier": "@graphcommerce/prettier-config-pwa",
@@ -13,27 +13,27 @@
     }
   },
   "dependencies": {
-    "@apollo/client": "^3.7.10",
-    "@graphcommerce/graphql-codegen-near-operation-file": "7.0.0-canary.21",
-    "@graphcommerce/graphql-codegen-relay-optimizer-plugin": "7.0.0-canary.21",
-    "@graphql-codegen/add": "4.0.1",
-    "@graphql-codegen/fragment-matcher": "4.0.1",
-    "@graphql-codegen/introspection": "3.0.1",
-    "@graphql-codegen/schema-ast": "3.0.1",
-    "@graphql-codegen/typed-document-node": "3.0.2",
-    "@graphql-codegen/typescript": "3.0.2",
+    "@apollo/client": "~3.8.2",
+    "@graphcommerce/graphql-codegen-near-operation-file": "7.0.1-canary.0",
+    "@graphcommerce/graphql-codegen-relay-optimizer-plugin": "7.0.1-canary.0",
+    "@graphql-codegen/add": "5.0.0",
+    "@graphql-codegen/fragment-matcher": "5.0.0",
+    "@graphql-codegen/introspection": "4.0.0",
+    "@graphql-codegen/schema-ast": "4.0.0",
+    "@graphql-codegen/typed-document-node": "5.0.1",
+    "@graphql-codegen/typescript": "4.0.1",
     "@graphql-codegen/typescript-apollo-client-helpers": "2.2.6",
-    "@graphql-codegen/typescript-document-nodes": "3.0.2",
-    "@graphql-codegen/typescript-operations": "3.0.2",
-    "apollo3-cache-persist": "^0.14.1",
-    "graphql": "16.6.0"
+    "@graphql-codegen/typescript-document-nodes": "4.0.1",
+    "@graphql-codegen/typescript-operations": "4.0.1",
+    "apollo3-cache-persist": "^0.14.1"
   },
   "devDependencies": {
-    "@graphcommerce/eslint-config-pwa": "7.0.0-canary.21",
-    "@graphcommerce/prettier-config-pwa": "7.0.0-canary.21",
-    "@graphcommerce/typescript-config-pwa": "7.0.0-canary.21"
+    "@graphcommerce/eslint-config-pwa": "7.0.1-canary.0",
+    "@graphcommerce/prettier-config-pwa": "7.0.1-canary.0",
+    "@graphcommerce/typescript-config-pwa": "7.0.1-canary.0"
   },
   "peerDependencies": {
+    "graphql": "^16.7.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   }

package/test/apolloClient.fixture.ts

@@ -1,3 +1,4 @@
+/* eslint-disable import/no-extraneous-dependencies */
 /* eslint-disable no-empty-pattern */
 import { test as base, Page } from '@playwright/test'
 import {