Expected 0 arguments, but got 1. with Redux toolkit - redux

Question

I am currently trying to build a simple example of redux using redux/toolkit. I am not sure what I am doing wrong.
This is my store.
import { configureStore } from "#reduxjs/toolkit";
import reducer from "./workouts";
export default function () {
return configureStore({ reducer });
}
Here is my workouts.ts file
import { createAction } from '#reduxjs/toolkit'
export interface IWorkout {
id: number
restTime: number
workoutTime: number
exercises: number[]
numReps: number
}
export interface IState {
workouts: IWorkout[]
}
export interface IAction {
type: string
payload: IWorkout[] | any
}
export const workoutAdded = createAction('workoutAdded')
export const workoutDeleted = createAction('workoutDeleted')
const defaultState: IState = {
workouts: [],
}
let lastId = 0
const reducer = (state: IState = defaultState, action: IAction): IState => {
switch (action.type) {
case workoutAdded.type:
return {
...state,
workouts: [
...state.workouts,
{
id: ++lastId,
restTime: action.payload.restTime,
workoutTime: action.payload.workoutTime,
exercises: action.payload.exercises,
numReps: action.payload.numReps,
},
],
}
case workoutDeleted.type:
return {
...state,
workouts: state.workouts.filter((workout) => workout.id !== action.payload.id),
}
default:
return state
}
}
export default reducer
And here is my index.ts file
import { render } from "react-dom";
import configureStore from "./store/store";
import { workoutAdded } from "./store/workouts";
import App from "./App";
const store = configureStore();
const newWorkout = {
restTime: 10,
workoutTime: 30,
exercises: [1, 2, 3],
NumReps: 6
};
store.dispatch(workoutAdded(newWorkout));
const rootElement = document.getElementById("root");
render(<App />, rootElement);
My error appears in index.ts file in this line:
store.dispatch(workoutAdded(newWorkout));
Not sure what I am missing. I reproduced the error in this sandbox
This is the error that I am getting in the console:

Answer 1

workoutAdded has 0 arguments, if you want to add arguments, you can implement Action
export class workoutAdded implements Action {
readonly type = "workoutAdded"
constructor(public payload: Workout){}
}

Answer 2

This fixed the issue. createAction can receive as a second argument a callback function that returns an object with the payload.
export const workoutAdded = createAction("workoutAdded", (workout) =>{
return { payload: workout };
});