Skip to content
Snippets Groups Projects
Select Git revision
  • 6f4be55a08b7a5220aace4213ac6938083362ed9
  • main default protected
  • revert-40fe6e97
3 results

layout.html

Blame
  • Groups.js 1.23 KiB
    import React, { Component } from 'react';
    import { Container, Header, Segment, Divider } from 'semantic-ui-react';
    import './Groups.css';
    import GroupCard from '../extra/GroupCard'
    
    import { connect } from 'react-redux';
    import { getGroups } from '../../actions/groups';
    
    
    class Groups extends Component {
      componentWillMount() {
        this.props.getGroups()
      }
    
      render() {
        return (
          <div>
            <Segment inverted textAlign='center' vertical>
              <Container>
                <Header
                  as='h1'
                  content='Köreink'
                  inverted
                  style={{
                    fontSize: '3em',
                    fontWeight: 'normal',
                    marginBottom: 0,
                    marginTop: '0.5em',
                  }}
                />
              </Container>
            </Segment>
                  
            <Segment style={{ padding: '1em 0em 5em' }} vertical>
              <Container text>
                { this.props.groups.map(item => {
                  return <GroupCard key={item.id} label={item.name} value={item.description}/>
                })}
              </Container>
            </Segment>
          </div>
        );
      }
    }
    
    const mapStateToProps = ({ groups }) => ({ groups });
    
    export default connect(mapStateToProps, { getGroups })(Groups);