{"size": 1735, "ext": "js", "max_stars_repo_path": "src/component/App.js", "max_stars_repo_name": "aikatsukamen/myCharaList", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/component/App.js", "max_issues_repo_name": "aikatsukamen/myCharaList", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/component/App.js", "max_forks_repo_name": "aikatsukamen/myCharaList", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 25.1449275362, "max_line_length": 136, "alphanum_fraction": 0.6933717579}
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { withStyles } from '@material-ui/core/styles';

import './App.css';
import { requestList, changeView, updateHaveList } from '../actions';
import GridList from './GridList';
import Navigation from './Navigation';

const styles = theme => ({
  button: {
    margin: theme.spacing.unit,
    float: 'right',
    top: '-60px'
  },
  icon: {}
});

class App extends React.Component {
  componentWillMount() {
    // 初期表示時、リスト取得
    this.props.requestList();
  }

  render() {
    return (
      <div className="App">
        <Navigation selected={this.props.selected} changeView={this.props.changeView} requestList={this.props.requestList} />
        <div style={{ textAlign: 'left', padding: '5px', fontSize: '8px' }}>status:{this.props.status}</div>
        <GridList list={this.props.list} have={this.props.have} sort={this.props.selected} updateHaveList={this.props.updateHaveList} />
      </div>
    );
  }
}

// state
function mapStateToProps(state) {
  return {
    status: state.reducer.status,
    list: state.reducer.list,
    have: state.reducer.have,
    selected: state.reducer.selected
  };
}

// action
const mapDispatchToProps = {
  requestList,
  changeView,
  updateHaveList
};

App.propTypes = {
  classes: PropTypes.object.isRequired,
  status: PropTypes.string.isRequired,
  list: PropTypes.array.isRequired,
  have: PropTypes.array.isRequired,
  selected: PropTypes.string.isRequired,
  requestList: PropTypes.func.isRequired,
  changeView: PropTypes.func.isRequired,
  updateHaveList: PropTypes.func.isRequired
};

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(withStyles(styles)(App));
