Docs - RTK: add Usage with Typescript page

reduxjs · May 25, 2021 · 3bc4d57 · 3bc4d57
1 parent b832b3a
commit 3bc4d57
Show file tree

Hide file tree

Showing 4 changed files with 499 additions and 53 deletions.
diff --git a/docs/rtk-query/api/created-api/hooks.mdx b/docs/rtk-query/api/created-api/hooks.mdx
@@ -293,6 +293,8 @@ type UseQueryResult<T> = {
 
 [summary](docblock://query/core/buildSelectors.ts?token=skipToken)
 
+See also [Skipping queries with TypeScript using `skipToken`](../usage/usage-with-typescript.mdx#skipping-queries-with-typescript-using-skiptoken)
+
 ## `useMutation`
 
 #### Signature

diff --git a/docs/rtk-query/usage/customizing-queries.mdx b/docs/rtk-query/usage/customizing-queries.mdx
@@ -59,10 +59,6 @@ const customBaseQuery = (
 }
 ```
 
-<!-- TODO: move this to a 'usage with typescript' page instead (and cover in more detail)-->
-
-The type for `data` is dictated based on the types specified per endpoint (both queries & mutations), while the type for `error` is dictated by the `baseQuery` function used.
-
 :::note
 This format is required so that RTK Query can infer the return types for your responses.
 :::
@@ -450,6 +446,8 @@ In such a scenario, the return value would look like so:
     return { error: YourError, meta: YourMeta }
     ```
 
+<!-- TODO: re-write below with a more realistic example -->
+
 ```ts title="baseQuery example with meta information"
 // file: idGenerator.ts noEmit
 export declare const uuid: () => string
@@ -771,52 +769,3 @@ const api = createApi({
   }),
 })
 ```
-
-### Excluding baseQuery for all endpoints
-
-<!-- TODO: move this to a 'usage with typescript' page instead-->
-
-For typescript users, the error type that `queryFn` must return is dictated by the provided `baseQuery` function. For users who wish to _only_ use `queryFn` for each endpoint and not include a `baseQuery` at all, RTK Query provides a `fakeBaseQuery` function that can be used to easily specify the error type each `queryFn` should return.
-
-```ts title="Excluding baseQuery for all endpoints"
-import { createApi, fakeBaseQuery } from '@reduxjs/toolkit/query'
-
-type CustomErrorType = { type: 'too cold' | 'too hot' }
-
-const api = createApi({
-  // highlight-start
-  baseQuery: fakeBaseQuery<CustomErrorType>(),
-  // highlight-end
-  endpoints: (build) => ({
-    eatPorridge: build.query<'just right', 1 | 2 | 3>({
-      // highlight-start
-      queryFn(seat) {
-        if (seat === 1) {
-          return { error: { type: 'too cold' } }
-        }
-
-        if (seat === 2) {
-          return { error: { type: 'too hot' } }
-        }
-
-        return { data: 'just right' }
-      },
-      // highlight-end
-    }),
-    microwaveHotPocket: build.query<'delicious!', number>({
-      // highlight-start
-      queryFn(duration) {
-        if (duration < 110) {
-          return { error: { type: 'too cold' } }
-        }
-        if (duration > 140) {
-          return { error: { type: 'too hot' } }
-        }
-
-        return { data: 'delicious!' }
-      },
-      // highlight-end
-    }),
-  }),
-})
-```