Merge remote-tracking branch 'react-query/master' into alpha

# Conflicts:
#	src/core/notifyManager.ts
#	src/core/types.ts

Author: TkDodo

.all-contributorsrc

@@ -193,6 +193,16 @@
       "contributions": [
         "code"
       ]
+    },
+    {
+      "login": "arnaudbzn",
+      "name": "Arnaud",
+      "avatar_url": "https://avatars.githubusercontent.com/u/20332397?v=4",
+      "profile": "http://seaviewlab.com",
+      "contributions": [
+        "code",
+        "doc"
+      ]
     }
   ],
   "contributorsPerLine": 7,

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -6,14 +6,14 @@ body:
       value: |
         Thank you for reporting an issue :pray:.
 
-        This issue tracker is for reporting reproducible bugs or regression's found in react-query (https://github.com/tannerlinsley/react-query)
+        This issue tracker is for reporting reproducible bugs or regression's found in [react-query](https://github.com/tannerlinsley/react-query)
         If you have a question about how to achieve something and are struggling, please post a question
-        inside of react-query's Discussion's tab: https://github.com/tannerlinsley/react-query/discussions
+        inside of react-query's [Discussions tab](https://github.com/tannerlinsley/react-query/discussions)
 
         Before submitting a new bug/issue, please check the links below to see if there is a solution or question posted there already:
-         - react-query's Discussion's tab: https://github.com/tannerlinsley/react-query/discussions
-         - react-query's Issue's tab: https://github.com/tannerlinsley/react-query/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc
-         - react-query's Closed issues tab: https://github.com/tannerlinsley/react-query/issues?q=is%3Aissue+sort%3Aupdated-desc+is%3Aclosed
+         - react-query's [Discussions tab](https://github.com/tannerlinsley/react-query/discussions)
+         - react-query's [Open Issues](https://github.com/tannerlinsley/react-query/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc)
+         - react-query's [Closed Issues](https://github.com/tannerlinsley/react-query/issues?q=is%3Aissue+sort%3Aupdated-desc+is%3Aclosed)
 
         The more information you fill in, the better the community can help you.
   - type: textarea
@@ -26,15 +26,20 @@ body:
   - type: input
     id: link
     attributes:
-      label: Your Example Website or App
+      label: Your minimal, reproducible example
       description: |
-        Which website or app were you using when the bug happened?
+        Please add a link to a minimal reproduction.
         Note:
-        - Your bug will may get fixed much faster if we can run your code and it doesn't have dependencies other than React.
-        - To create a shareable code example you can use Stackblitz (https://stackblitz.com/) or CodeSandbox (https://codesandbox.io/s/new). Please no localhost URLs.
+        - Your bug may get fixed much faster if we can run your code and it doesn't have dependencies other than React.
+        - To create a shareable code example for web, you can use CodeSandbox (https://codesandbox.io/s/new) or Stackblitz (https://stackblitz.com/).
+        - Please make sure the example is complete and runnable - e.g. avoid localhost URLs.
+        - To stub out real api requests - Promise.resolve and Promise.reject are good options for easy reproduction
+        - Feel free to fork any of the official CodeSandbox examples to reproduce your issue: https://react-query.tanstack.com/examples/simple
+        - For React Native, you can use: https://snack.expo.dev/
+        - For TypeScript related issues only, a TypeScript Playground link might be sufficient: https://www.typescriptlang.org/play
         - Please read these tips for providing a minimal example: https://stackoverflow.com/help/mcve.
       placeholder: |
-        e.g. Stackblitz, Code Sandbox app url
+        e.g. Code Sandbox, Stackblitz, Expo Snack or TypeScript playground
     validations:
       required: true
   - type: textarea
@@ -82,12 +87,32 @@ body:
     id: platform
     attributes:
       label: Platform
-      value: |
+      description: |
+        Please let us know which Operting System, Browser and Browser version you were using when the issue occurred.
+      placeholder: |
         - OS: [e.g. macOS, Windows, Linux, iOS, Android]
         - Browser: [e.g. Chrome, Safari, Firefox, React Native]
         - Version: [e.g. 91.1]
     validations:
       required: true
+  - type: input
+    id: rq-version
+    attributes:
+      label: react-query version
+      description: |
+        Please let us know the exact version of react-query you were using when the issue occurred. Please don't just put in "latest", as this is subject to change.
+      placeholder: |
+        e.g. v3.30.1
+    validations:
+      required: true
+  - type: input
+    id: ts-version
+    attributes:
+      label: TypeScript version
+      description: |
+        If you are using TypeScript, please let us know the exact version of TypeScript you were using when the issue occurred.
+      placeholder: |
+        e.g. v4.5.4
   - type: textarea
     id: additional
     attributes:

README.md

@@ -81,6 +81,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
     <td align="center"><a href="http://prateeksurana.me"><img src="https://avatars.githubusercontent.com/u/21277179?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Prateek Surana</b></sub></a><br /><a href="https://github.com/tannerlinsley/react-query/commits?author=prateek3255" title="Code">💻</a></td>
     <td align="center"><a href="https://github.com/babycourageous"><img src="https://avatars.githubusercontent.com/u/14936212?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Rene Dellefont</b></sub></a><br /><a href="https://github.com/tannerlinsley/react-query/commits?author=babycourageous" title="Code">💻</a> <a href="https://github.com/tannerlinsley/react-query/commits?author=babycourageous" title="Documentation">📖</a></td>
     <td align="center"><a href="https://github.com/jvuoti"><img src="https://avatars.githubusercontent.com/u/3702781?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Janne Vuoti</b></sub></a><br /><a href="https://github.com/tannerlinsley/react-query/commits?author=jvuoti" title="Code">💻</a></td>
+    <td align="center"><a href="http://seaviewlab.com"><img src="https://avatars.githubusercontent.com/u/20332397?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Arnaud</b></sub></a><br /><a href="https://github.com/tannerlinsley/react-query/commits?author=arnaudbzn" title="Code">💻</a> <a href="https://github.com/tannerlinsley/react-query/commits?author=arnaudbzn" title="Documentation">📖</a></td>
   </tr>
 </table>
 

docs/src/manifests/manifest.json

@@ -316,6 +316,11 @@
           "title": "Next.js",
           "path": "/examples/nextjs",
           "editUrl": "/examples/nextjs.mdx"
+        },
+        {
+          "title": "React Native",
+          "path": "/examples/react-native",
+          "editUrl": "/examples/react-native.mdx"
         }
       ]
     },

