Find Furry Friend — mapStateToProps

Photo by Krista Mangulsone on Unsplash

PetsContainer

First, we need to import the connect() function from react in order for us to connect a React component (in our case PetsContainer.js) to a Redux store.

Next, we build our mapStateToProps! mapStateToProps is a function that takes in the entire redux store state as its first argument and will return an object that contains the data that we want (we set it up how we want) and then merges them into props in our component. mapStateToProps should be passed as the first argument to connect, (last line of our code) and will be called every time when the redux store state changes

Lastly, we will also need to connect our getPets action in order to send our data to the reducer which will then change state

getPets action

(dispatches to reducer)

reducer

(returns new state)

References