Merge branch 'master' into create-slice-creators

Author: EskiMojo14

docs/api/combineSlices.mdx

@@ -86,17 +86,6 @@ However, typing will not be able to account for this. It's best to ensure that a
 
 :::
 
-:::warning
-
-Like [`combineReducers`](https://redux.js.org/api/combinereducers), `combineSlices` requires at least one reducer at initialisation.
-
-```ts no-transpile
-// will throw an error
-const rootReducer = combineSlices()
-```
-
-:::
-
 ## Return Value
 
 `combineSlices` returns a reducer function, with attached methods.

docs/rtk-query/usage/customizing-queries.mdx

@@ -369,7 +369,7 @@ const axiosBaseQuery =
   ): BaseQueryFn<
     {
       url: string
-      method: AxiosRequestConfig['method']
+      method?: AxiosRequestConfig['method']
       data?: AxiosRequestConfig['data']
       params?: AxiosRequestConfig['params']
       headers?: AxiosRequestConfig['headers']

packages/toolkit/src/combineSlices.ts

@@ -359,15 +359,15 @@ const original = (state: any) => {
   return state[ORIGINAL_STATE]
 }
 
-export function combineSlices<
-  Slices extends [
-    AnySliceLike | ReducerMap,
-    ...Array<AnySliceLike | ReducerMap>,
-  ],
->(...slices: Slices): CombinedSliceReducer<Id<InitialState<Slices>>> {
+const noopReducer: Reducer<Record<string, any>> = (state = {}) => state
+
+export function combineSlices<Slices extends Array<AnySliceLike | ReducerMap>>(
+  ...slices: Slices
+): CombinedSliceReducer<Id<InitialState<Slices>>> {
   const reducerMap = Object.fromEntries<Reducer>(getReducers(slices))
 
-  const getReducer = () => combineReducers(reducerMap)
+  const getReducer = () =>
+    Object.keys(reducerMap).length ? combineReducers(reducerMap) : noopReducer
 
   let reducer = getReducer()
 

packages/toolkit/src/query/core/buildInitiate.ts

@@ -301,7 +301,8 @@ You must add the middleware for RTK-Query to function correctly!`,
           forceRefetch,
           subscriptionOptions,
           [forceQueryFnSymbol]: forceQueryFn,
-        } = {},
+          ...rest
+        } = {}
       ) =>
       (dispatch, getState) => {
         const queryCacheKey = serializeQueryArgs({
@@ -311,6 +312,7 @@ You must add the middleware for RTK-Query to function correctly!`,
         })
 
         const thunk = queryThunk({
+          ...rest,
           type: 'query',
           subscribe,
           forceRefetch: forceRefetch,

packages/toolkit/src/query/core/buildThunks.ts

@@ -609,11 +609,12 @@ In the case of an unhandled error, no tags will be "provided" or "invalidated".`
       const force = hasTheForce(options) && options.force
       const maxAge = hasMaxAge(options) && options.ifOlderThan
 
-      const queryAction = (force: boolean = true) =>
-        (api.endpoints[endpointName] as ApiEndpointQuery<any, any>).initiate(
-          arg,
-          { forceRefetch: force },
-        )
+      const queryAction = (force: boolean = true) => {
+        const options = { forceRefetch: force, isPrefetch: true }
+        return (
+          api.endpoints[endpointName] as ApiEndpointQuery<any, any>
+        ).initiate(arg, options)
+      }
       const latestStateValue = (
         api.endpoints[endpointName] as ApiEndpointQuery<any, any>
       ).select(arg)(getState())

packages/toolkit/src/query/react/buildHooks.ts

@@ -98,6 +98,12 @@ export type UseQuery<D extends QueryDefinition<any, any, any, any>> = <
   options?: UseQuerySubscriptionOptions & UseQueryStateOptions<D, R>,
 ) => UseQueryHookResult<D, R>
 
+export type TypedUseQuery<
+  ResultType,
+  QueryArg,
+  BaseQuery extends BaseQueryFn,
+> = UseQuery<QueryDefinition<QueryArg, BaseQuery, string, ResultType, string>>
+
 export type UseQueryHookResult<
   D extends QueryDefinition<any, any, any, any>,
   R = UseQueryStateDefaultResult<D>,
@@ -182,6 +188,14 @@ export type UseQuerySubscription<
   options?: UseQuerySubscriptionOptions,
 ) => UseQuerySubscriptionResult<D>
 
+export type TypedUseQuerySubscription<
+  ResultType,
+  QueryArg,
+  BaseQuery extends BaseQueryFn,
+> = UseQuerySubscription<
+  QueryDefinition<QueryArg, BaseQuery, string, ResultType, string>
+>
+
 export type UseQuerySubscriptionResult<
   D extends QueryDefinition<any, any, any, any>,
 > = Pick<QueryActionCreatorResult<D>, 'refetch'>
@@ -231,6 +245,14 @@ export type UseLazyQuery<D extends QueryDefinition<any, any, any, any>> = <
   UseLazyQueryLastPromiseInfo<D>,
 ]
 
+export type TypedUseLazyQuery<
+  ResultType,
+  QueryArg,
+  BaseQuery extends BaseQueryFn,
+> = UseLazyQuery<
+  QueryDefinition<QueryArg, BaseQuery, string, ResultType, string>
+>
+
 export type LazyQueryTrigger<D extends QueryDefinition<any, any, any, any>> = {
   /**
    * Triggers a lazy query.
@@ -258,6 +280,14 @@ export type LazyQueryTrigger<D extends QueryDefinition<any, any, any, any>> = {
   ): QueryActionCreatorResult<D>
 }
 
+export type TypedLazyQueryTrigger<
+  ResultType,
+  QueryArg,
+  BaseQuery extends BaseQueryFn,
+> = LazyQueryTrigger<
+  QueryDefinition<QueryArg, BaseQuery, string, ResultType, string>
+>
+
 /**
  * A React hook similar to [`useQuerySubscription`](#usequerysubscription), but with manual control over when the data fetching occurs.
  *
@@ -275,6 +305,14 @@ export type UseLazyQuerySubscription<
   options?: SubscriptionOptions,
 ) => readonly [LazyQueryTrigger<D>, QueryArgFrom<D> | UninitializedValue]
 
+export type TypedUseLazyQuerySubscription<
+  ResultType,
+  QueryArg,
+  BaseQuery extends BaseQueryFn,
+> = UseLazyQuerySubscription<
+  QueryDefinition<QueryArg, BaseQuery, string, ResultType, string>
+>
+
 export type QueryStateSelector<
   R extends Record<string, any>,
   D extends QueryDefinition<any, any, any, any>,
@@ -297,6 +335,14 @@ export type UseQueryState<D extends QueryDefinition<any, any, any, any>> = <
   options?: UseQueryStateOptions<D, R>,
 ) => UseQueryStateResult<D, R>
 
+export type TypedUseQueryState<
+  ResultType,
+  QueryArg,
+  BaseQuery extends BaseQueryFn,
+> = UseQueryState<
+  QueryDefinition<QueryArg, BaseQuery, string, ResultType, string>
+>
+
 export type UseQueryStateOptions<
   D extends QueryDefinition<any, any, any, any>,
   R extends Record<string, any>,
@@ -514,6 +560,14 @@ export type UseMutation<D extends MutationDefinition<any, any, any, any>> = <
   options?: UseMutationStateOptions<D, R>,
 ) => readonly [MutationTrigger<D>, UseMutationStateResult<D, R>]
 
+export type TypedUseMutation<
+  ResultType,
+  QueryArg,
+  BaseQuery extends BaseQueryFn,
+> = UseMutation<
+  MutationDefinition<QueryArg, BaseQuery, string, ResultType, string>
+>
+
 export type MutationTrigger<D extends MutationDefinition<any, any, any, any>> =
   {
     /**
@@ -535,6 +589,14 @@ export type MutationTrigger<D extends MutationDefinition<any, any, any, any>> =
     (arg: QueryArgFrom<D>): MutationActionCreatorResult<D>
   }
 
+export type TypedUseMutationTrigger<
+  ResultType,
+  QueryArg,
+  BaseQuery extends BaseQueryFn,
+> = MutationTrigger<
+  MutationDefinition<QueryArg, BaseQuery, string, ResultType, string>
+>
+
 /**
  * Wrapper around `defaultQueryStateSelector` to be used in `useQuery`.
  * We want the initial render to already come back with

packages/toolkit/src/query/react/index.ts

@@ -18,5 +18,13 @@ export type {
   TypedUseQueryHookResult,
   TypedUseQueryStateResult,
   TypedUseQuerySubscriptionResult,
+  TypedLazyQueryTrigger,
+  TypedUseLazyQuery,
+  TypedUseMutation,
+  TypedUseMutationTrigger,
+  TypedUseQueryState,
+  TypedUseQuery,
+  TypedUseQuerySubscription,
+  TypedUseLazyQuerySubscription,
 } from './buildHooks'
 export { createApi, reactHooksModule, reactHooksModuleName }

packages/toolkit/src/query/tests/buildHooks.test-d.tsx

@@ -193,7 +193,7 @@ describe('type tests', () => {
     }
   })
 
-  test('selectFromResult (query) behaviors', () => {
+  test('top level named hooks', () => {
     interface Post {
       id: number
       name: string

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

@@ -1,7 +1,7 @@
-import { configureStore } from '@reduxjs/toolkit'
+import { configureStore, isAllOf } from '@reduxjs/toolkit'
 import { createApi } from '@reduxjs/toolkit/query/react'
 import { renderHook, waitFor } from '@testing-library/react'
-import { withProvider } from '../../tests/utils/helpers'
+import { actionsReducer, withProvider } from '../../tests/utils/helpers'
 import type { BaseQueryApi } from '../baseQueryTypes'
 
 test('handles a non-async baseQuery without error', async () => {
@@ -200,3 +200,52 @@ describe('re-triggering behavior on arg change', () => {
     }
   })
 })
+
+describe('prefetch', () => {
+  const baseQuery = () => ({ data: null })
+  const api = createApi({
+    baseQuery,
+    endpoints: (build) => ({
+      getUser: build.query<any, any>({
+        query: (obj) => obj,
+      }),
+    }),
+  })
+
+  const store = configureStore({
+    reducer: { [api.reducerPath]: api.reducer, ...actionsReducer },
+    middleware: (gDM) => gDM().concat(api.middleware),
+  })
+  it('should attach isPrefetch if prefetching', async () => {
+    store.dispatch(api.util.prefetch('getUser', 1, {}))
+
+    await Promise.all(store.dispatch(api.util.getRunningQueriesThunk()))
+
+    const isPrefetch = (
+      action: any,
+    ): action is { meta: { arg: { isPrefetch: true } } } =>
+      action?.meta?.arg?.isPrefetch
+
+    expect(store.getState().actions).toMatchSequence(
+      api.internalActions.middlewareRegistered.match,
+      isAllOf(api.endpoints.getUser.matchPending, isPrefetch),
+      isAllOf(api.endpoints.getUser.matchFulfilled, isPrefetch),
+    )
+
+    // compare against a regular initiate call
+    await store.dispatch(
+      api.endpoints.getUser.initiate(1, { forceRefetch: true }),
+    )
+
+    const isNotPrefetch = (action: any): action is unknown =>
+      !isPrefetch(action)
+
+    expect(store.getState().actions).toMatchSequence(
+      api.internalActions.middlewareRegistered.match,
+      isAllOf(api.endpoints.getUser.matchPending, isPrefetch),
+      isAllOf(api.endpoints.getUser.matchFulfilled, isPrefetch),
+      isAllOf(api.endpoints.getUser.matchPending, isNotPrefetch),
+      isAllOf(api.endpoints.getUser.matchFulfilled, isNotPrefetch),
+    )
+  })
+})

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

@@ -390,7 +390,7 @@ describe('custom axios baseQuery', () => {
     ): BaseQueryFn<
       {
         url: string
-        method: AxiosRequestConfig['method']
+        method?: AxiosRequestConfig['method']
         data?: AxiosRequestConfig['data']
       },
       unknown,