docs/src/pages/community/tkdodos-blog.md

@@ -52,4 +52,4 @@ React Query maintainer [TkDodo](https://twitter.com/tkdodo) has a series of blog
 
 ## [#12: Mastering Mutations in React Query](https://tkdodo.eu/blog/mastering-mutations-in-react-query)
 
-> Mutation 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)
+> 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)

docs/src/pages/examples/react-native.mdx

@@ -0,0 +1,23 @@
+---
+id: react-native
+title: React Native
+toc: false
+---
+
+- [Open the Snack](https://snack.expo.dev/@arnaudbzn/react-query-basic-example)
+- [TypeScript version in the repo](https://github.com/tannerlinsley/react-query/tree/master/examples/react-native)
+
+<iframe
+  src="https://snack.expo.dev/@arnaudbzn/react-query-basic-example"
+  title="tannerlinsley/react-query: react native"
+  sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
+  style={{
+    width: '100%',
+    height: '80vh',
+    border: '0',
+    borderRadius: 8,
+    overflow: 'hidden',
+    position: 'static',
+    zIndex: 0,
+  }}
+></iframe>

docs/src/pages/guides/ssr.md

@@ -107,6 +107,12 @@ function Posts() {
 
 As demonstrated, it's fine to prefetch some queries and let others fetch on the queryClient. This means you can control what content server renders or not by adding or removing `prefetchQuery` for a specific query.
 
+### Caveat for Next.js rewrites
+
+There's a catch if you're using [Next.js' rewrites feature](https://nextjs.org/docs/api-reference/next.config.js/rewrites) together with [Automatic Static Optimization](https://nextjs.org/docs/advanced-features/automatic-static-optimization) or `getStaticProps`: It will cause a second hydration by React Query. That's because [Next.js needs to ensure that they parse the rewrites](https://nextjs.org/docs/api-reference/next.config.js/rewrites#rewrite-parameters) on the client and collect any params after hydration so that they can be provided in `router.query`.
+
+The result is missing referential equality for all the hydration data, which for example triggers whereever your data is used as props of components or in the dependency array of `useEffect`s/`useMemo`s.
+
 ## Using Other Frameworks or Custom SSR Frameworks
 
 This guide is at-best, a high level overview of how SSR with React Query should work. Your mileage may vary since there are many different possible setups for SSR.

docs/src/pages/reference/useMutation.md

@@ -24,6 +24,8 @@ const {
   onMutate,
   onSettled,
   onSuccess,
+  retry,
+  retryDelay,
   useErrorBoundary,
   meta
 })
@@ -69,7 +71,8 @@ mutate(variables, {
   - This function will fire when the mutation is either successfully fetched or encounters an error and be passed either the data or error
   - If a promise is returned, it will be awaited and resolved before proceeding
 - `retry: boolean | number | (failureCount: number, error: TError) => boolean`
-  - If `false`, failed mutations will not retry by default.
+  - Defaults to `0`.
+  - If `false`, failed mutations will not retry.
   - If `true`, failed mutations will retry infinitely.
   - If set to an `number`, e.g. `3`, failed mutations will retry until the failed mutations count meets that number.
 - `retryDelay: number | (retryAttempt: number, error: TError) => number`

examples/load-more-infinite-scroll/pages/index.js

@@ -65,9 +65,9 @@ function Example() {
               onClick={() => fetchPreviousPage()}
               disabled={!hasPreviousPage || isFetchingPreviousPage}
             >
-              {isFetchingNextPage
+              {isFetchingPreviousPage
                 ? 'Loading more...'
-                : hasNextPage
+                : hasPreviousPage
                 ? 'Load Older'
                 : 'Nothing more to load'}
             </button>

examples/react-native/.eslintrc

@@ -0,0 +1,16 @@
+{
+  "root": true,
+  "extends": "@callstack",
+  "rules": {
+    "react-native/no-raw-text": 0,
+    "promise/prefer-await-to-then": 0
+  },
+  "settings": {
+    "import/resolver": {
+      "alias": {
+        "map": [["@app", "./src"]],
+        "extensions": [".ts", ".tsx", ".js", ".jsx", ".json"]
+      }
+    }
+  }
+}