Merge pull request #38 from lifeomic/get-cache-data

feat: add getCacheData and getInfiniteCacheData cache utils

README.md

@@ -472,19 +472,45 @@ cache.updateCache(
 );
 ```
 
-When dealing with a cache entry that was initiated via `useInfiniteAPIQuery` (paginated) prefer using `updateInfiniteCache` which otherwise behaves the same as `updateCache`
+When dealing with a cache entry that was initiated via `useInfiniteAPIQuery` (paginated) prefer using `updateInfiniteCache` which otherwise behaves the same as `updateCache`.
 
 ```typescript
 const cache = useAPICache();
 
 cache.updateInfiniteCache(
-  'GET /list',
+  'GET /messages',
   { filter: 'some-filter' },
   (current) => {...},
 );
 ```
 
-**Note**: if performing a programmatic update, _no update will occur_ if there is not a cached value.
+#### `getCacheData`
+
+Get the cached data for a query, if there is any.
+
+```typescript
+const cache = useAPICache();
+
+const value = cache.getCacheData(
+  // Specify the route + payload that you'd like to get the cached value for.
+  'GET /messages',
+  { filter: 'some-filter' },
+);
+
+value; // Message[] | undefined
+```
+
+When dealing with a cache entry that was initiated via `useInfiniteAPIQuery` (paginated) prefer using `getInfiniteCacheData` which otherwise behaves the same as `getCacheData`.
+
+```typescript
+const cache = useAPICache();
+
+const value = cache.getInfiniteCacheData('GET /messages', {
+  filter: 'some-filter',
+});
+
+value; // { pages: Message[]; }
+```
 
 ## Test Utility API Reference
 

src/cache.ts

@@ -83,5 +83,9 @@ export const createCacheUtils = <Endpoints extends RoughEndpoints>(
     },
     updateCache: updateCache(),
     updateInfiniteCache: updateCache(INFINITE_QUERY_KEY),
+    getCacheData: (route, payload) =>
+      client.getQueryData([makeQueryKey(route, payload)]),
+    getInfiniteCacheData: (route, payload) =>
+      client.getQueryData([INFINITE_QUERY_KEY, makeQueryKey(route, payload)]),
   };
 };

src/hooks.test.tsx

@@ -1123,3 +1123,71 @@ test('passing a function for `client` is supported', async () => {
     expect(screen.queryAllByText('test-message-2')).toBeDefined();
   });
 });
+
+test('getCacheData', async () => {
+  network.mock('GET /items', {
+    status: 200,
+    data: { message: 'test-message' },
+  });
+
+  // Populate the cache.
+  const screen1 = render(() => {
+    const query = useAPIQuery('GET /items', { filter: 'test-filter' });
+    return <>{query.status}</>;
+  });
+
+  await TestingLibrary.waitFor(() => {
+    screen1.getByText('success');
+  });
+
+  screen1.unmount();
+
+  // Now, fetch from the cache.
+
+  const screen2 = render(() => {
+    const cache = useAPICache();
+
+    return (
+      <>
+        {cache.getCacheData('GET /items', { filter: 'test-filter' })?.message}
+      </>
+    );
+  });
+
+  screen2.getByText('test-message');
+});
+
+test('getInfiniteCacheData', async () => {
+  network.mock('GET /list', {
+    status: 200,
+    data: { items: [{ message: 'one' }, { message: 'two' }] },
+  });
+
+  // Populate the cache.
+  const screen1 = render(() => {
+    const query = useInfiniteAPIQuery('GET /list', { filter: 'test-filter' });
+    return <>{query.status}</>;
+  });
+
+  await TestingLibrary.waitFor(() => {
+    screen1.getByText('success');
+  });
+
+  screen1.unmount();
+
+  // Now, fetch from the cache.
+
+  const screen2 = render(() => {
+    const cache = useAPICache();
+
+    const value = cache.getInfiniteCacheData('GET /list', {
+      filter: 'test-filter',
+    });
+
+    const messages = value?.pages.flatMap((p) => p.items).map((i) => i.message);
+
+    return <>{messages?.join(',')}</>;
+  });
+
+  screen2.getByText('one,two');
+});

src/types.ts

@@ -134,6 +134,16 @@ export type CacheUtils<Endpoints extends RoughEndpoints> = {
     payload: RequestPayloadOf<Endpoints, Route>,
     updater: CacheUpdate<InfiniteData<Endpoints[Route]['Response']>>,
   ) => void;
+
+  getCacheData: <Route extends keyof Endpoints & string>(
+    route: Route,
+    payload: RequestPayloadOf<Endpoints, Route>,
+  ) => Endpoints[Route]['Response'] | undefined;
+
+  getInfiniteCacheData: <Route extends keyof Endpoints & string>(
+    route: Route,
+    payload: RequestPayloadOf<Endpoints, Route>,
+  ) => InfiniteData<Endpoints[Route]['Response']> | undefined;
 };
 
 export type APIQueryHooks<Endpoints extends RoughEndpoints> = {