createAction doesn't support a `meta` attribute

[jmccarrell-lmi]

And as far as I can tell there is no way to possibly insert it.

not a big deal, any action that has meta attributes, you can just manually create.

If I were to make a proposal, it would be that it would be a second argument.

[markerikson]

Yep, and it doesn't support customizing payload either, other than passing it in directly. This is something I'd like to handle in some way before calling this 1.0. See #82 .

[markerikson]

The two main questions are how createAction() should accept callbacks for payload and meta customization, and how createSlice() should accept them.

The obvious inspirations here would be:

https://redux-actions.js.org/api/createaction#createactiontype-payloadcreator-metacreator

https://github.com/ericelliott/autodux#action-creators

Based on that, I'm thinking roughly:

type PayloadCreator = (...args) => Payload;
type MetaCreator = (...args) => Meta;

createAction(
    type : String,
    payloadCreator? : PayloadCreator ,
    metaCreator? : MetaCreator ,
)

createSlice(
    reducers: {
        simpleReducer: ReducerFunction,
        complexReducer: {
             payload? : PayloadCreator ,
             meta? : MetaCreator ,
             reducer : ReducerFunction
        } 
    }
)

Actual TS types to be figured out, of course, but you get the idea.

[phryneas]

I'm just exploring options right now. Would something like

type PrepareAction<OriginalPayload, Payload, Meta> = (originalPayload: OriginalPayload) => {payload: Payload; meta? : Meta}

createAction(
    type : String,
    prepare?: PrepareAction,
)

createSlice(
    reducers: {
        simpleReducer: ReducerFunction,
        complexReducer: {
             prepareAction: PrepareAction,
             reducer : ReducerFunction
        } 
    }
)

also be acceptable? That could be way easier to type.

[TidyIQ]

How do we currently workaround the inability to customise the payload with arguments? This seems like an extremely crucial missing feature. Almost every reducer I have needs the payload to be adjusted based on the function parameters.

For example, a reducer that opens an error message snackbar and displays a message. The message can't be hardcoded into the action creator as obviously the error message changes based on what the actual error is.

Or a very common case - saving form input values to state.

[markerikson]

@TidyIQ : yes, I'm well aware of this issue :) There's an open PR (#149 ) to try to implement that capability, but we're trying to figure out what the best API would look like.

[markerikson]

Fixed by #149 and out as 0.6.3 . Please let me know if that works for you!

[jonatanpineda]

I've seen how "prepare" works but i'm trying to add parameters to "meta" without having to use "payload", i'm doing this to make it work:

const teamsSlice = createSlice({
  slice: 'teams',
  initialState,
  reducers: {
    loadTeams: {
      reducer: (state: TeamsState) => {
         state.loading = true
      },
      prepare: (payload?: any) => ({
        payload,
        meta: {
          request: {
            endpoint: '/teams'
          }
        }
      })
    }
  }
});

I want to create that action:

{
  type: 'teams/loadTeams',
  meta: {
    request: {
      endpoint: '/teams'
    }
  }
}

It's possible to do this in createSlice() without having to use payload?.

[markerikson]

@jonatanpineda : not quite sure what you're asking here.

You don't have to declare any arguments for the prepare callback, and you don't have to return a payload field if you don't want to. However, for whatever object you return, only the payload and meta fields will be included in the final action object.

[jonatanpineda]

@markerikson I'm just looking to create an action with the meta property using createSlice() style, i guess is like that:

but an error is generated:

so when i add the payload argument all works:

but the final object that i want to create doesn't have payload, i only want to produce this:

{
  type: 'teams/loadTeams',
  meta: {
    request: {
      endpoint: '/teams'
    }
  }
}

how to achieve this correctly?

[markerikson]

It may be because you're not declaring a type for the action object in the reducer. Then again, it might be that we need to improve our TS types somehow.

[jonatanpineda]

I'm sorry I didn't show all the error:

Type '{ reducer: (state: TeamsState) => void; prepare: () => { meta: { request: { endpoint: string; }; }; }; }' is not assignable to type 'CaseReducer<TeamsState, any> | EnhancedCaseReducer<TeamsState, any>'.
Type '{ reducer: (state: TeamsState) => void; prepare: () => { meta: { request: { endpoint: string; }; }; }; }' is not assignable to type 'EnhancedCaseReducer<TeamsState, any>'.
Types of property 'prepare' are incompatible.
Type '() => { meta: { request: { endpoint: string; }; }; }' is not assignable to type 'PrepareAction'.
Type '() => { meta: { request: { endpoint: string; }; }; }' is not assignable to type '(...args: any[]) => { payload: any; }'.
Property 'payload' is missing in type '{ meta: { request: { endpoint: string; }; }; }' but required in type '{ payload: any; }'.ts(2322)
createAction.d.ts(16, 5): 'payload' is declared here.

I typed the action with 'AnyAction' in the reducer and the error persists:

Probably the project needs to enable that feature, I think it's necessary because of the simplicity of createSlice() we can reduce a lot of redux-typescript stuff and mixed with the ability to add meta properties to use middleware's like redux-offline, it would be such a huge improvement.

[markerikson]

Okay, I just added #176 to track this.