Question: I am new to redux. I typed up a simple piece of code that just dispatches the name "Mike" 

However when i click on the `buttonClick()` function I created.. nothing gets dispatched also I am not sure how I can show the dispatched value "Mike" where it says "Hi my name is ... " 

Below is my code. Any help would be really appreciated 

```
import React from 'react';
import './App.css';
import {changeName} from './reducers.js'
import {createStore} from 'redux';
import {changeNameAction} from './actions'
import {connect} from 'react-redux';

var store = createStore(changeName);

const App = ({buttonClick=f=>f }) => {
      return(
      <div className="App">
        <div> Hi my name is {}  </div>
        <div><button onClick={()=> buttonClick("Mike")}>Change name</button></div>
      </div>
    )
};

const mapStateProps = (state) => {
    return {
        name: state.name
    }
}

const mapDispatchToProps = dispatch => {
    return {
        buttonClick(name){
            dispatch(changeNameAction(name))
        }
    }
}

const Container = connect(mapStateProps,mapDispatchToProps)(App);
export default Container;

```

Answer: 
I can't test your code right now, but you can try with this:

```js
// The connected props are part of the arguments
const App = ({ buttonClick = () => {}, name = '' }) => {
    return(
      <div className="App">
        {/* This way you can render the name prop */}
        <div> Hi my name is {name}</div>
        {/* Execute the function instead of returnning it */}
        <div><button onClick={() => { buttonClick("Mike"); }}>Change name</button></div>
      </div>
    )
};

const mapStateProps = (state) => {
    return {
        name: state.name
    }
}

const mapDispatchToProps = dispatch => {
    return {
        // Key value pair
        buttonClick: (name) => {
            dispatch(changeNameAction(name))
        }
    }
}

```

hope it helps
Thanks a lot for your answers guys. Taym you reponse worked. I realized what the issues was I didn't use the state operator. 

So before my action was like this 

export const changeName = (state,action) => {

```
    if(action.type === "CHANGE_NAME"){

        return {action.payload};

    } else {
        return state;
    }

}

```

then I changed it like this 

```
export const changeName = (state,action) => {

    if(action.type === "CHANGE_NAME"){

        //I added the spread operator.. and it worked. Thank you so much!
        return {...state,name:action.payload};

    } else {
        return state;
    }

}

```