Skip to content
Permalink
Browse files

Web folder - All tournaments endpoint, tournament initial behaviour (#77

)

Web folder - All tournaments endpoint, tournament initial behaviour
  • Loading branch information...
moul committed Jun 5, 2019
2 parents db86ca0 + 89b336e commit 16d4631e450d1c8e4f3ec96a3ee34d34958b396d
@@ -1,5 +1,4 @@
import {
GET_USER_TEAMS,
GET_USER_TEAMS_SUCCESS,
GET_USER_TEAMS_FAILED,
SET_TEAMS_LIST,
@@ -8,16 +7,14 @@ import {
JOIN_TEAM_FAILED
} from "../constants/actionTypes"
import { getAllTeams, getUserTeams, joinTeam as joinTeamCall } from "../api/teams"
import { fetchTeamTournaments as fetchTeamTournamentsAction } from "./tournaments";

export const fetchUserTeams = (userID) => async dispatch => {
dispatch({
type: GET_USER_TEAMS
})

try {
const response = await getUserTeams(userID);
const teams = response.data.items;
const lastActiveTeam = teams.find((team) => team.lastActive);
const lastActiveTeam = teams.find((team) => team.last_active);

dispatch({
type: GET_USER_TEAMS_SUCCESS,
@@ -26,6 +23,9 @@ export const fetchUserTeams = (userID) => async dispatch => {
lastActiveTeam: lastActiveTeam
}
})

dispatch(fetchTeamTournamentsAction(lastActiveTeam.metadata.id))

} catch (error) {
dispatch({
type: GET_USER_TEAMS_FAILED,
@@ -1,30 +1,91 @@
import {
GET_TOURNAMENTS_SUCCESS,
GET_TOURNAMENTS_FAILED,
GET_ALL_TOURNAMENTS_SUCCESS,
GET_ALL_TOURNAMENTS_FAILED,
GET_TEAM_TOURNAMENTS_SUCCESS,
GET_TEAM_TOURNAMENTS_FAILED,
SET_DEFAULT_TOURNAMENT,
SET_ACTIVE_TOURNAMENT,
SET_ACTIVE_TOURNAMENT_FAILED,
SET_LEVELS_LIST,
SET_LEVELS_LIST_FAILED
} from "../constants/actionTypes"
import { getTournaments, getLevels } from "../api/tournaments"
import {
getAllTournaments,
getTeamTournaments,
getLevels,
setTournamentActive as setTournamentActiveCall
} from "../api/tournaments"

export const fetchTournaments = () => async dispatch => {
export const setActiveTournament = (teamID, tournamentData) => async dispatch => {
try {
const response = await getTournaments();
// const response = await setTournamentActiveCall(teamID, tournamentData.metadata.id)
// if (response.status === 200) {
dispatch({
type: SET_ACTIVE_TOURNAMENT,
payload: { activeTournament: tournamentData }
});

dispatch(fetchLevels(tournamentData.metadata.id))
// }
}
catch(error) {
dispatch({ type: SET_ACTIVE_TOURNAMENT_FAILED, payload: { error }});
alert("Set tournament active failed, please try again!")
}

}

export const setDefaultTournament = (tournamentData) => async dispatch => {
dispatch({
type: SET_DEFAULT_TOURNAMENT,
payload: { defaultTournament: tournamentData }
});
}

export const fetchAllTournaments = () => async dispatch => {
try {
const response = await getAllTournaments();
const allTournaments = response.data.items;

dispatch({
type: GET_ALL_TOURNAMENTS_SUCCESS,
payload: { allTournaments: allTournaments }
})
} catch (error) {
dispatch({ type: GET_ALL_TOURNAMENTS_FAILED, payload: { error } });
}
}

export const fetchTeamTournaments = (teamID) => async dispatch => {
try {
const response = await getTeamTournaments(teamID);
const allTeamTournaments = response.data.items;
const lastActiveTournament = allTeamTournaments.find((tournament) => tournament.last_active)
const defaultTournament = allTeamTournaments.find((tournament) => tournament.is_default)

dispatch({
type: GET_TOURNAMENTS_SUCCESS,
payload: { allTournaments: response.data.items }
type: GET_TEAM_TOURNAMENTS_SUCCESS,
payload: { allTeamTournaments: allTeamTournaments }
});

if (lastActiveTournament === defaultTournament) {
dispatch(setActiveTournament(teamID, lastActiveTournament));
} else if (!lastActiveTournament && defaultTournament) {
dispatch(setDefaultTournament(defaultTournament));
dispatch(setActiveTournament(teamID, defaultTournament));
}

} catch (error) {
dispatch({
type: GET_TOURNAMENTS_FAILED,
type: GET_TEAM_TOURNAMENTS_FAILED,
payload: { error }
});
}
}

export const fetchLevels = (competitionId) => async dispatch => {
export const fetchLevels = (tournamentID) => async dispatch => {
try {
const response = await getLevels(competitionId);
const response = await getLevels(tournamentID);
dispatch({
type: SET_LEVELS_LIST,
payload: { activeLevels: response.data.items }
@@ -25,7 +25,7 @@ export function getUserTeams(userID) {
"name": "chartreuse",
"gravatar_url": "http://www.internationalmonetize.io/harness/communities",
"locale": "fr_FR",
"lastActive": true
"last_active": true
}
]
}
@@ -2,12 +2,21 @@
// import { baseApi } from "./index";
import axios from "axios";

export function getTournaments() {
export function setTournamentActive(activeTeamID, tournamentID) {
// return baseApi.post(`/user-tournaments`, { activeTeamID, tournamentID });
}
export function getAllTournaments() {
return axios.get("https://gist.githubusercontent.com/moul/826ef89d52651570a396ef3210a72e40/raw/e95d0e0391abca995949ab1258d5569e0b5ec356/GET%2520tournaments.json")
// Uncomment line to use base api with auth token
// return baseApi.get(`/tournaments`);
}

export function getTeamTournaments(teamID) {
return axios.get("https://gist.githubusercontent.com/moul/826ef89d52651570a396ef3210a72e40/raw/e95d0e0391abca995949ab1258d5569e0b5ec356/GET%2520tournaments.json")
// Uncomment line to use base api with auth token
// return baseApi.get(`/team-tournaments`, { teamID });
}

export function getLevels(tournamentID) {
return axios.get("https://gist.githubusercontent.com/moul/826ef89d52651570a396ef3210a72e40/raw/e95d0e0391abca995949ab1258d5569e0b5ec356/GET%2520levels.json")
// Uncomment line to use base api with auth token
@@ -9,6 +9,7 @@ import LoginPage from "./pages/LoginPage";
import LogoutPage from "./pages/LogoutPage";
import NotFoundPage from "./pages/NotFoundPage";
import TournamentPage from "./pages/TournamentPage";
import AllTournamentsPage from "./pages/AllTournamentsPage";

class App extends React.Component {
render() {
@@ -19,6 +20,7 @@ class App extends React.Component {
<Route exact path="/login" component={LoginPage} />
<ProtectedRoute exact path="/dashboard" component={DashboardPage} />
<ProtectedRoute exact path="/tournament" component={TournamentPage} />
<ProtectedRoute exact path="/all-tournaments" component={AllTournamentsPage} />
<Route path="/logout" component={LogoutPage} />
<Route component={NotFoundPage} />
</Switch>
@@ -0,0 +1,75 @@
import * as React from "react";
import { connect } from "react-redux";
import PropTypes from "prop-types";

import {
Page,
Grid
} from "tabler-react";

import SiteWrapper from "../SiteWrapper";
import AllTournamentsList from "../tournament/AllTournamentsList";
import AllTeamTournamentsList from "../tournament/AllTeamTournamentsList";
import {
fetchAllTournaments as fetchAllTournamentsAction,
setActiveTournament as setActiveTournamentAction
} from "../../actions/tournaments"

class AllTournamentsPage extends React.PureComponent {

componentDidMount() {
const { fetchAllTournamentsAction } = this.props;
fetchAllTournamentsAction();
}

render() {
const {
tournaments: { allTournaments, allTeamTournaments, activeTournament },
activeTeam,
setActiveTournamentAction
} = this.props;
return (
<SiteWrapper>
<Page.Content title="All Tournaments">
<Grid.Row cards={true}>
<Grid.Col xs={12} sm={12} lg={6}>
{ allTournaments && <AllTournamentsList tournaments={allTournaments} /> }
</Grid.Col>
<Grid.Col xs={12} sm={12} lg={6}>
{ allTeamTournaments &&
<AllTeamTournamentsList
teamTournaments={allTeamTournaments}
activeTournament={activeTournament}
setActive={setActiveTournamentAction}
activeTeam={activeTeam}
/>
}
</Grid.Col>
</Grid.Row>
</Page.Content>
</SiteWrapper>
);
}
}

AllTournamentsPage.propTypes = {
tournaments: PropTypes.object,
activeTeam: PropTypes.object,
fetchAllTournamentsAction: PropTypes.func,
setActiveTournamentAction: PropTypes.func
};

const mapStateToProps = state => ({
tournaments: state.tournaments,
activeTeam: state.teams.activeTeam
});

const mapDispatchToProps = {
fetchAllTournamentsAction: () => fetchAllTournamentsAction(),
setActiveTournamentAction: (teamID, tournament) => setActiveTournamentAction(teamID, tournament)
};

export default connect(
mapStateToProps,
mapDispatchToProps
)(AllTournamentsPage);
@@ -7,25 +7,21 @@ import SiteWrapper from "../SiteWrapper";
import LevelsCardPreview from "../levels/LevelCardPreview";
import ValidationCouponStamp from "../coupon/ValidateCouponStampCard";

import { fetchLevels as fetchLevelsAction } from "../../actions/tournaments";

class TournamentPage extends React.Component {

componentDidMount() {
const { fetchLevelsAction } = this.props;
fetchLevelsAction();
}

render() {
const { tournaments } = this.props;
const { tournaments: { activeTournament, activeLevels } } = this.props;
const name = activeTournament ? activeTournament.name : undefined;

return (
<SiteWrapper>
<Page.Content title="Tournament">
<Grid.Row cards={true}>
<Page.Content title="Tournament" subTitle={name}>
<Grid.Row>
</Grid.Row>
<Grid.Row>
<Grid.Col xs={12} sm={8} lg={6}>
<h3>Levels</h3>
{tournaments.activeLevels && <LevelsCardPreview levels={tournaments.activeLevels} />}
{activeLevels && <LevelsCardPreview levels={activeLevels} />}
</Grid.Col>
<Grid.Col xs={12} sm={4} lg={3}>
<h3>Actions</h3>
@@ -40,16 +36,14 @@ class TournamentPage extends React.Component {

TournamentPage.propTypes = {
tournaments: PropTypes.object,
fetchLevelsAction: PropTypes.func
activeTeam: PropTypes.object
};

const mapStateToProps = state => ({
tournaments: state.tournaments
});

const mapDispatchToProps = {
fetchLevelsAction: () => fetchLevelsAction()
};
const mapDispatchToProps = {};

export default connect(
mapStateToProps,
@@ -0,0 +1,67 @@
import * as React from "react";
import { Card, Table, Button } from "tabler-react";
import PropTypes from "prop-types";

const TournamentsRows = ({ teamTournaments, setActive, activeTeam, activeTournament }) => {
return teamTournaments.map((tournament) => {
const isActive = activeTournament ? tournament.metadata.id === activeTournament.metadata.id : false;
return (
<Table.Row key={tournament.metadata.id}>
<Table.Col colSpan={2}>{tournament.name}</Table.Col>
<Table.Col>{tournament.status}</Table.Col>
<Table.Col>{tournament.visibility}</Table.Col>
{isActive && <Table.Col>
Active
</Table.Col>}
{!isActive && <Table.Col>
<Button color="info" size="sm" onClick={() => setActive(activeTeam.metadata.id, tournament)}>Set active</Button>
</Table.Col>}
</Table.Row>
)
})
}

const AllTeamTournamentsList = props => {
const { teamTournaments, setActive, activeTeam, activeTournament } = props;
return (
<Card>
<Card.Header>
<Card.Title>Team Tournaments</Card.Title>
</Card.Header>
<Table
cards={true}
striped={true}
responsive={true}
className="table-vcenter"
>
<Table.Header>
<Table.Row>
<Table.ColHeader colSpan={2}>Name</Table.ColHeader>
<Table.ColHeader>Status</Table.ColHeader>
<Table.ColHeader>Visibility</Table.ColHeader>
<Table.ColHeader></Table.ColHeader>
</Table.Row>
</Table.Header>
<Table.Body>
{ teamTournaments &&
<TournamentsRows
teamTournaments={teamTournaments}
activeTournament={activeTournament}
setActive={setActive}
activeTeam={activeTeam}
/>
}
</Table.Body>
</Table>
</Card>
)
}

AllTeamTournamentsList.propTypes = {
teamTournaments: PropTypes.array,
setActive: PropTypes.func.metadata,
activeTeam: PropTypes.object,
activeTournament: PropTypes.object
};

export default AllTeamTournamentsList

0 comments on commit 16d4631

Please sign in to comment.
You can’t perform that action at this time.