docs: Fix relative links

Author: lachlancollins

docs/framework/react/guides/caching.md

@@ -3,7 +3,7 @@ id: caching
 title: Caching Examples
 ---
 
-> Please thoroughly read the [Important Defaults](../guides/important-defaults) before reading this guide
+> Please thoroughly read the [Important Defaults](./guides/important-defaults) before reading this guide
 
 ## Basic Example
 
@@ -23,7 +23,7 @@ Let's assume we are using the default `cacheTime` of **5 minutes** and the defau
 - A second instance of `useQuery({ queryKey: ['todos'], queryFn: fetchTodos })` mounts elsewhere.
   - Since the cache already has data for the `['todos']` key from the first query, that data is immediately returned from the cache.
   - The new instance triggers a new network request using its query function.
-    - Note that regardless of whether both `fetchTodos` query functions are identical or not, both queries' [`status`](../reference/useQuery) are updated (including `isFetching`, `isLoading`, and other related values) because they have the same query key.
+    - Note that regardless of whether both `fetchTodos` query functions are identical or not, both queries' [`status`](./reference/useQuery) are updated (including `isFetching`, `isLoading`, and other related values) because they have the same query key.
   - When the request completes successfully, the cache's data under the `['todos']` key is updated with the new data, and both instances are updated with the new data.
 - Both instances of the `useQuery({ queryKey: ['todos'], queryFn: fetchTodos })` query are unmounted and no longer in use.
   - Since there are no more active instances of this query, a cache timeout is set using `cacheTime` to delete and garbage collect the query (defaults to **5 minutes**).

docs/framework/react/guides/important-defaults.md

@@ -15,7 +15,7 @@ Out of the box, TanStack Query is configured with **aggressive but sane** defaul
   - The network is reconnected
   - The query is optionally configured with a refetch interval
 
-If you see a refetch that you are not expecting, it is likely because you just focused the window and TanStack Query is doing a [`refetchOnWindowFocus`](../guides/window-focus-refetching). During development, this will probably be triggered more frequently, especially because focusing between the Browser DevTools and your app will also cause a fetch, so be aware of that.
+If you see a refetch that you are not expecting, it is likely because you just focused the window and TanStack Query is doing a [`refetchOnWindowFocus`](./guides/window-focus-refetching). During development, this will probably be triggered more frequently, especially because focusing between the Browser DevTools and your app will also cause a fetch, so be aware of that.
 
 > To change this functionality, you can use options like `refetchOnMount`, `refetchOnWindowFocus`, `refetchOnReconnect` and `refetchInterval`.
 
@@ -38,7 +38,7 @@ If you see a refetch that you are not expecting, it is likely because you just f
 
 Have a look at the following articles from our Community Resources for further explanations of the defaults:
 
