Skip to content

Commit 9d43ea0

Browse files
committed
Address feedback
1 parent 9f3a8b9 commit 9d43ea0

File tree

3 files changed

+18
-63
lines changed

3 files changed

+18
-63
lines changed

docs/rtk-query/api/fetchBaseQuery.mdx

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -64,8 +64,7 @@ type FetchBaseQueryArgs = {
6464
api: Pick<
6565
BaseQueryApi,
6666
'getState' | 'extra' | 'endpoint' | 'type' | 'forced'
67-
>,
68-
args: string | FetchArgs
67+
> & { args: string | FetchArgs },
6968
) => MaybePromise<Headers | void>
7069
fetchFn?: (
7170
input: RequestInfo,
@@ -106,7 +105,7 @@ Typically a string like `https://api.your-really-great-app.com/v1/`. If you don'
106105

107106
_(optional)_
108107

109-
Allows you to inject headers on every request. You can specify headers at the endpoint level, but you'll typically want to set common headers like `authorization` here. As a convenience mechanism, the second argument allows you to use `getState` to access your redux store in the event you store information you'll need there such as an auth token. Additionally, it provides access to `extra`, `endpoint`, `type`, and `forced` to unlock more granular conditional behaviors. Arguments passed to the query function is passed as the third argument in case you need those params in the context of the `prepareHeaders` function.
108+
Allows you to inject headers on every request. You can specify headers at the endpoint level, but you'll typically want to set common headers like `authorization` here. As a convenience mechanism, the second argument allows you to use `getState` to access your redux store in the event you store information you'll need there such as an auth token. Additionally, it provides access to `args`, `extra`, `endpoint`, `type`, and `forced` to unlock more granular conditional behaviors.
110109

111110
You can mutate the `headers` argument directly, and returning it is optional.
112111

@@ -115,12 +114,12 @@ type prepareHeaders = (
115114
headers: Headers,
116115
api: {
117116
getState: () => unknown
117+
args: string | FetchArgs
118118
extra: unknown
119119
endpoint: string
120120
type: 'query' | 'mutation'
121121
forced: boolean | undefined
122122
},
123-
args: string | FetchArgs
124123
) => Headers | void
125124
```
126125

@@ -305,8 +304,8 @@ The default response handler is `"json"`, which is equivalent to the following f
305304

306305
```ts title="Default responseHandler"
307306
const defaultResponseHandler = async (res: Response) => {
308-
const text = await res.text();
309-
return text.length ? JSON.parse(text) : null;
307+
const text = await res.text()
308+
return text.length ? JSON.parse(text) : null
310309
}
311310
```
312311

packages/toolkit/src/query/fetchBaseQuery.ts

Lines changed: 9 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -112,8 +112,7 @@ export type FetchBaseQueryArgs = {
112112
api: Pick<
113113
BaseQueryApi,
114114
'getState' | 'extra' | 'endpoint' | 'type' | 'forced'
115-
>,
116-
args: string | FetchArgs,
115+
> & { args: string | FetchArgs },
117116
) => MaybePromise<Headers | void>
118117
fetchFn?: (
119118
input: RequestInfo,
@@ -165,7 +164,7 @@ export type FetchBaseQueryMeta = { request: Request; response?: Response }
165164
* The base URL for an API service.
166165
* Typically in the format of https://example.com/
167166
*
168-
* @param {(headers: Headers, api: { getState: () => unknown; extra: unknown; endpoint: string; type: 'query' | 'mutation'; forced: boolean; }, args: string | FetchArgs) => Headers} prepareHeaders
167+
* @param {(headers: Headers, api: { getState: () => unknown; args: string | FetchArgs; extra: unknown; endpoint: string; type: 'query' | 'mutation'; forced: boolean; }) => Headers} prepareHeaders
169168
* An optional function that can be used to inject headers on requests.
170169
* Provides a Headers object, most of the `BaseQueryApi` (`dispatch` is not available), and the args passed into the query function.
171170
* Useful for setting authentication or headers that need to be set conditionally.
@@ -242,17 +241,14 @@ export function fetchBaseQuery({
242241

243242
headers = new Headers(stripUndefined(headers))
244243
config.headers =
245-
(await prepareHeaders(
246-
headers,
247-
{
248-
getState,
249-
extra,
250-
endpoint,
251-
forced,
252-
type,
253-
},
244+
(await prepareHeaders(headers, {
245+
getState,
254246
args,
255-
)) || headers
247+
extra,
248+
endpoint,
249+
forced,
250+
type,
251+
})) || headers
256252

257253
// Only set the content-type to json if appropriate. Will not be true for FormData, ArrayBuffer, Blob, etc.
258254
const isJsonifiable = (body: any) =>

packages/toolkit/src/query/tests/fetchBaseQuery.test.tsx

Lines changed: 4 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -799,16 +799,17 @@ describe('fetchBaseQuery', () => {
799799
})
800800

801801
test('prepareHeaders provides extra api information for getState, extra, endpoint, type and forced', async () => {
802-
let _getState, _extra, _endpoint, _type, _forced
802+
let _getState, _args, _extra, _endpoint, _type, _forced
803803

804804
const baseQuery = fetchBaseQuery({
805805
baseUrl,
806806
fetchFn: fetchFn as any,
807807
prepareHeaders: (
808808
headers,
809-
{ getState, extra, endpoint, type, forced },
809+
{ getState, args, extra, endpoint, type, forced },
810810
) => {
811811
_getState = getState
812+
_args = args
812813
_endpoint = endpoint
813814
_type = type
814815
_forced = forced
@@ -845,53 +846,12 @@ describe('fetchBaseQuery', () => {
845846
await doRequest()
846847

847848
expect(_getState).toBeDefined()
849+
expect(_args!.url).toBe('/echo')
848850
expect(_endpoint).toBe('someEndpointName')
849851
expect(_type).toBe('query')
850852
expect(_forced).toBe(true)
851853
expect(_extra).toBe(fakeAuth0Client)
852854
})
853-
854-
test('prepareHeaders provides args', async () => {
855-
let _args: any
856-
857-
const baseQuery = fetchBaseQuery({
858-
baseUrl,
859-
fetchFn: fetchFn as any,
860-
prepareHeaders: (headers, _api, args) => {
861-
_args = args
862-
863-
return headers
864-
},
865-
})
866-
867-
const fakeAuth0Client = {
868-
getTokenSilently: async () => 'fakeToken',
869-
}
870-
871-
const doRequest = async () => {
872-
const abortController = new AbortController()
873-
return baseQuery(
874-
{ url: '/echo' },
875-
{
876-
signal: abortController.signal,
877-
abort: (reason) =>
878-
// @ts-ignore
879-
abortController.abort(reason),
880-
dispatch: storeRef.store.dispatch,
881-
getState: storeRef.store.getState,
882-
extra: fakeAuth0Client,
883-
type: 'query',
884-
forced: true,
885-
endpoint: 'someEndpointName',
886-
},
887-
{},
888-
)
889-
}
890-
891-
await doRequest()
892-
893-
expect(_args!.url).toBe('/echo')
894-
})
895855
})
896856

897857
test('can pass `headers` into `fetchBaseQuery`', async () => {

0 commit comments

Comments
 (0)