diff --git a/src/components/pages/EventDetail.js b/src/components/pages/EventDetail.js index 685697d0259b8fc4a10255e4ac59988948c0b584..dc2dffe01bcb2f1342b282afbb640e472644f5f0 100644 --- a/src/components/pages/EventDetail.js +++ b/src/components/pages/EventDetail.js @@ -138,8 +138,7 @@ class EventDetail extends Component { </Table.Row> </Table.Header> <Table.Body> - { this.props.trainees && - this.props.selectedEvent ? + { this.props.selectedEvent ? this.renderTrainees() : '' diff --git a/src/components/pages/Schedule.js b/src/components/pages/Schedule.js index d6a6ac619ed242e3c78a0af5d41896f4c227df90..971e0c9f4d3f4627dc336987a4df8cebc2c7e00c 100644 --- a/src/components/pages/Schedule.js +++ b/src/components/pages/Schedule.js @@ -1,26 +1,72 @@ import React, { Component } from 'react'; -import { Container, Header, Segment } from 'semantic-ui-react'; +import { Container, Accordion, Icon } from 'semantic-ui-react'; +import { connect } from 'react-redux'; +import moment from 'moment'; +import { getEvents } from '../../actions/statistics'; + +class Schedule extends Component { + state = { activeIndex: 0 } + + componentWillMount() { + this.props.getEvents(); + } + + handleClick = (e, titleProps) => { + const { index } = titleProps + const { activeIndex } = this.state + const newIndex = activeIndex === index ? -1 : index + + this.setState({ activeIndex: newIndex }) + } -export default class Schedule extends Component { render() { + const { activeIndex } = this.state + + const events = this.props.events; + const panels = events.map(event => ( + <> + <Accordion.Title + active={activeIndex === event.id} + index={event.id} + onClick={this.handleClick} + > + <h2> + <Icon name='transgender' color='blue' /> + {event.name} {moment(event.date).format('LLL')} + </h2> + </Accordion.Title> + <Accordion.Content active={activeIndex === event.id}> + <p> + A dog is a type of domesticated animal. Known for its loyalty and faithfulness, it can + be found as a welcome guest in many households across the world. + </p> + </Accordion.Content> + </> + )); + return ( - <div> - <Segment inverted textAlign='center' vertical> - <Container> - <Header - as='h1' - content='Ătemterv - Hamarosan' - inverted - style={{ - fontSize: '3em', - fontWeight: 'normal', - marginBottom: 0, - marginTop: '0.5em', - }} - /> - </Container> - </Segment> - </div> + <Container + textAlign='center' + style={{ + padding: '60px' + }} + > + <h2>KĂŠpzĂŠs alkalmak:</h2> + <Accordion + fluid + styled + defaultActiveIndex={-1} + panels={panels} + > + {panels} + </Accordion> + <h2>TĂĄbor:</h2> + </Container> ); } } + + +const mapStateToProps = ({ events: { events }, user }) => ({ events, user }); + +export default connect(mapStateToProps, { getEvents })(Schedule); diff --git a/src/reducers/EventReducer.js b/src/reducers/EventReducer.js index 0766ddda7af07dc775f6b45087b8ccbd5b9b7ea8..071ede590c9dae1997cfc73c2b5a49a98ccc2c94 100644 --- a/src/reducers/EventReducer.js +++ b/src/reducers/EventReducer.js @@ -7,7 +7,7 @@ import { DELETE_EVENT, } from '../actions/types'; -const INITIAL_STATE = { newEvent: {} }; +const INITIAL_STATE = { events: [], newEvent: {} }; export default (state = INITIAL_STATE, action) => { switch (action.type) { diff --git a/src/reducers/TraineeReducer.js b/src/reducers/TraineeReducer.js index f7fa38e0d7e2645d76da834af90dc272cee159ef..118135fccb526c65aea89916b004bd0123d949d8 100644 --- a/src/reducers/TraineeReducer.js +++ b/src/reducers/TraineeReducer.js @@ -1,6 +1,6 @@ import { GET_TRAINEES, GET_TRAINEE_BY_ID } from '../actions/types'; -const INITIAL_STATE = {}; +const INITIAL_STATE = { trainees: [], selectedTrainee: {}}; export default (state = INITIAL_STATE, action) => { switch (action.type) {