Store certain query responses locally

[theobouwman]

Is it possible to store certain query responses on device, fetch the query, and replace the stored value? As a faster cache.

[markerikson]

I don't understand what you're actually asking. Can you give some specific details of what you're trying to do?

[theobouwman]

with the example from https://redux-toolkit.js.org/rtk-query/usage/queries:

// Or from '@reduxjs/toolkit/query/react' import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query' import type { Post } from './types' const api = createApi({ baseQuery: fetchBaseQuery({ baseUrl: '/', }), tagTypes: ['Post'], endpoints: (build) => ({ // The query accepts a number and returns a Post getPost: build.query<Post, number>({ // note: an optional `queryFn` may be used in place of `query` query: (id) => ({ url: `post/${id}` }), ...

I would like to store the results on device for a certain period. We are using React Native to fetch which do not change that often. Therefore it would be useful to:

• get the locally stored state if present
• and to fetch the endpoint in the background to update the local state
• so that the end user does not need to wait for the http response.

[markerikson]

That.... sounds exactly like what RTK Query does, already :) Any time a component tries to use a cache entry via the useQuery hook, it first checks to see if that cache entry already exists in the store, and if so, just reads and returns that cache entry. If it doesn't yet exist, then it's fetched and cached.

I think you're asking "how can I keep cache entries around longer, and refetch them in the background"?

See these docs pages:

• https://redux-toolkit.js.org/rtk-query/usage/cache-behavior#reducing-subscription-time-with-keepunuseddatafor
• https://redux-toolkit.js.org/rtk-query/usage/polling

[theobouwman]

Thanks. I am looking for that indeed. But this is just for in-memory cache. I am looking for on device local KV storage so it would work with React Native restarts.

[markerikson]

That aspect has nothing to do with RTK, then. Where and how you store data on a server or on device is outside the scope of RTK / RTKQ.

[BenQoder]

@theobouwman

I think what you are looking for is documented here
https://redux-toolkit.js.org/rtk-query/usage/persistence-and-rehydration