feat: add support for @apollo/client v4

docs/advanced-usage.md

@@ -16,7 +16,7 @@ persistCache({
    */
 
   // Reference to your Apollo cache.
-  cache: ApolloCache<TSerialized>,
+  cache: ApolloCache,
 
   // Reference to your storage provider wrapped in a storage wrapper implementing PersistentStorage interface.
   storage: PersistentStorage,

package.json

@@ -66,10 +66,10 @@
     "preset": "ts-jest"
   },
   "peerDependencies": {
-    "@apollo/client": "^3.7.17"
+    "@apollo/client": "^3.7.17 || ^4.0.6"
   },
   "devDependencies": {
-    "@apollo/client": "3.9.9",
+    "@apollo/client": "4.0.6",
     "@types/jest": "29.5.12",
     "@types/node": "20.11.30",
     "@types/react-native": "0.73.0",
@@ -87,6 +87,7 @@
     "react": "18.2.0",
     "rimraf": "5.0.5",
     "rollup": "4.13.0",
+    "rxjs": "^7.8.2",
     "ts-jest": "29.1.2",
     "typescript": "5.4.3",
     "uglify-js": "3.17.4"

src/Cache.ts

@@ -2,7 +2,7 @@ import { ApolloCache } from '@apollo/client/core';
 import { ApolloPersistOptions, PersistedData } from './types';
 
 export default class Cache<T> {
-  cache: ApolloCache<T>;
+  cache: ApolloCache;
   serialize: boolean;
 
   constructor(options: Pick<ApolloPersistOptions<T>, 'cache' | 'serialize'>) {

src/CachePersistor.ts

@@ -29,7 +29,7 @@ export default class CachePersistor<T> {
     }
 
     const log = new Log(options);
-    const cache = new Cache(options);
+    const cache = new Cache<T>(options);
     const storage = new Storage(options);
     const persistor = new Persistor({ log, cache, storage }, options);
     const trigger = new Trigger({ log, persistor }, options);

src/__mocks__/simulate.ts

@@ -3,8 +3,8 @@ import {
   ApolloLink,
   DocumentNode,
   InMemoryCache,
-  Observable,
 } from '@apollo/client/core';
+import { of } from 'rxjs';
 
 import { persistCache } from '../';
 import MockStorage from './MockStorage';
@@ -24,7 +24,7 @@ export const simulateApp = async <T>({
 
   await persistCache({ ...persistOptions, cache, storage });
 
-  const link = new ApolloLink(() => Observable.of(result));
+  const link = new ApolloLink(() => of(result));
   const client = new ApolloClient({ cache, link });
 
   await client.query({ query: operation });
@@ -33,7 +33,8 @@ export const simulateApp = async <T>({
   );
 
   // cache is now persisted
-  const cache2 = cache.constructor();
+  // @ts-ignore
+  const cache2 = new cache.constructor();
   await persistCache({ ...persistOptions, cache: cache2, storage });
   const client2 = new ApolloClient({ cache: cache2, link });
 
@@ -54,7 +55,7 @@ export const simulateWrite = async <T>({
 
   await persistCache({ ...persistOptions, cache, storage });
 
-  const link = new ApolloLink(() => Observable.of(result));
+  const link = new ApolloLink(() => of(result));
   const client = new ApolloClient({ cache, link });
   await client.query({ query: operation });
 };

src/__tests__/persistCache.ts

@@ -52,6 +52,7 @@ describe('persistCache', () => {
         operation,
         result,
         persistOptions: {
+          // @ts-ignore
           cache: new Hermes(),
         },
       });
@@ -104,6 +105,7 @@ describe('persistCache', () => {
         operation,
         result,
         persistOptions: {
+          // @ts-ignore
           cache: new Hermes(),
         },
       });

src/__tests__/persistCacheSync.ts

@@ -2,11 +2,11 @@ import { SynchronousCachePersistor } from '../';
 import MockStorageSync from '../__mocks__/MockStorageSync';
 import {
   ApolloClient,
-  Observable,
   ApolloLink,
   InMemoryCache,
   NormalizedCacheObject,
 } from '@apollo/client/core';
+import { of } from "rxjs";
 import gql from 'graphql-tag';
 import { ApolloPersistOptions } from '../types';
 
@@ -30,7 +30,7 @@ describe('persistCacheSync', () => {
       // @ts-ignore
       const cachePersistor = new SynchronousCachePersistor(persistOptions);
 
-      const link = new ApolloLink(() => Observable.of(result));
+      const link = new ApolloLink(() => of(result));
       const client = new ApolloClient({ cache, link });
       expect(cache.extract()).toEqual({});
 

src/onAppBackground.ts

@@ -5,7 +5,7 @@ import onCacheWrite from './onCacheWrite';
 
 export interface TriggerFunctionConfig<T> {
   log: Log<T>;
-  cache: ApolloCache<T>;
+  cache: ApolloCache;
 }
 
 export default <T>({ log, cache }: TriggerFunctionConfig<T>) => (

src/onCacheWrite.ts

@@ -1,11 +1,11 @@
 import { ApolloCache } from '@apollo/client/core';
 
-export interface TriggerFunctionConfig<T> {
-  cache: ApolloCache<T>;
+export interface TriggerFunctionConfig {
+  cache: ApolloCache;
 }
 
-export default <T>({ cache }: TriggerFunctionConfig<T>) => (
-  persist: () => void,
+export default ({ cache }: TriggerFunctionConfig) => (
+  persist: () => void
 ) => {
   const write = cache.write;
   const evict = cache.evict;
@@ -33,7 +33,6 @@ export default <T>({ cache }: TriggerFunctionConfig<T>) => (
     return result;
   };
 
-
   return () => {
     cache.write = write;
     cache.evict = evict;

src/types/index.ts

@@ -26,7 +26,7 @@ export interface ApolloPersistOptions<
   TSerialized,
   TSerialize extends boolean = true
 > {
-  cache: ApolloCache<TSerialized>;
+  cache: ApolloCache;
   storage: StorageType<PersistedData<TSerialized>, TSerialize>;
   trigger?: 'write' | 'background' | TriggerFunction | false;
   debounce?: number;

yarn.lock

@@ -15,7 +15,38 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@apollo/client@npm:3.9.9, @apollo/client@npm:^3.1.2":
+"@apollo/client@npm:4.0.6":
+  version: 4.0.6
+  resolution: "@apollo/client@npm:4.0.6"
+  dependencies:
+    "@graphql-typed-document-node/core": "npm:^3.1.1"
+    "@wry/caches": "npm:^1.0.0"
+    "@wry/equality": "npm:^0.5.6"
+    "@wry/trie": "npm:^0.5.0"
+    graphql-tag: "npm:^2.12.6"
+    optimism: "npm:^0.18.0"
+    tslib: "npm:^2.3.0"
+  peerDependencies:
+    graphql: ^16.0.0
+    graphql-ws: ^5.5.5 || ^6.0.3
+    react: ^17.0.0 || ^18.0.0 || >=19.0.0-rc
+    react-dom: ^17.0.0 || ^18.0.0 || >=19.0.0-rc
+    rxjs: ^7.3.0
+    subscriptions-transport-ws: ^0.9.0 || ^0.11.0
+  peerDependenciesMeta:
+    graphql-ws:
+      optional: true
+    react:
+      optional: true
+    react-dom:
+      optional: true
+    subscriptions-transport-ws:
+      optional: true
+  checksum: 10c0/f8328786c5f551c0e0ee6dc41084bbbe8a4094e71cdcd6ca3bc2f92b12aa2b8fb73bc56d662c143d4818b7212c8b45c8d05180f0a924113e39a84e5072fb8d3b
+  languageName: node
+  linkType: hard
+
+"@apollo/client@npm:^3.1.2":
   version: 3.9.9
   resolution: "@apollo/client@npm:3.9.9"
   dependencies:
@@ -2488,7 +2519,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "apollo3-cache-persist@workspace:."
   dependencies:
-    "@apollo/client": "npm:3.9.9"
+    "@apollo/client": "npm:4.0.6"
     "@types/jest": "npm:29.5.12"
     "@types/node": "npm:20.11.30"
     "@types/react-native": "npm:0.73.0"
@@ -2506,11 +2537,12 @@ __metadata:
     react: "npm:18.2.0"
     rimraf: "npm:5.0.5"
     rollup: "npm:4.13.0"
+    rxjs: "npm:^7.8.2"
     ts-jest: "npm:29.1.2"
     typescript: "npm:5.4.3"
     uglify-js: "npm:3.17.4"
   peerDependencies:
-    "@apollo/client": 3.7.17
+    "@apollo/client": ^3.7.17 || ^4.0.6
   languageName: unknown
   linkType: soft
 
@@ -8663,6 +8695,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"rxjs@npm:^7.8.2":
+  version: 7.8.2
+  resolution: "rxjs@npm:7.8.2"
+  dependencies:
+    tslib: "npm:^2.1.0"
+  checksum: 10c0/1fcd33d2066ada98ba8f21fcbbcaee9f0b271de1d38dc7f4e256bfbc6ffcdde68c8bfb69093de7eeb46f24b1fb820620bf0223706cff26b4ab99a7ff7b2e2c45
+  languageName: node
+  linkType: hard
+
 "safe-buffer@npm:5.1.2, safe-buffer@npm:~5.1.0, safe-buffer@npm:~5.1.1":
   version: 5.1.2
   resolution: "safe-buffer@npm:5.1.2"