chore(query core): upgrade, fix typo

Author: amen-souissi

docs/src/pages/guides/mutations.md

@@ -37,9 +37,9 @@ Here's an example of a mutation that adds a new todo the server:
 A mutation can only be in one of the following states at any given moment:
 
 - `isIdle` or `status === 'idle' - The mutation is currently idle or in a fresh/reset state
-- `isLoading` or `status === 'loading' - The mutation is currently running
+- `isLoading` or `status === 'loading' -` The mutation is currently running
 - `isError` or `status === 'error'` - The mutation encountered an error
-- `isSuccess` or `status === 'success' - The mutation was successful and mutation data is available
+- `isSuccess` or `status === 'success'` - The mutation was successful and mutation data is available
 
 Beyond those primary state, more information is available depending on the state the mutation:
 

docs/src/pages/guides/paginated-queries.md

@@ -30,7 +30,7 @@ Consider the following example where we would ideally want to increment a pageIn
   const fetchProjects = (page = 0) => fetch('/api/projects?page=' + page)
 </script>
 
-<Query options={{ queryKey: ['projects', page], queryFn: () => fetchProjects(page) }}>
+<Query options={{ queryKey: ['projects', page], queryFn: () => fetchProjects(page), keepPreviousData: true }}>
   <div slot="query" let:queryResult>
     {#if queryResult.status === 'loading'}
       Loading...

docs/src/pages/guides/queries.md

@@ -30,18 +30,18 @@ const result = useQuery('todos', fetchTodoList)
 
 The `result` object contains a few very important states you'll need to be aware of to be productive. A query can only be in one of the following states at any given moment:
 
-- `isLoading` or `status === 'loading' - The query has no data and is currently fetching
+- `isLoading` or `status === 'loading'` - The query has no data and is currently fetching
 - `isError` or `status === 'error'` - The query encountered an error
-- `isSuccess` or `status === 'success' - The query was successful and data is available
-- `isIdle` or `status === 'idle' - The query is currently disabled (you'll learn more about this in a bit)
+- `isSuccess` or `status === 'success'` - The query was successful and data is available
+- `isIdle` or `status === 'idle'` - The query is currently disabled (you'll learn more about this in a bit)
 
 Beyond those primary state, more information is available depending on the state the query:
 
 - `error` - If the query is in an `isError` state, the error is available via the `error` property.
 - `data` - If the query is in a `success` state, the data is available via the `data` property.
 - `isFetching` - In any state, if the query is fetching at any time (including background refetching) `isFetching` will be `true`.
 
-For **most** queries, it's usually sufficient to check for the `isLoading` state, then the `isError` state, then finally, assume that the data is avaiable and render the successful state:
+For **most** queries, it's usually sufficient to check for the `isLoading` state, then the `isError` state, then finally, assume that the data is available and render the successful state:
 
 ```markdown
 

src/queryCore/persist-localstorage-experimental/index.ts

@@ -31,17 +31,21 @@ export function persistWithLocalStorage(
     buster = '',
   }: Options = {}
 ) {
-  const saveCache = throttle(() => {
-    const storageCache: LocalStorageCache = {
-      buster,
-      timestamp: Date.now(),
-      cacheState: dehydrate(queryClient),
-    }
+  if (typeof window !== 'undefined') {
+    // Subscribe to changes
+    const saveCache = throttle(() => {
+      const storageCache: LocalStorageCache = {
+        buster,
+        timestamp: Date.now(),
+        cacheState: dehydrate(queryClient),
+      }
+
+      localStorage.setItem(localStorageKey, JSON.stringify(storageCache))
+    }, throttleTime)
 
-    localStorage.setItem(localStorageKey, JSON.stringify(storageCache))
-  }, throttleTime)
+    queryClient.getQueryCache().subscribe(saveCache)
 
-  if (typeof localStorage !== 'undefined') {
+    // Attempt restore
     const cacheStorage = localStorage.getItem(localStorageKey)
 
     if (!cacheStorage) {
@@ -58,9 +62,9 @@ export function persistWithLocalStorage(
       } else {
         hydrate(queryClient, cache.cacheState)
       }
+    } else {
+      localStorage.removeItem(localStorageKey)
     }
-
-    queryClient.getQueryCache().subscribe(saveCache)
   }
 }