2017-08-02 23:27:05 +08:00
|
|
|
import React, { Component } from "react";
|
2017-08-03 22:03:15 +08:00
|
|
|
import { connect } from "react-redux";
|
2017-08-02 23:27:05 +08:00
|
|
|
import PropTypes from "prop-types";
|
|
|
|
import { NavDropdown, MenuItem } from "react-bootstrap";
|
|
|
|
|
2017-08-03 22:03:15 +08:00
|
|
|
import { setCurrentUser, changeTeam } from "../../actions/TeamsActions";
|
|
|
|
|
2017-08-02 23:27:05 +08:00
|
|
|
class TeamSwitch extends Component {
|
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
2017-08-03 22:03:15 +08:00
|
|
|
this.displayTeams = this.displayTeams.bind(this);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
changeTeam(team_id) {
|
|
|
|
console.log("clicked");
|
|
|
|
this.props.changeTeam(team_id);
|
|
|
|
}
|
2017-08-02 23:27:05 +08:00
|
|
|
|
2017-08-03 22:03:15 +08:00
|
|
|
displayTeams() {
|
|
|
|
return this.props.all_teams.filter(team => !team.current_team).map(team =>
|
|
|
|
<MenuItem onSelect={() => this.changeTeam(team.id)} key={team.id}>
|
|
|
|
{team.name}
|
|
|
|
</MenuItem>
|
|
|
|
);
|
2017-08-02 23:27:05 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
return (
|
|
|
|
<NavDropdown
|
|
|
|
eventKey={this.props.eventKey}
|
2017-08-03 22:03:15 +08:00
|
|
|
title={this.props.current_team.name}
|
2017-08-02 23:27:05 +08:00
|
|
|
id="team-switch"
|
|
|
|
>
|
2017-08-03 22:03:15 +08:00
|
|
|
{this.displayTeams()}
|
2017-08-02 23:27:05 +08:00
|
|
|
</NavDropdown>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
TeamSwitch.propTypes = {
|
2017-08-03 22:03:15 +08:00
|
|
|
eventKey: PropTypes.number.isRequired,
|
|
|
|
setCurrentUser: PropTypes.func.isRequired,
|
|
|
|
all_teams: PropTypes.arrayOf(
|
|
|
|
PropTypes.shape({
|
|
|
|
id: PropTypes.number.isRequired,
|
|
|
|
name: PropTypes.string.isRequired,
|
|
|
|
current_team: PropTypes.bool.isRequired
|
|
|
|
})
|
|
|
|
),
|
|
|
|
current_team: PropTypes.shape({
|
|
|
|
id: PropTypes.number.isRequired,
|
|
|
|
name: PropTypes.string.isRequired,
|
|
|
|
current_team: PropTypes.bool.isRequired
|
|
|
|
})
|
|
|
|
};
|
|
|
|
|
|
|
|
// Map the states from store to component
|
|
|
|
const mapStateToProps = ({ all_teams, current_team }) => {
|
|
|
|
return { all_teams, current_team };
|
|
|
|
};
|
|
|
|
|
|
|
|
// Map the fetch activity action to component
|
|
|
|
const mapDispatchToProps = dispatch => ({
|
|
|
|
setCurrentUser() {
|
|
|
|
dispatch(setCurrentUser());
|
|
|
|
},
|
|
|
|
changeTeam(team_id) {
|
|
|
|
dispatch(changeTeam(team_id));
|
|
|
|
}
|
|
|
|
});
|
2017-08-02 23:27:05 +08:00
|
|
|
|
2017-08-03 22:03:15 +08:00
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(TeamSwitch);
|