Hopefully fix type definitions for empty thunk action params

- Made `ActionParams = void`, which allows not declaring any args
in the payload creation function without TS complaining
- Found out I can switch the args order back so it's `(args, other)`

Author: markerikson

src/createAsyncThunk.test.ts

@@ -1,4 +1,5 @@
 import { createAsyncThunk } from './createAsyncThunk'
+import { configureStore } from './configureStore'
 
 describe('createAsyncThunk', () => {
   it('creates the action types', () => {
@@ -10,6 +11,27 @@ describe('createAsyncThunk', () => {
     expect(thunkActionCreator.rejected.type).toBe('testType/rejected')
   })
 
+  it('works without passing arguments to the payload creator', async () => {
+    const thunkActionCreator = createAsyncThunk('testType', async () => 42)
+
+    let timesReducerCalled = 0
+
+    const reducer = () => {
+      timesReducerCalled++
+    }
+
+    const store = configureStore({
+      reducer
+    })
+
+    // reset from however many times the store called it
+    timesReducerCalled = 0
+
+    await store.dispatch(thunkActionCreator())
+
+    expect(timesReducerCalled).toBe(3)
+  })
+
   it('accepts arguments and dispatches the actions on resolve', async () => {
     const dispatch = jest.fn()
 
@@ -36,17 +58,17 @@ describe('createAsyncThunk', () => {
 
     expect(dispatch).toHaveBeenNthCalledWith(
       1,
-      thunkActionCreator.pending(args, generatedRequestId)
+      thunkActionCreator.pending(generatedRequestId, args)
     )
 
     expect(dispatch).toHaveBeenNthCalledWith(
       2,
-      thunkActionCreator.fulfilled(result, args, generatedRequestId)
+      thunkActionCreator.fulfilled(result, generatedRequestId, args)
     )
 
     expect(dispatch).toHaveBeenNthCalledWith(
       3,
-      thunkActionCreator.finished(args, generatedRequestId)
+      thunkActionCreator.finished(generatedRequestId, args)
     )
   })
 
@@ -72,17 +94,17 @@ describe('createAsyncThunk', () => {
 
     expect(dispatch).toHaveBeenNthCalledWith(
       1,
-      thunkActionCreator.pending(args, generatedRequestId)
+      thunkActionCreator.pending(generatedRequestId, args)
     )
 
     expect(dispatch).toHaveBeenNthCalledWith(
       2,
-      thunkActionCreator.rejected(error, args, generatedRequestId)
+      thunkActionCreator.rejected(error, generatedRequestId, args)
     )
 
     expect(dispatch).toHaveBeenNthCalledWith(
       3,
-      thunkActionCreator.finished(args, generatedRequestId)
+      thunkActionCreator.finished(generatedRequestId, args)
     )
   })
 })

src/createAsyncThunk.ts

@@ -19,7 +19,7 @@ type AsyncThunksArgs<S, E, D extends Dispatch = Dispatch> = {
 export function createAsyncThunk<
   ActionType extends string,
   Returned,
-  ActionParams = never,
+  ActionParams = void,
   TA extends AsyncThunksArgs<any, any, any> = AsyncThunksArgs<
     unknown,
     unknown,
@@ -34,7 +34,7 @@ export function createAsyncThunk<
 ) {
   const fulfilled = createAction(
     type + '/fulfilled',
-    (result: Returned, args: ActionParams, requestId: string) => {
+    (result: Returned, requestId: string, args: ActionParams) => {
       return {
         payload: result,
         meta: { args, requestId }
@@ -44,7 +44,7 @@ export function createAsyncThunk<
 
   const pending = createAction(
     type + '/pending',
-    (args: ActionParams, requestId: string) => {
+    (requestId: string, args: ActionParams) => {
       return {
         payload: undefined,
         meta: { args, requestId }
@@ -54,7 +54,7 @@ export function createAsyncThunk<
 
   const finished = createAction(
     type + '/finished',
-    (args: ActionParams, requestId: string) => {
+    (requestId: string, args: ActionParams) => {
       return {
         payload: undefined,
         meta: { args, requestId }
@@ -64,7 +64,7 @@ export function createAsyncThunk<
 
   const rejected = createAction(
     type + '/rejected',
-    (error: Error, args: ActionParams, requestId: string) => {
+    (error: Error, requestId: string, args: ActionParams) => {
       return {
         payload: undefined,
         error,
@@ -82,7 +82,7 @@ export function createAsyncThunk<
       const requestId = nanoid()
 
       try {
-        dispatch(pending(args, requestId))
+        dispatch(pending(requestId, args))
         // TODO Also ugly types
         const result = (await payloadCreator(args, {
           dispatch,
@@ -92,13 +92,13 @@ export function createAsyncThunk<
         } as TA)) as Returned
 
         // TODO How do we avoid errors in here from hitting the catch clause?
-        return dispatch(fulfilled(result, args, requestId))
+        return dispatch(fulfilled(result, requestId, args))
       } catch (err) {
         // TODO Errors aren't serializable
-        dispatch(rejected(err, args, requestId))
+        dispatch(rejected(err, requestId, args))
       } finally {
         // TODO IS there really a benefit from a "finished" action?
-        dispatch(finished(args, requestId))
+        dispatch(finished(requestId, args))
       }
     }
   }