chore: Merge svelte-query and CI changes into v5 (#4816)

* feat(svelte-query): Svelte Query Adapter for TanStack Query (#4768) * feat: svelte-query adapter * add examples * add @testing-library/svelte and svelte-jester * add transform for testing svelte components * re-export @tanstack/core core * add a few initial test * delete tests in examples * use ^ in dependencies * delete and gitignore .vscode * rename basic-typescript to basic * add basic example to ci.json * remove transform from global preset * update version * don't gitignore lib directory in svelte examples * fix build files location in package.json * chore: prettier formatting * add missing state * chore: fix eslint errors * add context * unsubscribe * add missing export * use svelte context * update version * update examples to use context * release: v4.14.5 * remove onMount * add onMount to setQueryClient * remove unneeded exports * Add basic svelte docs overview * Add SvelteKit 1.0 example Uses the data from the simple example * Edit nodeResolve settings * More rollup and babel tweaks Seems to be working * Try svelte plugin options * Separate out svelte config * Switch to svelte-package * Reset rollup config * Output to ./build * Use vitest in svelte-query * Fix test imports * Avoid transpiling TS during typecheck * Fix vitest command * More vitest migration work * Minor fixes to tests * Rename file to types.d.ts * Replace setQueryContext with QueryClientProvider * Replace tabs with spaces for repo consistency * Update examples to sveltekit 1.0 * Implement Hydrate component * Add playground example Rewrite of the react example * Start adding star-wars example * Add films and film pages * Finish star-wars example * Rename store functions with create prefix * Add correct favicons * Reorder some files in svelte-query * Undo rollup.config.ts changes * Add new createQuery and createMutation tests * More descriptive test name * Misc fixes from feedback - Max TS 4.7.4 - Move root package.json dependencies - Use object syntax - Use test:jest script (for now) - Remove sveltekit autogenerated files * Fix pnpm-lock * Specify svelte-package source, update TS to 4.7.4 * Remove unnecessary packages in examples * Sync pnpm-lock * Reset pnpm-lock to upstream * Run pnpm install * Remove svelte-query from root tsconfg Needs to be run from its own svelte-check package... sorry * Run prettier, remove unused import * Run prettier on svelte files Requires prettier-plugin-svelte to run * Prettier for changed files * Fix cipublish from svelte-query * rimraf to remove build/lib/package.json * Run svelte-kit sync before vitest * Add files field to package.json * Add types field to package.json * Bump svelte-query version to 4.20.0 In case this fixes the CI issue * Add path alias to vitest * Update vitest to 0.26 Changes module resolution? * More CI improvements * Remove --parallel from pnpm scripts * Remove unused dependency * Add eslint settings Thanks @rivo420 * Add coverage report Co-authored-by: DeAndre Johnson <dre@phreshr.com> Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> RELEASE_ALL * chore: Remove incompatible vitest flag from test:ci (#4777) * Remove coverage flag Add back again in a simpler script setup * Allow coverage to run on test:ci * release: v4.21.0 * feat: export default hydration methods for easier extension in `dehydrateOptions` (#4751) * export default hydration metods to allow for easier extending * pretty Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * release: v4.22.0 * docs(svelte-query): Add installation and examples (#4781) * chore: Restructure package scripts (#4779) * Use rimraf for clean script Supported on windows * Restructure jest tests, types test, and building types * Relative eslint and jest paths are not needed Now works on windows too, and tested to make sure it doesn't break linux * Run codemod tests from main jest.config.ts --collectCoverage false breaks when passed in to the union of these * Remove unused test:lib scripts * Add prettier-plugin-svelte * Call test:types in github workflow * Add missing build:types to query-async-storage-persister * Simplify build script Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * docs(svelte-query): Add SSR and SvelteKit guide (#4786) * Add SSR docs * Remove semicolons to match project style * docs: fix sveltekit SSR link (#4792) * fix(svelte-query): Remove dependency on SvelteKit (#4788) * Use rimraf for clean script Supported on windows * Restructure jest tests, types test, and building types * Relative eslint and jest paths are not needed Now works on windows too, and tested to make sure it doesn't break linux * Run codemod tests from main jest.config.ts --collectCoverage false breaks when passed in to the union of these * Remove unused test:lib scripts * Add prettier-plugin-svelte * Call test:types in github workflow * Add missing build:types to query-async-storage-persister * Build without sveltekit * Update vite-plugin-svelte to 2.0 * Add dev/watch script to svelte-query * Replace sveltePreprocess with vitePreprocess * Fix example component and indentation * Remove dev/watch Breaks setup because it adds package.json that isn't removed by rimraf * Move /src/lib to /src, ignore __tests__ in build * Fix tsconfig included files * Replace tabs with spaces * Whoops messed up merge * Add more tsconfig.json settings Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * release: v4.22.1 * refactor(svelte-query): Clean-up type definitions (#4800) * Simplify types * Run prettier * Add reactivity docs, rename example * This function does not need to be reactive * release: v4.22.2 * docs(svelte-query): Expand SSR docs (#4809) * docs(svelte-query): Expand SSR docs * Expand wording * Run prettier * docs: Update devtools.md with note that mutations are not tracked (#4810) This can save others some time browsing around trying to get it to work * docs: clarify interaction of query filter predicates with other criteria (#4532) * docs: clarify interaction of query filter predicates with other criteria * Update docs/guides/filters.md Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * Update docs/guides/filters.md Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * docs(svelte-query): Rework SvelteKit setup (#4811) * Add some default options * Rewrite hydration example * Run prettier * Rename example to SSR * Add recommended SvelteKit setup * Rework infinite scroll in sveltekit * Add SvelteKit note to overview * Switch basic example to sveltekit Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * chore: Add sandbox.config.json (#4812) * docs: fix typo (quey -> query) (#4813) * docs(svelte-query): Add recommended defaults to prefetchQuery setup (#4815) * Add recommended defaults to prefetch example * Move SSR docs up in sidebar * docs: update tkdodos blog (#4820) * docs: clarify the documentation on running examples (#4818) * docs: clarify the documentation on running examples * docs: use the proper watch command in docs for running examples * chore: fix duplicated example package name (#4823) * test: stabilize various tests (#4825) * test: stabilize various tests * chore: bump istanbul version * docs(useMutation): clarify `mutationFn` option default (#4837) * docs(useMutation): clarify `mutationFn` option default * Make optionality consistent with `useQuery` documentation Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * fix(svelte-query): Fix createMutation for functions that take no arguments (#4847) * Update createMutation test function name * Default TVariables = void * Fix createMutation test * Fix prettier * release: v4.22.3 * fix(core): do not call mutate callbacks if mutation started after unmount (#4848) * test: add mutation callback after unmount test * test: make test more resilient * fix(core): do not call mutate callbacks if mutation started after unmount * test: adapt tests to what we have in v5 - one test has been removed (because setState was removed entirely) - the second test has been re-written to not use internals anymore, and it works in v4 as well * fix(core): do not call mutate callbacks if mutation started after unmount by making sure the callbacks are only invoked if we have an active listener * chore: prettier again Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * release: v4.22.4 * docs(useMutation): correct docs for mutate function callbacks (#4601) * docs(useMutation): correct docs for mutate function callbacks * docs: fix merge conflicts Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> * docs: add QueryClient import (#4856) * docs: add readme.md to react adapter * Fix createQuery * Finish svelte-query changes * Run prettier * Fix initial merge * Fix examples * Fix prettier again Co-authored-by: Tanner Linsley <tannerlinsley@users.noreply.github.com> Co-authored-by: Manthan Mallikarjun <nahtnam@gmail.com> Co-authored-by: Dominik Dorfmeister <office@dorfmeister.cc> Co-authored-by: ottomated <31470743+ottomated@users.noreply.github.com> Co-authored-by: Joseph Markus <joseph.markus@outlook.com> Co-authored-by: Ben Longo <11063448+benlongo@users.noreply.github.com> Co-authored-by: Masaki Koyanagi <mascii@gmail.com> Co-authored-by: Michal Tecza <zorza2@gmail.com> Co-authored-by: Louis Young <me@louisyoung.co.uk> Co-authored-by: Jan <39303600+janlat@users.noreply.github.com> Co-authored-by: Qz <38932402+QzCurious@users.noreply.github.com> Co-authored-by: Joël Kuijper <31251240+Joehoel@users.noreply.github.com>
TanStack · Jan 25, 2023 · c4f90ad · c4f90ad
1 parent 5b252e6
commit c4f90ad
Show file tree

Hide file tree

Showing 220 changed files with 6,592 additions and 216 deletions.
diff --git a/.codesandbox/ci.json b/.codesandbox/ci.json
@@ -1,6 +1,6 @@
 {
   "installCommand": "install:csb",
-  "sandboxes": ["/examples/react/basic-typescript", "/examples/solid/basic-typescript", "/examples/vue/basic"],
+  "sandboxes": ["/examples/react/basic-typescript", "/examples/solid/basic-typescript", "/examples/svelte/basic", "/examples/vue/basic"],
   "packages": ["packages/**"],
   "node": "16"
 }
diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml
@@ -15,7 +15,7 @@ jobs:
           cache: 'pnpm'
       - name: Install dependencies
         run: pnpm --filter "./packages/**" --filter query --prefer-offline install
-      - run: pnpm run test:jest
+      - run: pnpm run test:lib
       - name: Upload coverage to Codecov
         uses: codecov/codecov-action@v2
   lint:
@@ -47,7 +47,7 @@ jobs:
           cache: 'pnpm'
       - name: Install dependencies
         run: pnpm --filter "./packages/**" --filter query --prefer-offline install
-      - run: pnpm run typecheck
+      - run: pnpm run test:types
   format:
     name: 'Format'
     runs-on: ubuntu-latest

diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-v16.14.2
+v16.19.0
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1 @@
+/packages/svelte-query/.svelte-kit
diff --git a/.prettierrc b/.prettierrc
@@ -1,5 +1,8 @@
 {
   "semi": false,
   "singleQuote": true,
-  "trailingComma": "all"
+  "trailingComma": "all",
+  "pluginSearchDirs": false,
+  "plugins": ["prettier-plugin-svelte"],
+  "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
 }
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -22,12 +22,21 @@ If you have been assigned to fix an issue or develop a new feature, please follo
   - We use [nvm](https://github.com/nvm-sh/nvm) to manage node versions - please make sure to use the version mentioned in `.nvmrc`.
 - Run development server using `pnpm run watch`.
 - Implement your changes and tests to files in the `src/` directory and corresponding test files.
-- To run examples, follow their individual directions.
-- To run examples using your local build, be sure to have development server (`pnpm run watch`) running.
 - Document your changes in the appropriate doc page.
 - Git stage your required changes and commit (see below commit guidelines).
 - Submit PR for review.
 
+### Running examples
+- Make sure you've installed the dependencies by running `$ pnpm install` in the repo's root directory.
+- If you want to run the example against your local changes, run `pnpm run watch` in the repo's root directory. Otherwise, it will be run against the latest TanStack Query release.
+- Run `pnpm run dev` in the selected examples' directory.
+
+#### Note on `examples/react-native`
+React Native example requires Expo to work. Please follow the instructions from example's README.md file to learn more.
+
+#### Note on standalone execution
+If you want to run an example without installing dependencies for the whole repo, just follow instructions from the example's README.md file. It will be then run against the latest TanStack Query release.
+
 ## Online one-click setup
 
 You can use Gitpod (An Online Open Source VS Code like IDE which is free for Open Source) for developing online. With a single click it will start a workspace and automatically:

diff --git a/babel.config.js b/babel.config.js
@@ -34,7 +34,7 @@ module.exports = {
   ].filter(Boolean),
   overrides: [
     {
-      exclude: ['./packages/solid-query/**', './packages/vue-query/**'],
+      exclude: ['./packages/solid-query/**', './packages/svelte-query/**', './packages/vue-query/**'],
       presets: ['@babel/react'],
     },
     {

diff --git a/docs/config.json b/docs/config.json
@@ -688,8 +688,57 @@
           "label": "Getting Started",
           "children": [
             {
-              "label": "Coming Soon",
+              "label": "Overview",
               "to": "svelte/overview"
+            },
+            {
+              "label": "Installation",
+              "to": "svelte/installation"
+            },
+            {
+              "label": "SSR & SvelteKit",
+              "to": "svelte/ssr"
+            },
+            {
+              "label": "Reactivity",
+              "to": "svelte/reactivity"
+            }
+          ]
+        },
+        {
+          "label": "Examples",
+          "children": [
+            {
+              "label": "Simple",
+              "to": "svelte/examples/svelte/simple"
+            },
+            {
+              "label": "Basic",
+              "to": "svelte/examples/svelte/basic"
+            },
+            {
+              "label": "Auto Refetching / Polling / Realtime",
+              "to": "svelte/examples/svelte/auto-refetching"
+            },
+            {
+              "label": "SSR",
+              "to": "svelte/examples/svelte/ssr"
+            },
+            {
+              "label": "Optimistic Updates in TypeScript",
+              "to": "svelte/examples/svelte/optimistic-updates-typescript"
+            },
+            {
+              "label": "Playground",
+              "to": "svelte/examples/svelte/playground"
+            },
+            {
+              "label": "Star Wars",
+              "to": "svelte/examples/svelte/star-wars"
+            },
+            {
+              "label": "Infinite Queries",
+              "to": "svelte/examples/svelte/load-more-infinite-scroll"
             }
           ]
         }

diff --git a/docs/react/community/tkdodos-blog.md b/docs/react/community/tkdodos-blog.md
@@ -3,8 +3,7 @@ id: tkdodos-blog
 title: TkDodo's Blog
 ---
 
-React Query maintainer [TkDodo](https://twitter.com/tkdodo) has a series of blog posts about using and working with the library. Some articles show general best practices, but most have an _opinionated_ point of view.
-
+TanStack Query maintainer [TkDodo](https://twitter.com/tkdodo) has a series of blog posts about using and working with the library. Some articles show general best practices, but most have an _opinionated_ point of view.
 
 ## [#1: Practical React Query](https://tkdodo.eu/blog/practical-react-query)
 
@@ -38,6 +37,10 @@ React Query maintainer [TkDodo](https://twitter.com/tkdodo) has a series of blog
 
 > Most examples just use a simple String or Array Query Key, but how do you organize your keys effectively once your app grows past a todo list? This article shows how co-location and Query Key Factories can make life easier. [Read more...](https://tkdodo.eu/blog/effective-react-query-keys)
 
+## [#8a: Leveraging the Query Function Context](https://tkdodo.eu/blog/leveraging-the-query-function-context)
+
+> In this amendment to the previous blog post, we look at how we can leverage the Query Function Context and Object Query Keys for maximum safety as our app grows. [Read more...](https://tkdodo.eu/blog/leveraging-the-query-function-context)
+
 ## [#9: Placeholder and Initial Data in React Query](https://tkdodo.eu/blog/placeholder-and-initial-data-in-react-query)
 
 > Placeholder and Initial Data are two similar yet different concepts for synchronously showing data instead of a loading spinner to improve an application's UX. This blog post compares the two and outlines the scenarios where each one shines. [Read more...](https://tkdodo.eu/blog/placeholder-and-initial-data-in-react-query)
@@ -54,7 +57,6 @@ React Query maintainer [TkDodo](https://twitter.com/tkdodo) has a series of blog
 
 > Mutations are the important, second part necessary to work with server data - for situations where you need to update it. This blog post covers what mutations are and how they are different from queries. You'll learn the difference between `mutate` and `mutateAsync` as well as how you can tie queries and mutations together. [Read more...](https://tkdodo.eu/blog/mastering-mutations-in-react-query)
 
-
 ## [#13: Offline React Query](https://tkdodo.eu/blog/offline-react-query)
 
 > There are many ways to produce promises - which is everything React Query needs - but by far the biggest use-case is data fetching. Very often, that requires an active network connection. But sometimes, especially on mobile devices where, the network connection can be unreliable, you need your app to also work without it. In this article, you'll learn about the different offline strategies React Query offers. [Read more...](https://tkdodo.eu/blog/offline-react-query)
@@ -66,3 +68,19 @@ React Query maintainer [TkDodo](https://twitter.com/tkdodo) has a series of blog
 ## [#15: React Query FAQs](https://tkdodo.eu/blog/react-query-fa-qs)
 
 > This article tries to answer the most frequently asked questions about React Query. [Read more...](https://tkdodo.eu/blog/react-query-fa-qs)
+
+## [#16: React Query meets React Router](https://tkdodo.eu/blog/react-query-meets-react-router)
+
+> Remix and React Router are changing the game when thinking about _when_ to fetch data. This article goes into why React Query and Routers that support data loading are a match made in heaven. [Read more...](https://tkdodo.eu/blog/react-query-meets-react-router)
+
+## [#17: Seeding the Query Cache](https://tkdodo.eu/blog/seeding-the-query-cache)
+
+> This blog post shows multiple ways how to get data into your Query Cache _before_ you start rendering to minimize the amount of loading spinners displayed in your app. The options range from prefetching on the server or in your router to seeding cache entries via `setQueryData`. [Read more...](https://tkdodo.eu/blog/seeding-the-query-cache)
+
+## [#18: Inside React Query](https://tkdodo.eu/blog/inside-react-query)
+
+> If you've ever wondered how React Query works under the hood - this post is for you. It explains the architecture (including visuals), starting with the agnostic Query Core and how it communicates with the framework specific adapters. [Read more...](https://tkdodo.eu/blog/inside-react-query)
+
+## [#19: Type-safe React Query](https://tkdodo.eu/blog/type-safe-react-query)
+
+> There's a big difference between "having types" and "being type-safe". This article tries to outline those differences and shows how you can get the best possible type-safety when using React Query together with TypeScript [Read more...](https://tkdodo.eu/blog/inside-react-query)
diff --git a/docs/react/devtools.md b/docs/react/devtools.md
@@ -9,6 +9,8 @@ When you begin your React Query journey, you'll want these devtools by your side
 
 > Please note that for now, the devtools **do not support React Native**. If you would like to help us make the devtools platform agnostic, please let us know!
 
+> Also note that you can use these devtools to observe queries, but **not mutations**
+
 ## Install and Import the Devtools
 
 The devtools are a separate package that you need to install:

diff --git a/docs/react/guides/caching.md b/docs/react/guides/caching.md
@@ -29,5 +29,5 @@ Let's assume we are using the default `gcTime` of **5 minutes** and the default
   - Since there are no more active instances of this query, a garbage collection timeout is set using `gcTime` to delete and garbage collect the query (defaults to **5 minutes**).
 - Before the cache timeout has completed, another instance of `useQuery({ queryKey: ['todos'], queyFn: fetchTodos })` mounts. The query immediately returns the available cached data while the `fetchTodos` function is being run in the background. When it completes successfully, it will populate the cache with fresh data.
 - The final instance of `useQuery({ queryKey: ['todos'], queryFn: fetchTodos })` unmounts.
-- No more instances of `useQuery({ queyKey: ['todos'], queryFn: fetchTodos })` appear within **5 minutes**.
+- No more instances of `useQuery({ queryKey: ['todos'], queryFn: fetchTodos })` appear within **5 minutes**.
   - The cached data under the `['todos']` key is deleted and garbage collected.
diff --git a/docs/react/guides/filters.md b/docs/react/guides/filters.md
@@ -41,7 +41,7 @@ A query filter object supports the following properties:
   - When set to `paused` it will match queries that wanted to fetch, but have been `paused`.
   - When set to `idle` it will match queries that are not fetching.
 - `predicate?: (query: Query) => boolean`
-  - This predicate function will be called for every single query in the cache and be expected to return truthy for queries that are `found`.
+  - This predicate function will be used as a final filter on all matching queries. If no other filters are specified, this function will be evaluated against every query in the cache.
 
 ## `Mutation Filters`
 
@@ -62,12 +62,12 @@ await queryClient.isMutating({
 
 A mutation filter object supports the following properties:
 
+- `mutationKey?: MutationKey`
+  - Set this property to define a mutation key to match on.
 - `exact?: boolean`
   - If you don't want to search mutations inclusively by mutation key, you can pass the `exact: true` option to return only the mutation with the exact mutation key you have passed.
 - `fetching?: boolean`
   - When set to `true` it will match mutations that are currently fetching.
   - When set to `false` it will match mutations that are not fetching.
 - `predicate?: (mutation: Mutation) => boolean`
-  - This predicate function will be called for every single mutation in the cache and be expected to return truthy for mutations that are `found`.
-- `mutationKey?: MutationKey`
-  - Set this property to define a mutation key to match on.
+  - This predicate function will be used as a final filter on all matching mutations. If no other filters are specified, this function will be evaluated against every mutation in the cache.
diff --git a/docs/react/guides/mutations.md b/docs/react/guides/mutations.md
@@ -182,7 +182,7 @@ useMutation({
 
 [//]: # 'Example5'
 
-You might find that you want to **trigger additional callbacks** beyond the ones defined on `useMutation` when calling `mutate`. This can be used to trigger component-specific side effects. To do that, you can provide any of the same callback options to the `mutate` function after your mutation variable. Supported overrides include: `onSuccess`, `onError` and `onSettled`. Please keep in mind that those additional callbacks won't run if your component unmounts _before_ the mutation finishes.
+You might find that you want to **trigger additional callbacks** beyond the ones defined on `useMutation` when calling `mutate`. This can be used to trigger component-specific side effects. To do that, you can provide any of the same callback options to the `mutate` function after your mutation variable. Supported options include: `onSuccess`, `onError` and `onSettled`. Please keep in mind that those additional callbacks won't run if your component unmounts _before_ the mutation finishes.
 
 [//]: # 'Example6'
 

diff --git a/docs/react/guides/placeholder-query-data.md b/docs/react/guides/placeholder-query-data.md
@@ -44,7 +44,7 @@ If the process for accessing a query's placeholder data is intensive or just not
 function Todos() {
   const placeholderData = useMemo(() => generateFakeTodos(), [])
   const result = useQuery({
-    queyKey: ['todos'],
+    queryKey: ['todos'],
     queryFn: () => fetch('/todos'),
     placeholderData,
   })

diff --git a/docs/react/guides/prefetching.md b/docs/react/guides/prefetching.md
@@ -34,3 +34,11 @@ queryClient.setQueryData(['todos'], todos)
 ```
 
 [//]: # 'Example2'
+
+[//]: # 'Materials'
+
+## Further reading
+
+For a deep-dive on how to get data into your Query Cache before you fetch, have a look at [#17: Seeding the Query Cache](../community/tkdodos-blog#17-seeding-the-query-cache) from the Community Resources.
+
+[//]: # 'Materials'
diff --git a/docs/react/plugins/createAsyncStoragePersister.md b/docs/react/plugins/createAsyncStoragePersister.md
@@ -27,6 +27,7 @@ yarn add @tanstack/query-async-storage-persister @tanstack/react-query-persist-c
 
 ```tsx
 import AsyncStorage from '@react-native-async-storage/async-storage'
+import { QueryClient } from '@tanstack/react-query'
 import { PersistQueryClientProvider } from '@tanstack/react-query-persist-client'
 import { createAsyncStoragePersister } from '@tanstack/query-async-storage-persister'
 

diff --git a/docs/react/reference/QueryCache.md b/docs/react/reference/QueryCache.md
@@ -111,3 +111,11 @@ The `clear` method can be used to clear the cache entirely and start fresh.
 ```tsx
 queryCache.clear()
 ```
+[//]: # 'Materials'
+
+## Further reading
+
+To get a better understanding how the QueryCache works internally, have a look at [#18: Inside React Query
+](../community/tkdodos-blog#18-inside-react-query) from the Community Resources.
+
+[//]: # 'Materials'
diff --git a/docs/react/reference/hydration.md b/docs/react/reference/hydration.md
@@ -33,11 +33,13 @@ const dehydratedState = dehydrate(queryClient, {
     - This function is called for each mutation in the cache
     - Return `true` to include this mutation in dehydration, or `false` otherwise
     - The default version only includes paused mutations
+    - If you would like to extend the function while retaining the previous behavior, import and execute `defaultShouldDehydrateMutation` as part of the return statement
   - `shouldDehydrateQuery: (query: Query) => boolean`
     - Optional
     - This function is called for each query in the cache
     - Return `true` to include this query in dehydration, or `false` otherwise
     - The default version only includes successful queries, do `shouldDehydrateQuery: () => true` to include all queries
+    - If you would like to extend the function while retaining the previous behavior, import and execute `defaultShouldDehydrateQuery` as part of the return statement
 
 **Returns**
 

diff --git a/docs/react/reference/useMutation.md b/docs/react/reference/useMutation.md
@@ -43,7 +43,7 @@ mutate(variables, {
 **Options**
 
 - `mutationFn: (variables: TVariables) => Promise<TData>`
-  - **Required**
+  - **Required, but only if no default mutation function has been defined**
   - A function that performs an asynchronous task and returns a promise.
   - `variables` is an object that `mutate` will pass to your `mutationFn`
 - `gcTime: number | Infinity`
@@ -96,7 +96,7 @@ mutate(variables, {
 **Returns**
 
 - `mutate: (variables: TVariables, { onSuccess, onSettled, onError }) => void`
-  - The mutation function you can call with variables to trigger the mutation and optionally override options passed to `useMutation`.
+  - The mutation function you can call with variables to trigger the mutation and optionally hooks on additional callback options.
   - `variables: TVariables`
     - Optional
     - The variables object to pass to the `mutationFn`.

diff --git a/docs/react/typescript.md b/docs/react/typescript.md
@@ -118,6 +118,8 @@ const { error } = useQuery<Group[], Error>(['groups'], fetchGroups)
 ## Further Reading
 
 For tips and tricks around type inference, have a look at [React Query and TypeScript](../community/tkdodos-blog#6-react-query-and-typescript) from
-the Community Resources.
+the Community Resources. To find out how to get the best possible type-safety, you can read [Type-safe React Query](../community/tkdodos-blog#19-type-safe-react-query).
+
+[//]: # 'Materials'
 
 [//]: # 'Materials'
diff --git a/docs/svelte/installation.md b/docs/svelte/installation.md
@@ -0,0 +1,18 @@
+---
+id: installation
+title: Installation
+---
+
+You can install Svelte Query via [NPM](https://npmjs.com).
+
+### NPM
+
+```bash
+$ npm i @tanstack/svelte-query
+# or
+$ pnpm add @tanstack/svelte-query
+# or
+$ yarn add @tanstack/svelte-query
+```
+
+> Wanna give it a spin before you download? Try out the [basic](/query/v4/docs/svelte/examples/svelte/basic) example!