-- [Practical React Query](../community/tkdodos-blog#1-practical-react-query)
-- [React Query as a State Manager](../community/tkdodos-blog#10-react-query-as-a-state-manager)
+- [Practical React Query](./community/tkdodos-blog#1-practical-react-query)
+- [React Query as a State Manager](./community/tkdodos-blog#10-react-query-as-a-state-manager)
 
 [//]: # 'Materials'

docs/framework/react/guides/infinite-queries.md

@@ -87,8 +87,8 @@ function Projects() {
           {isFetchingNextPage
             ? 'Loading more...'
             : hasNextPage
-            ? 'Load More'
-            : 'Nothing more to load'}
+              ? 'Load More'
+              : 'Nothing more to load'}
         </button>
       </div>
       <div>{isFetching && !isFetchingNextPage ? 'Fetching...' : null}</div>
@@ -110,9 +110,7 @@ To ensure a seamless querying process without conflicts, it's highly recommended
 [//]: # 'Example1'
 
 ```jsx
-<List
-  onEndReached={() => !isFetching && fetchNextPage()}
-/>
+<List onEndReached={() => !isFetching && fetchNextPage()} />
 ```
 
 [//]: # 'Example1'
@@ -140,7 +138,7 @@ refetch({ refetchPage: (page, index) => index === 0 })
 
 [//]: # 'Example2'
 
-You can also pass this function as part of the 2nd argument (`queryFilters`) to [queryClient.refetchQueries](../reference/QueryClient#queryclientrefetchqueries), [queryClient.invalidateQueries](../reference/QueryClient#queryclientinvalidatequeries) or [queryClient.resetQueries](../reference/QueryClient#queryclientresetqueries).
+You can also pass this function as part of the 2nd argument (`queryFilters`) to [queryClient.refetchQueries](./reference/QueryClient#queryclientrefetchqueries), [queryClient.invalidateQueries](./reference/QueryClient#queryclientinvalidatequeries) or [queryClient.resetQueries](./reference/QueryClient#queryclientresetqueries).
 
 **Signature**
 
@@ -254,8 +252,8 @@ queryClient.setQueryData(['projects'], (data) => ({
 
 ```tsx
 queryClient.setQueryData(['projects'], (data) => ({
-  pages: data.pages.slice(0,1),
-  pageParams: data.pageParams.slice(0,1),
+  pages: data.pages.slice(0, 1),
+  pageParams: data.pageParams.slice(0, 1),
 }))
 ```
 

docs/framework/react/guides/initial-query-data.md

@@ -8,8 +8,8 @@ There are many ways to supply initial data for a query to the cache before you n
 - Declaratively:
   - Provide `initialData` to a query to prepopulate its cache if empty
 - Imperatively:
-  - [Prefetch the data using `queryClient.prefetchQuery`](../guides/prefetching)
-  - [Manually place the data into the cache using `queryClient.setQueryData`](../guides/prefetching)
+  - [Prefetch the data using `queryClient.prefetchQuery`](./guides/prefetching)
+  - [Manually place the data into the cache using `queryClient.setQueryData`](./guides/prefetching)
 
 ## Using `initialData` to prepopulate a query
 
@@ -170,6 +170,6 @@ const result = useQuery({
 
 ## Further reading
 
-For a comparison between `Initial Data` and `Placeholder Data`, have a look at the [Community Resources](../community/tkdodos-blog#9-placeholder-and-initial-data-in-react-query).
+For a comparison between `Initial Data` and `Placeholder Data`, have a look at the [Community Resources](./community/tkdodos-blog#9-placeholder-and-initial-data-in-react-query).
 
 [//]: # 'Materials'

docs/framework/react/guides/invalidations-from-mutations.md

@@ -36,4 +36,4 @@ const mutation = useMutation({
 
 [//]: # 'Example2'
 
-You can wire up your invalidations to happen using any of the callbacks available in the [`useMutation` hook](../guides/mutations)
+You can wire up your invalidations to happen using any of the callbacks available in the [`useMutation` hook](./guides/mutations)

docs/framework/react/guides/migrating-to-react-query-3.md

@@ -103,8 +103,8 @@ try {
 
 Together, these provide the same experience as before, but with added control to choose which component trees you want to reset. For more information, see:
 
-- [QueryErrorResetBoundary](../reference/QueryErrorResetBoundary)
-- [useQueryErrorResetBoundary](../reference/useQueryErrorResetBoundary)
+- [QueryErrorResetBoundary](./reference/QueryErrorResetBoundary)
+- [useQueryErrorResetBoundary](./reference/useQueryErrorResetBoundary)
 
 ### `QueryCache.getQuery()` has been replaced by `QueryCache.find()`.
 
@@ -137,7 +137,7 @@ useQuery(['post', id], () => fetchPost(id))
 If you still insist on not using inline functions, you can use the newly passed `QueryFunctionContext`:
 
 ```tsx
-useQuery(['post', id], context => fetchPost(context.queryKey[1]))
+useQuery(['post', id], (context) => fetchPost(context.queryKey[1]))
 ```
 
 ### Infinite Query Page params are now passed via `QueryFunctionContext.pageParam`
@@ -183,18 +183,14 @@ The `useInfiniteQuery()` interface has changed to fully support bi-directional i
 One direction:
 
 ```tsx
-const {
-  data,
-  fetchNextPage,
-  hasNextPage,
-  isFetchingNextPage,
-} = useInfiniteQuery(
-  'projects',
-  ({ pageParam = 0 }) => fetchProjects(pageParam),
-  {
-    getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
-  }
-)
+const { data, fetchNextPage, hasNextPage, isFetchingNextPage } =
+  useInfiniteQuery(
+    'projects',
+    ({ pageParam = 0 }) => fetchProjects(pageParam),
+    {
+      getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
+    },
+  )
 ```
 
 Both directions:
@@ -214,37 +210,33 @@ const {
   {
     getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
     getPreviousPageParam: (firstPage, pages) => firstPage.prevCursor,
-  }
+  },
 )
 ```
 
 One direction reversed:
 
 ```tsx
-const {
-  data,
-  fetchNextPage,
-  hasNextPage,
-  isFetchingNextPage,
-} = useInfiniteQuery(
-  'projects',
-  ({ pageParam = 0 }) => fetchProjects(pageParam),
-  {
-    select: data => ({
-      pages: [...data.pages].reverse(),
-      pageParams: [...data.pageParams].reverse(),
-    }),
-    getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
-  }
-)
+const { data, fetchNextPage, hasNextPage, isFetchingNextPage } =
+  useInfiniteQuery(
+    'projects',
+    ({ pageParam = 0 }) => fetchProjects(pageParam),
+    {
+      select: (data) => ({
+        pages: [...data.pages].reverse(),
+        pageParams: [...data.pageParams].reverse(),
+      }),
+      getNextPageParam: (lastPage, pages) => lastPage.nextCursor,
+    },
+  )
 ```
 
 ### Infinite Query data now contains the array of pages and pageParams used to fetch those pages.
 
 This allows for easier manipulation of the data and the page params, like, for example, removing the first page of data along with it's params:
 
 ```tsx
-queryClient.setQueryData(['projects'], data => ({
+queryClient.setQueryData(['projects'], (data) => ({
   pages: data.pages.slice(1),
   pageParams: data.pageParams.slice(1),
 }))
@@ -277,10 +269,10 @@ The `mutate` function can be used when using callbacks:
 const { mutate } = useMutation({ mutationFn: addTodo })
 
 mutate('todo', {
-  onSuccess: data => {
+  onSuccess: (data) => {
     console.log(data)
   },
-  onError: error => {
+  onError: (error) => {
     console.error(error)
   },
   onSettled: () => {
@@ -393,7 +385,7 @@ import { setLogger } from 'react-query'
 
 // Log with Sentry
 setLogger({
-  error: error => {
+  error: (error) => {
     Sentry.captureException(error)
   },
 })
@@ -418,13 +410,14 @@ setConsole({
 
 In version 3 **this is done automatically when React Query is used in React Native**.
 
-
 ### Typescript
+
 #### `QueryStatus` has been changed from an [enum](https://www.typescriptlang.org/docs/handbook/enums.html#string-enums) to a [union type](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#union-types)
 
 So, if you were checking the status property of a query or mutation against a QueryStatus enum property you will have to check it now against the string literal the enum previously held for each property.
 
 Therefore you have to change the enum properties to their equivalent string literal, like this:
+
 - `QueryStatus.Idle` -> `'idle'`
 - `QueryStatus.Loading` -> `'loading'`
 - `QueryStatus.Error` -> `'error'`
@@ -460,7 +453,7 @@ import { useQuery } from 'react-query'
 
 function User() {
   const { data } = useQuery(['user'], fetchUser, {
-    select: user => user.username,
+    select: (user) => user.username,
   })
   return <div>Username: {data}</div>
 }
@@ -512,7 +505,7 @@ A `QueryObserver` can be used to create and/or watch a query:
 ```tsx
 const observer = new QueryObserver(queryClient, { queryKey: 'posts' })
 
-const unsubscribe = observer.subscribe(result => {
+const unsubscribe = observer.subscribe((result) => {
   console.log(result)
   unsubscribe()
 })
@@ -530,7 +523,7 @@ const observer = new InfiniteQueryObserver(queryClient, {
   getPreviousPageParam: (firstPage, allPages) => firstPage.prevCursor,
 })
 
-const unsubscribe = observer.subscribe(result => {
+const unsubscribe = observer.subscribe((result) => {
   console.log(result)
   unsubscribe()
 })
@@ -546,7 +539,7 @@ const observer = new QueriesObserver(queryClient, [
   { queryKey: ['post', 2], queryFn: fetchPost },
 ])
 
-const unsubscribe = observer.subscribe(result => {
+const unsubscribe = observer.subscribe((result) => {
   console.log(result)
   unsubscribe()
 })