Rename createWebStorage => createSyncStorage

.eslintrc

@@ -40,7 +40,7 @@
         "zones": [
           { "target": "src/core", "from": "src/broadcastQueryClient-experimental" },
           { "target": "src/core", "from": "src/createAsyncStoragePersister" },
-          { "target": "src/core", "from": "src/createWebStoragePersister" },
+          { "target": "src/core", "from": "src/createSyncStoragePersister" },
           { "target": "src/core", "from": "src/devtools" },
           { "target": "src/core", "from": "src/persistQueryClient" },
           { "target": "src/core", "from": "src/reactjs" }

createSyncStoragePersister/index.d.ts

@@ -0,0 +1 @@
+export * from '../lib/createSyncStoragePersister'

createSyncStoragePersister/index.js

@@ -0,0 +1 @@
+module.exports = require('../lib/createSyncStoragePersister/index')

docs/config.json

@@ -302,8 +302,8 @@
           "to": "plugins/persistQueryClient"
         },
         {
-          "label": "createWebStoragePersister",
-          "to": "plugins/createWebStoragePersister"
+          "label": "createSyncStoragePersister",
+          "to": "plugins/createSyncStoragePersister"
         },
         {
           "label": "createAsyncStoragePersister",

docs/guides/migrating-to-react-query-4.md

@@ -201,17 +201,17 @@ React.useEffect(() => mySideEffectHere(data), [data])
 
 ### `persistQueryClient` and the corresponding persister plugins are no longer experimental and have been renamed
 
-The plugins `createWebStoragePersistor` and `createAsyncStoragePersistor` have been renamed to [`createWebStoragePersister`](/plugins/createWebStoragePersister) and [`createAsyncStoragePersister`](/plugins/createAsyncStoragePersister) respectively. The interface `Persistor` in `persistQueryClient` has also been renamed to `Persister`. Checkout [this stackexchange](https://english.stackexchange.com/questions/206893/persister-or-persistor) for the motivation of this change.
+The plugins `createWebStoragePersistor` and `createAsyncStoragePersistor` have been renamed to [`createSyncStoragePersister`](/plugins/createSyncStoragePersister) and [`createAsyncStoragePersister`](/plugins/createAsyncStoragePersister) respectively. The interface `Persistor` in `persistQueryClient` has also been renamed to `Persister`. Checkout [this stackexchange](https://english.stackexchange.com/questions/206893/persister-or-persistor) for the motivation of this change.
 
 Since these plugins are no longer experimental, their import paths have also been updated:
 
 ```diff
 - import { persistQueryClient } from 'react-query/persistQueryClient-experimental'
-- import { createWebStoragePersistor } from 'react-query/createWebStoragePersistor-experimental'
+- import { createSyncStoragePersister } from 'react-query/createSyncStoragePersister-experimental'
 - import { createAsyncStoragePersistor } from 'react-query/createAsyncStoragePersistor-experimental'
 
 + import { persistQueryClient } from 'react-query/persistQueryClient'
-+ import { createWebStoragePersister } from 'react-query/createWebStoragePersister'
++ import { createSyncStoragePersister } from 'react-query/createSyncStoragePersister'
 + import { createAsyncStoragePersister } from 'react-query/createAsyncStoragePersister'
 ```
 

docs/guides/mutations.md

@@ -286,7 +286,7 @@ If you persist offline mutations with the [persistQueryClient plugin](../plugins
 This is a technical limitation. When persisting to an external storage, only the state of mutations is persisted, as functions cannot be serialized. After hydration, the component that triggeres the mutation might not be mounted, so calling `resumePausedMutations` might yield an error: `No mutationFn found`.
 
 ```js
-const persister = createWebStoragePersister({
+const persister = createSyncStoragePersister({
   storage: window.localStorage,
 })
 const queryClient = new QueryClient({
@@ -314,7 +314,7 @@ export default function App() {
         queryClient.resumePausedMutations()
       }}
     >
-      <RestOfTheApp />
+      <RestOfTheApp/>
     </PersistQueryClientProvider>
   )
 }

docs/plugins/createAsyncStoragePersister.md

@@ -39,7 +39,7 @@ persistQueryClient({
 
 ## Retries
 
-Retries work the same as for a [WebStoragePersister](./createWebStoragePersister), except that they can also be asynchronous. You can also use all the predefined retry handlers.
+Retries work the same as for a [WebStoragePersister](./createSyncStoragePersister), except that they can also be asynchronous. You can also use all the predefined retry handlers.
 
 ## API
 

docs/plugins/createWebStoragePersister.md

@@ -1,21 +1,21 @@
 ---
-id: createWebStoragePersister
-title: createWebStoragePersister
+id: createSyncStoragePersister
+title: createSyncStoragePersister
 ---
 
 ## Installation
 
-This utility comes packaged with `react-query` and is available under the `react-query/createWebStoragePersister` import.
+This utility comes packaged with `react-query` and is available under the `react-query/createSyncStoragePersister` import.
 
 ## Usage
 
-- Import the `createWebStoragePersister` function
+- Import the `createSyncStoragePersister` function
 - Create a new webStoragePersister
 - Pass it to the [`persistQueryClient`](./persistQueryClient) function
 
 ```ts
 import { persistQueryClient } from 'react-query/persistQueryClient'
-import { createWebStoragePersister } from 'react-query/createWebStoragePersister'
+import { createSyncStoragePersister } from 'react-query/createSyncStoragePersister'
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -25,8 +25,8 @@ const queryClient = new QueryClient({
   },
 })
 
-const localStoragePersister = createWebStoragePersister({ storage: window.localStorage })
-// const sessionStoragePersister = createWebStoragePersister({ storage: window.sessionStorage })
+const localStoragePersister = createSyncStoragePersister({ storage: window.localStorage })
+// const sessionStoragePersister = createSyncStoragePersister({ storage: window.sessionStorage })
 
 persistQueryClient({
   queryClient,
@@ -56,20 +56,23 @@ Per default, no retry will occur. You can use one of the predefined strategies t
   - will return a new `PersistedClient` with the oldest query removed.
 
 ```js
-const localStoragePersister = createWebStoragePersister({
+const localStoragePersister = createSyncStoragePersister({
   storage: window.localStorage,
   retry: removeOldestQuery
 })
 ```
 
 ## API
 
-### `createWebStoragePersister`
+### `createSyncStoragePersister`
 
 Call this function to create a webStoragePersister that you can use later with `persistQueryClient`.
 
 ```js
-createWebStoragePersister(options: CreateWebStoragePersisterOptions)
+createSyncStoragePersister(options
+:
+CreateWebStoragePersisterOptions
+)
 ```
 
 ### `Options`
@@ -110,15 +113,15 @@ If you need to store more data in `localStorage`, you can override the `serializ
 ```js
 import { QueryClient } from 'react-query';
 import { persistQueryClient } from 'react-query/persistQueryClient'
-import { createWebStoragePersister } from 'react-query/createWebStoragePersister'
+import { createSyncStoragePersister } from 'react-query/createSyncStoragePersister'
 
 import { compress, decompress } from 'lz-string';
 
 const queryClient = new QueryClient({ defaultOptions: { queries: { staleTime: Infinity } } });
 
 persistQueryClient({
   queryClient: connectionsQueryClient,
-  persistor: createWebStoragePersister({
+  persistor: createSyncStoragePersister({
     storage: window.localStorage,
     serialize: data => compress(JSON.stringify(data)),
     deserialize: data => JSON.parse(decompress(data)),

docs/plugins/persistQueryClient.md

@@ -7,7 +7,7 @@ This is set of utilities for interacting with "persisters" which save your query
 
 ## Build Persisters
 
-- [createWebStoragePersister](/plugins/createWebStoragePersister)
+- [createSyncStoragePersister](/plugins/createSyncStoragePersister)
 - [createAsyncStoragePersister](/plugins/createAsyncStoragePersister)
 - [create a custom persister](#persisters)
 
@@ -57,7 +57,7 @@ the persister `removeClient()` is called and the cache is immediately discarded.
 ### `persistQueryClientSave`
 
 - Your query/mutation are [`dehydrated`](../reference/hydration#dehydrate) and stored by the persister you provided.
-- `createWebStoragePersister` and `createAsyncStoragePersister` throttle this action to happen at most every 1 second to save on potentially expensive writes.  Review their documentation to see how to customize their throttle timing.
+- `createSyncStoragePersister` and `createAsyncStoragePersister` throttle this action to happen at most every 1 second to save on potentially expensive writes.  Review their documentation to see how to customize their throttle timing.
 
 You can use this to explicitly persist the cache at the moment(s) you choose.
 
@@ -182,7 +182,7 @@ For this use-case, you can use the `PersistQueryClientProvider`. It will make su
 ```jsx
 
 import { PersistQueryClientProvider } from 'react-query/persistQueryClient'
-import { createWebStoragePersister } from 'react-query/createWebStoragePersister'
+import { createSyncStoragePersister } from 'react-query/createSyncStoragePersister'
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -192,7 +192,7 @@ const queryClient = new QueryClient({
   },
 })
 
-const persister = createWebStoragePersister({
+const persister = createSyncStoragePersister({
   storage: window.localStorage,
 })
 

examples/react/basic-typescript/src/index.tsx

@@ -4,7 +4,7 @@ import ReactDOM from "react-dom/client";
 import axios from "axios";
 import { useQuery, useQueryClient, QueryClient } from "react-query";
 import { PersistQueryClientProvider } from "react-query/persistQueryClient";
-import { createWebStoragePersister } from "react-query/createWebStoragePersister";
+import { createSyncStoragePersister } from "react-query/createSyncStoragePersister";
 import { ReactQueryDevtools } from "react-query/devtools";
 
 const queryClient = new QueryClient({
@@ -15,7 +15,7 @@ const queryClient = new QueryClient({
   },
 });
 
-const persister = createWebStoragePersister({
+const persister = createSyncStoragePersister({
   storage: window.localStorage,
 });
 

examples/react/offline/src/App.js

@@ -11,7 +11,7 @@ import { ReactQueryDevtools } from "react-query/devtools";
 import toast, { Toaster } from "react-hot-toast";
 
 import { PersistQueryClientProvider } from "react-query/persistQueryClient";
-import { createWebStoragePersister } from "react-query/createWebStoragePersister";
+import { createSyncStoragePersister } from "react-query/createSyncStoragePersister";
 import {
   Link,
   Outlet,
@@ -23,7 +23,7 @@ import {
 import * as api from "./api";
 import { movieKeys, useMovie } from "./movies";
 
-const persister = createWebStoragePersister({
+const persister = createSyncStoragePersister({
   storage: window.localStorage,
 });
 

package.json

@@ -52,9 +52,9 @@
       "import": "./lib/persistQueryClient/index.mjs",
       "default": "./lib/persistQueryClient/index.js"
     },
-    "./createWebStoragePersister": {
-      "import": "./lib/createWebStoragePersister/index.mjs",
-      "default": "./lib/createWebStoragePersister/index.js"
+    "./createSyncStoragePersister": {
+      "import": "./lib/createSyncStoragePersister/index.mjs",
+      "default": "./lib/createSyncStoragePersister/index.js"
     },
     "./createAsyncStoragePersister": {
       "import": "./lib/createAsyncStoragePersister/index.mjs",
@@ -98,7 +98,7 @@
     "core",
     "devtools",
     "persistQueryClient",
-    "createWebStoragePersister",
+    "createSyncStoragePersister",
     "createAsyncStoragePersister",
     "broadcastQueryClient-experimental",
     "reactjs",

rollup.config.js

@@ -26,9 +26,9 @@ const inputSrcs = [
     'persistQueryClient',
   ],
   [
-    'src/createWebStoragePersister/index.ts',
-    'ReactQueryCreateWebStoragePersister',
-    'createWebStoragePersister',
+    'src/createSyncStoragePersister/index.ts',
+    'ReactQueryCreateSyncStoragePersister',
+    'createSyncStoragePersister',
   ],
   [
     'src/createAsyncStoragePersister/index.ts',

src/createWebStoragePersister/index.ts → src/createSyncStoragePersister/index.ts

@@ -11,7 +11,7 @@ interface Storage {
   removeItem: (key: string) => void
 }
 
-interface CreateWebStoragePersisterOptions {
+interface CreateSyncStoragePersisterOptions {
   /** The storage client used for setting and retrieving items from cache.
    * For SSR pass in `undefined`.
    */
@@ -35,14 +35,14 @@ interface CreateWebStoragePersisterOptions {
   retry?: PersistRetryer
 }
 
-export function createWebStoragePersister({
+export function createSyncStoragePersister({
   storage,
   key = `REACT_QUERY_OFFLINE_CACHE`,
   throttleTime = 1000,
   serialize = JSON.stringify,
   deserialize = JSON.parse,
   retry,
-}: CreateWebStoragePersisterOptions): Persister {
+}: CreateSyncStoragePersisterOptions): Persister {
   if (typeof storage !== 'undefined') {
     const trySave = (persistedClient: PersistedClient): Error | undefined => {
       try {

src/createWebStoragePersister/tests/storageIsFull.test.ts → src/createSyncStoragePersister/tests/storageIsFull.test.ts

@@ -1,5 +1,5 @@
 import { dehydrate, MutationCache, QueryCache, QueryClient } from '../../core'
-import { createWebStoragePersister } from '../index'
+import { createSyncStoragePersister } from '../index'
 import { removeOldestQuery } from '../../persistQueryClient'
 import { sleep } from '../../tests/utils'
 
@@ -34,14 +34,14 @@ function getMockStorage(limitSize?: number) {
   } as any) as Storage
 }
 
-describe('createWebStoragePersister ', () => {
+describe('createSyncStoragePersister ', () => {
   test('basic store and recover', async () => {
     const queryCache = new QueryCache()
     const mutationCache = new MutationCache()
     const queryClient = new QueryClient({ queryCache, mutationCache })
 
     const storage = getMockStorage()
-    const webStoragePersister = createWebStoragePersister({
+    const syncStoragePersister = createSyncStoragePersister({
       throttleTime: 0,
       storage,
     })
@@ -59,9 +59,9 @@ describe('createWebStoragePersister ', () => {
       timestamp: Date.now(),
       clientState: dehydrate(queryClient),
     }
-    webStoragePersister.persistClient(persistClient)
+    syncStoragePersister.persistClient(persistClient)
     await sleep(1)
-    const restoredClient = await webStoragePersister.restoreClient()
+    const restoredClient = await syncStoragePersister.restoreClient()
     expect(restoredClient).toEqual(persistClient)
   })
 
@@ -72,7 +72,7 @@ describe('createWebStoragePersister ', () => {
 
     const N = 2000
     const storage = getMockStorage(N * 5) // can save 4 items;
-    const webStoragePersister = createWebStoragePersister({
+    const webStoragePersister = createSyncStoragePersister({
       throttleTime: 0,
       storage,
       retry: removeOldestQuery,
@@ -130,7 +130,7 @@ describe('createWebStoragePersister ', () => {
 
     const N = 2000
     const storage = getMockStorage(0)
-    const webStoragePersister = createWebStoragePersister({
+    const webStoragePersister = createSyncStoragePersister({
       throttleTime: 0,
       storage,
       retry: removeOldestQuery,

tsconfig.types.json

@@ -13,7 +13,7 @@
     "./src/index.ts",
     "./src/devtools/index.ts",
     "./src/persistQueryClient/index.ts",
-    "./src/createWebStoragePersister/index.ts",
+    "./src/createSyncStoragePersister/index.ts",
     "./src/createAsyncStoragePersister/index.ts",
     "./src/broadcastQueryClient-experimental/index.ts"
   ],