Merge pull request #4667 from reduxjs/CAT-wrapper

Add a type for `createAsyncThunk` without the `withTypes` method
reduxjs · Nov 23, 2024 · dd8f986 · dd8f986
2 parents fe2d181 + f7d6ad9
commit dd8f986
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 6 deletions.
diff --git a/packages/toolkit/src/createAsyncThunk.ts b/packages/toolkit/src/createAsyncThunk.ts
@@ -437,7 +437,9 @@ export type OverrideThunkApiConfigs<OldConfig, NewConfig> = Id<
   NewConfig & Omit<OldConfig, keyof NewConfig>
 >
 
-type CreateAsyncThunk<CurriedThunkApiConfig extends AsyncThunkConfig> = {
+export type CreateAsyncThunkFunction<
+  CurriedThunkApiConfig extends AsyncThunkConfig,
+> = {
   /**
    *
    * @param typePrefix
@@ -481,12 +483,15 @@ type CreateAsyncThunk<CurriedThunkApiConfig extends AsyncThunkConfig> = {
     ThunkArg,
     OverrideThunkApiConfigs<CurriedThunkApiConfig, ThunkApiConfig>
   >
-
-  withTypes<ThunkApiConfig extends AsyncThunkConfig>(): CreateAsyncThunk<
-    OverrideThunkApiConfigs<CurriedThunkApiConfig, ThunkApiConfig>
-  >
 }
 
+type CreateAsyncThunk<CurriedThunkApiConfig extends AsyncThunkConfig> =
+  CreateAsyncThunkFunction<CurriedThunkApiConfig> & {
+    withTypes<ThunkApiConfig extends AsyncThunkConfig>(): CreateAsyncThunk<
+      OverrideThunkApiConfigs<CurriedThunkApiConfig, ThunkApiConfig>
+    >
+  }
+
 export const createAsyncThunk = /* @__PURE__ */ (() => {
   function createAsyncThunk<
     Returned,

diff --git a/packages/toolkit/src/index.ts b/packages/toolkit/src/index.ts
@@ -133,6 +133,7 @@ export type {
   GetState,
   GetThunkAPI,
   SerializedError,
+  CreateAsyncThunkFunction,
 } from './createAsyncThunk'
 
 export {

diff --git a/packages/toolkit/src/tests/createAsyncThunk.test.ts b/packages/toolkit/src/tests/createAsyncThunk.test.ts
@@ -1,4 +1,4 @@
-import type { UnknownAction } from '@reduxjs/toolkit'
+import type { CreateAsyncThunkFunction, UnknownAction } from '@reduxjs/toolkit'
 import {
   configureStore,
   createAsyncThunk,
@@ -990,4 +990,25 @@ describe('meta', () => {
     expect(thunk.settled).toEqual(expectFunction)
     expect(thunk.fulfilled.type).toBe('a/fulfilled')
   })
+  test('createAsyncThunkWrapper using CreateAsyncThunkFunction', async () => {
+    const customSerializeError = () => 'serialized!'
+    const createAppAsyncThunk: CreateAsyncThunkFunction<{
+      serializedErrorType: ReturnType<typeof customSerializeError>
+    }> = (prefix: string, payloadCreator: any, options: any) =>
+      createAsyncThunk(prefix, payloadCreator, {
+        ...options,
+        serializeError: customSerializeError,
+      }) as any
+
+    const asyncThunk = createAppAsyncThunk('test', async () => {
+      throw new Error('Panic!')
+    })
+
+    const promise = store.dispatch(asyncThunk())
+    const result = await promise
+    if (!asyncThunk.rejected.match(result)) {
+      throw new Error('should have thrown')
+    }
+    expect(result.error).toEqual('serialized!')
+  })
 })