Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 17 additions & 7 deletions docs/src/pages/plugins/createAsyncStoragePersistor.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
id: createAsyncStoragePersistor
title: createAsyncStoragePersistor for React Native (Experimental)
title: createAsyncStoragePersistor (Experimental)
---

> VERY IMPORTANT: This utility is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Use at your own risk. If you choose to rely on this in production in an experimental stage, please lock your version to a patch-level version to avoid unexpected breakages.
Expand All @@ -13,9 +13,11 @@ This utility comes packaged with `react-query` and is available under the `react

- Import the `createAsyncStoragePersistor` function
- Create a new asyncStoragePersistor
- you can pass any `storage` to it that adheres to the `AsyncStorage` interface - the example below uses the async-storage from React Native
- Pass it to the [`persistQueryClient`](../persistQueryClient) function

```ts
import AsyncStorage from '@react-native-community/async-storage'
import { persistQueryClient } from 'react-query/persistQueryClient-experimental'
import { createAsyncStoragePersistor } from 'react-query/createAsyncStoragePersistor-experimental'

Expand All @@ -27,7 +29,9 @@ const queryClient = new QueryClient({
},
})

const asyncStoragePersistor = createAsyncStoragePersistor()
const asyncStoragePersistor = createAsyncStoragePersistor({
storage: AsyncStorage
})

persistQueryClient({
queryClient,
Expand All @@ -39,24 +43,30 @@ persistQueryClient({

### `createAsyncStoragePersistor`

Call this function (with an optional options object) to create a asyncStoragePersistor that you can use later with `persisteQueryClient`.
Call this function to create an asyncStoragePersistor that you can use later with `persisteQueryClient`.

```js
createAsyncStoragePersistor(options?: CreateAsyncStoragePersistorOptions)
createAsyncStoragePersistor(options: CreateAsyncStoragePersistorOptions)
```

### `Options`

An optional object of options:

```js
```ts
interface CreateAsyncStoragePersistorOptions {
/** The storage client used for setting an retrieving items from cache */
storage: AsyncStorage
/** The key to use when storing the cache to localstorage */
asyncStorageKey?: string
/** To avoid localstorage spamming,
* pass a time in ms to throttle saving the cache to disk */
throttleTime?: number
}

interface AsyncStorage {
getItem: (key: string) => Promise<string>
setItem: (key: string, value: string) => Promise<unknown>
removeItem: (key: string) => Promise<unknown>
}
```

The default options are:
Expand Down
12 changes: 5 additions & 7 deletions docs/src/pages/plugins/createWebStoragePersistor.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,8 @@ const queryClient = new QueryClient({
},
})

const localStoragePersistor = createWebStoragePersistor({storage: window.localStorage})
// const sessionStoragePersistor = createWebStoragePersistor({storage: window.sessionStorage})
const localStoragePersistor = createWebStoragePersistor({ storage: window.localStorage })
// const sessionStoragePersistor = createWebStoragePersistor({ storage: window.sessionStorage })

persistQueryClient({
queryClient,
Expand All @@ -40,17 +40,15 @@ persistQueryClient({

### `createWebStoragePersistor`

Call this function (with an optional options object) to create a webStoragePersistor that you can use later with `persistQueryClient`.
Call this function to create a webStoragePersistor that you can use later with `persistQueryClient`.

```js
createWebStoragePersistor(options?: CreateWebStoragePersistorOptions)
createWebStoragePersistor(options: CreateWebStoragePersistorOptions)
```

### `Options`

An optional object of options:

```js
```ts
interface CreateWebStoragePersistorOptions {
/** The storage client used for setting an retrieving items from cache (window.localStorage or window.sessionStorage) */
storage: Storage
Expand Down