Map Dispatch to Props issue

JavaScript
1

Tell us what’s happening:
Well, I floudered through React, and then Redux, barely making it through, but now I’ve gotten to React AND Redux, I’m stuck.
The criterion Dispatching addMessage with submitNewMessage from mapDispatchToProps should return a message to the dispatch function. isn’t passing.
Any help will be appreciated.

Your code so far


const addMessage = (message) => {
  return {
    type: 'ADD',
    message: message
  }
};

// change code below this line
const store = Redux.createStore(
  (state = {}) => state
);

function mapDispatchToProps()
{
  return {
     submitNewMessage: function(message) {
      store.dispatch(addMessage(message));
  }
  }
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

Link to the challenge:

2

OK, first of all, it says nothing about defining the store - get that out of there. All we’re making is the mapDispatchToProps.

So if we don’t create the store, where does dispatch come from? Reread this line in the instructions:

Write the function mapDispatchToProps() that takes dispatch as an argument, then returns an object. [emphasis added]

So, we take it in as an argument. Again, mapDispatchToProps takes one argument: dispatch. You don’t need to pull it off the store - redux passes it to your MDTP function.

So, I make three changes to your code:

  1. Get rid of the store creation.
  2. Pass dispatch into MSTP.
  3. Change how dispatch is called - not as a property of store but as a passed in value.

When I make these changes, your code passes.

3

// CHECK FOR THE SOLUTION
const addMessage = (message) => {
return {
type: ‘ADD’,
message: message
}
};

// change code below this line
function mapDispatchToProps(dispatch)
{
return {
submitNewMessage: (message) => {
dispatch(addMessage(message));
}
}
};

4