frontend/src/containers/home.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

import React, { Component } from "react";
import { connect } from "react-redux";
import { Button, Container, Input } from "rebass";
import { actions } from "../redux/players";

class HomePage extends Component {
  play = e => {
    e.preventDefault();
    if (this._username !== undefined) {
      this.props.chooseUsername(this._username);
    }
  };

  render() {
    return (
      <Container>
        <Input
          name="username"
          label="Username"
          placeholder="Username"
          hideLabel
          onChange={e => (this._username = e.target.value)}
        />
        <Button backgroundColor="primary" color="white" big onClick={this.play}>
          PLAY NOW!
        </Button>
      </Container>
    );
  }
}

const mapStateToProps = state => ({});

const mapDispatchToProps = {
  chooseUsername: actions.chooseUsername
};

export default connect(mapStateToProps, mapDispatchToProps)(HomePage);