React + Redux, как создать выпадающий список?

const initialState = {
    show_role:  true,
    default_role: "CUSTOMER",
    roles_user: [
        "CUSTOMER",
        "ARTIST",
        "JUDGE"
    ],
    projects: []
};


const customerProject = (state = initialState) => {
	return state;
}


const store = createStore(
	customerProject, 
	window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);

render(
    <Provider store={store}>
    	<Container />
    </Provider>,
    document.getElementById("root")
);


const Container = () => {
 
    return (
        <div className="container_main">
            <UserContainer />
            <ListBox />
        </div>
    );
}


const UserContainer = connect(
	state => ({
		default_role: state.customerProject.default_role,
		show_role: state.customerProject.show_role,
		roles_user: state.customerProject.roles_user
		
	}),
	dispatch => ({

	}))(AboutUser)


const AboutUser = (props) => {

        
    const showRoleUser = () => {

    }



    const changeRoleUser = () => {
        
    }

       
    return (
            <div className="container_about_user">
                <aside className="me_user">
                    <span>ME</span>
                </aside>
                <div className="about_profile">
                    <img className="avatar_profile"
                         src="./static/img/picture.jpeg"
                         width="50"
                         height="50"
                    />
                    <div className="info_profile">
                        <h4 className="name">
                            VASILIY PETROV
                        </h4>
                        <p className="position">
                            Independent producer
                        </p>
                        <p className="city">
                            Bangkok, Thailand
                        </p>
                    </div>
                    <div className="role_user">
                        <span onClick={showRoleUser}>
                            <p>{props.default_role}</p>
                        </span>
                        <div className={ props.show_role ? "":"dropdown_role"}>
                            {props.show_role ? "":props.roles_user.map((item) => {
                                return <div
                                            onClick={changeRoleUser}
                                            key={item}>{item}
                                        </div>
                            })}
                        </div> 
                    </div>
                </div>
            </div>
    );
}