addo's gist

- The constructor was spelt wrongly we have to change it to this to make avoid syntax error related to this.
``` 
constructor(props) {
    super(props)
    this.state = {
      isOpen: false,
    };
  }
```
- Let us also validate our props-types whenever we use a prop like label.
- The toggle method is not well implemented because it seems to set the old ```isOpen``` state to the ```isOpen```, we can implement it this way, 

```
const {isOpen} = this.state;
this.setState({isOpen: !isOpen});

```
- The dropdown menu should only show when ```isOpen``` is true and hide when otherwise. Let us add a styling in with respect to the class that toggle based on ```isOpen```   
```
<ul className={`${isOpen ? 'dropdown-open' : ''} dropdown-menu`} aria-labelledby="dropdownButton" role="menu">
  {this.props.children}
</ul>
```
or we may wrap this jsx in a conditional statement such that it would show only if the isOpen is set to true.
```
  {this.state.isOpen ? (<ul role="menu">{this.props.children}</ul>): ("<div></div>")}
```
- Render the line below in your DropdownItem
```
return(<div> <a href = {this.props.href}>{this.props.children}</a> </div>)
```
- Finally, Place to connect app.sync('PATCH', 'user', { dropdown_1_state: {true,false} }) wrapped within a componentDidMount() method