New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Question] When using aliases needs to be a object? #84

Closed
jdinartejesus opened this Issue Jun 8, 2017 · 3 comments

Comments

Projects
None yet
2 participants
@jdinartejesus

jdinartejesus commented Jun 8, 2017

I need to use a function in aliases since I'm integrating w/ Firebase and I needed to add new task to Firebase before update the state. But since all the actions need to be an object I can or it's this wrong?

const aliases = {
  'CREATE_NEW_TASK': () => {
    console.log('Hello')
  }
}

export default createStore(
  tasksReducer,
  applyMiddleware(alias(aliases))
)

dispatch({ type: 'CREATE_NEW_TASK' })

Error: Actions must be plain objects. Use custom middleware for async actions.
error dispatching result: Actions must be plain objects. Use custom middleware for async actions

@tshaddix

This comment has been minimized.

Show comment
Hide comment
@tshaddix

tshaddix Jun 8, 2017

Owner

@jdinartejesus Got it. So you're waiting for a response from firebase before updating the state? If so, you are attempting an Async Action. You can use something like redux-thunk to handle these sorts of actions. Right now, you're using plain old redux without any middleware (other than alias) which means it's expecting an action object to be returned.

If you were to add something like redux-thunk to your middleware, you could return a function instead:

const aliases = {
  'CREATE_NEW_TASK': () => {
    return (dispatch) => {
        // do your firebase work
        // when complete...
        dispatch({
           type: 'CREATED_NEW_TASK',
           payload: someResponseFromFirebase
        });
    };
  }
}

It's important when doing these sort of aliases to rename your resulting actions into a new action name that is different from your aliased one. If you returned a new action named CREATE_NEW_TASK, it would just keep looping on itself as the alias fires its alias which fires its alias...

Does this help?

Owner

tshaddix commented Jun 8, 2017

@jdinartejesus Got it. So you're waiting for a response from firebase before updating the state? If so, you are attempting an Async Action. You can use something like redux-thunk to handle these sorts of actions. Right now, you're using plain old redux without any middleware (other than alias) which means it's expecting an action object to be returned.

If you were to add something like redux-thunk to your middleware, you could return a function instead:

const aliases = {
  'CREATE_NEW_TASK': () => {
    return (dispatch) => {
        // do your firebase work
        // when complete...
        dispatch({
           type: 'CREATED_NEW_TASK',
           payload: someResponseFromFirebase
        });
    };
  }
}

It's important when doing these sort of aliases to rename your resulting actions into a new action name that is different from your aliased one. If you returned a new action named CREATE_NEW_TASK, it would just keep looping on itself as the alias fires its alias which fires its alias...

Does this help?

@jdinartejesus

This comment has been minimized.

Show comment
Hide comment
@jdinartejesus

jdinartejesus Jun 8, 2017

Thanks @tshaddix This actually helps a lot. Also I really appreciate your time on building this package.

jdinartejesus commented Jun 8, 2017

Thanks @tshaddix This actually helps a lot. Also I really appreciate your time on building this package.

@tshaddix

This comment has been minimized.

Show comment
Hide comment
@tshaddix

tshaddix Jun 9, 2017

Owner

@jdinartejesus No problem! Glad I could help :)

This package is a result of all the awesome contributors such as yourself!

Owner

tshaddix commented Jun 9, 2017

@jdinartejesus No problem! Glad I could help :)

This package is a result of all the awesome contributors such as yourself!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment