<commit_before>import React, { Component } from 'react';
import moment from 'moment-timezone';
import momentFquarter from 'moment-fquarter';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import { browserHistory } from 'react-router';
import Masonry from 'react-masonry-component';
import Card from 'material-ui/Card/Card';
import CardHeader from 'material-ui/Card/CardHeader';
import CardMedia from 'material-ui/Card/CardMedia';
import Avatar from 'material-ui/Avatar';
import List from 'material-ui/List/List';
import ListItem from 'material-ui/List/ListItem';
import Divider from 'material-ui/Divider';
import TextField from 'material-ui/TextField';
import DropDownMenu from 'material-ui/DropDownMenu';
import MenuItem from 'material-ui/MenuItem';
import ToolbarGroup from 'material-ui/Toolbar/ToolbarGroup';
import { Tabs, Tab } from 'material-ui/Tabs';
import { Grid, Row, Col } from 'react-bootstrap';
import DashboardMediumGraph from '../../components/DashboardMediumGraph';
import NavToolBar from '../../components/NavToolBar';
import RenderTeachers from '../../components/RenderTeachers';
import Async from '../../components/Async';

const styles = {
  headline: {
    fontSize: 24,
    paddingTop: 16,
    marginBottom: 12,
    fontWeight: 400,
  },
};
//let Masonry = MasonryCtl(React);

@inject('classes')
@observer
class Class extends Component {
  @observable cls;
  @observable yearId;
  @observable divisionClass;
  @observable currentDivision;
  @observable slideIndex = 'overview';
  @observable showYear = false;
  componentWillMount() {
    const { params } = this.props;
    const { classes } = this.props;
    this.cls = classes.getClass(params.classId);
    this.divisionClass = classes.getClassCurrentDivision(params.classId);
    this.currentDivision = (this.divisionClass) ? classes.getDivision(this.divisionClass.divisionId) : null;
    this.studentYearId = (this.currentDivision) ? classes.getClassGroupingYear(this.currentDivision.divisionYear).id : null;
    this.setState({
      masonryOptions: {},
    });
  }

  componentDidMount() {
  }

  getGraphAttendance(day, length) {
    const { params } = this.props;
    const { classes } = this.props;
    const attendance = classes.getClassAttendanceByDay(params.classId, day);
    const labels = attendance.map((day1) => moment.utc(day1.attendanceDate).tz('America/Chicago').format('MM/DD'));
    const series = attendance.map((day1) => parseInt(day1.count, 10));
    //console.log("graphAttendance", labels, series);
    return {
      labels,
      series: [series],
    };
  }

  navigate(path, e) {
    browserHistory.push(path);
  }

  formatDateRange(division) {
    return moment(division.start).format('MMM D YYYY') + ' - ' + moment(division.end).format('MMM D YYYY');
  }

  updateTitle(e) {
    const { classes } = this.props;
    const { params } = this.props;
    classes.db.updateCollectionFields('classes', params.classId, { title: e.target.value });
  }

  selectedYear = (event, selectedIndex, value) => {
    this.yearId = value;
    // console.log(menuItem);
  }

  changeTab = (index) => {
    this.slideIndex = index;
    this.showYear = (index === 'students' || index === 'teachers') ? true : false;
  }

  render() {
    const { params } = this.props;
    const { classes } = this.props;
    const { masonryOptions } = this.state;
    let lineChartOptions = {
      low: 0,
      showArea: true,
    };
    let retVal;
    if (this.cls) {
      retVal = (
        <Grid fluid>
          <Row>
            <Col xs={12} sm={12} md={12} lg={12}>
              <NavToolBar navLabel={this.cls.title} goBackTo="/classes" >
                <ToolbarGroup key={2} lastChild style={{ float: 'right' }}>
                  {this.showYear &&
                    <DropDownMenu
                      value={this.yearId}
                      onChange={this.selectedYear}
                      style={{ marginRight: '12px' }}
                    >
                      {classes.getClassGroupingYears(this.currentDivision.divisionConfigId).map((year) =>
                        <MenuItem key={year.id} value={year.id} label={moment(year.endDate).format('YYYY')} primaryText={moment(year.endDate).format('YYYY')} />
                      )}
                    </DropDownMenu>
                  }
                </ToolbarGroup>
              </NavToolBar>
            </Col>
          </Row>
          <Row>
            <Col xs={12} sm={12} md={12} lg={12}>
              <Tabs
                value={this.slideIndex}
                onChange={this.changeTab}
              >
                <Tab
                  label="Overview"
                  value={'overview'}
                >
                  <Row>
                    <Col xs={12} sm={12} md={12} lg={12}>
                      <div>
                        <span className="button">{this.currentDivision.title}</span> <br />
                        <span className="caption">{moment(this.currentDivision.start).tz('America/Chicago').format('dddd, MMM DD YYYY')} - {moment(this.currentDivision.end).tz('America/Chicago').format('dddd, MMM DD YYYY')}</span>
                      </div>
                    </Col>
                  </Row>
                  <Masonry className={"row"} options={masonryOptions}>

                    {classes.getClassMeetingDays().map((day) =>
                      <Col xs={12} sm={12} md={6} lg={6} key={day.id}>
                        <DashboardMediumGraph
                          title={`${moment().weekday(day.day).format('dddd')} Attendance`}
                          subtitle={'Past 8 weeks'}<commit_msg>check if current division exists<commit_after>import React, { Component } from 'react';
import moment from 'moment-timezone';
import momentFquarter from 'moment-fquarter';
import { observable } from 'mobx';
import { inject, observer } from 'mobx-react';
import { browserHistory } from 'react-router';
import Masonry from 'react-masonry-component';
import Card from 'material-ui/Card/Card';
import CardHeader from 'material-ui/Card/CardHeader';
import CardMedia from 'material-ui/Card/CardMedia';
import Avatar from 'material-ui/Avatar';
import List from 'material-ui/List/List';
import ListItem from 'material-ui/List/ListItem';
import Divider from 'material-ui/Divider';
import TextField from 'material-ui/TextField';
import DropDownMenu from 'material-ui/DropDownMenu';
import MenuItem from 'material-ui/MenuItem';
import ToolbarGroup from 'material-ui/Toolbar/ToolbarGroup';
import { Tabs, Tab } from 'material-ui/Tabs';
import { Grid, Row, Col } from 'react-bootstrap';
import DashboardMediumGraph from '../../components/DashboardMediumGraph';
import NavToolBar from '../../components/NavToolBar';
import RenderTeachers from '../../components/RenderTeachers';
import Async from '../../components/Async';

const styles = {
  headline: {
    fontSize: 24,
    paddingTop: 16,
    marginBottom: 12,
    fontWeight: 400,
  },
};
//let Masonry = MasonryCtl(React);

@inject('classes')
@observer
class Class extends Component {
  @observable cls;
  @observable yearId;
  @observable divisionClass;
  @observable currentDivision;
  @observable slideIndex = 'overview';
  @observable showYear = false;
  componentWillMount() {
    const { params } = this.props;
    const { classes } = this.props;
    this.cls = classes.getClass(params.classId);
    this.divisionClass = classes.getClassCurrentDivision(params.classId);
    this.currentDivision = (this.divisionClass) ? classes.getDivision(this.divisionClass.divisionId) : null;
    this.studentYearId = (this.currentDivision) ? classes.getClassGroupingYear(this.currentDivision.divisionYear).id : null;
    this.setState({
      masonryOptions: {},
    });
  }

  componentDidMount() {
  }

  getGraphAttendance(day, length) {
    const { params } = this.props;
    const { classes } = this.props;
    const attendance = classes.getClassAttendanceByDay(params.classId, day);
    const labels = attendance.map((day1) => moment.utc(day1.attendanceDate).tz('America/Chicago').format('MM/DD'));
    const series = attendance.map((day1) => parseInt(day1.count, 10));
    //console.log("graphAttendance", labels, series);
    return {
      labels,
      series: [series],
    };
  }

  navigate(path, e) {
    browserHistory.push(path);
  }

  formatDateRange(division) {
    return moment(division.start).format('MMM D YYYY') + ' - ' + moment(division.end).format('MMM D YYYY');
  }

  updateTitle(e) {
    const { classes } = this.props;
    const { params } = this.props;
    classes.db.updateCollectionFields('classes', params.classId, { title: e.target.value });
  }

  selectedYear = (event, selectedIndex, value) => {
    this.yearId = value;
    // console.log(menuItem);
  }

  changeTab = (index) => {
    this.slideIndex = index;
    this.showYear = (index === 'students' || index === 'teachers') ? true : false;
  }

  render() {
    const { params } = this.props;
    const { classes } = this.props;
    const { masonryOptions } = this.state;
    let lineChartOptions = {
      low: 0,
      showArea: true,
    };
    let retVal;
    if (this.cls) {
      retVal = (
        <Grid fluid>
          <Row>
            <Col xs={12} sm={12} md={12} lg={12}>
              <NavToolBar navLabel={this.cls.title} goBackTo="/classes" >
                <ToolbarGroup key={2} lastChild style={{ float: 'right' }}>
                  {this.showYear &&
                    <DropDownMenu
                      value={this.yearId}
                      onChange={this.selectedYear}
                      style={{ marginRight: '12px' }}
                    >
                      {this.currentDivision && classes.getClassGroupingYears(this.currentDivision.divisionConfigId).map((year) =>
                        <MenuItem key={year.id} value={year.id} label={moment(year.endDate).format('YYYY')} primaryText={moment(year.endDate).format('YYYY')} />
                      )}
                    </DropDownMenu>
                  }
                </ToolbarGroup>
              </NavToolBar>
            </Col>
          </Row>
          <Row>
            <Col xs={12} sm={12} md={12} lg={12}>
              <Tabs
                value={this.slideIndex}
                onChange={this.changeTab}
              >
                <Tab
                  label="Overview"
                  value={'overview'}
                >
                  <Row>
                    <Col xs={12} sm={12} md={12} lg={12}>
                      <div>
                        <span className="button">{(this.currentDivision) ? this.currentDivision.title : ''}</span> <br />
                        <span className="caption">
                          {(this.currentDivision) ? moment(this.currentDivision.start).tz('America/Chicago').format('dddd, MMM DD YYYY') : ''} -
                           {(this.currentDivision) ? moment(this.currentDivision.end).tz('America/Chicago').format('dddd, MMM DD YYYY') : ''}
                        </span>
                      </div>
                    </Col>
                  </Row>
                  <Masonry className={"row"} options={masonryOptions}>

                    {classes.getClassMeetingDays().map((day) =>
                      <Col xs={12} sm={12} md={6} lg={6} key={day.id}>
                        <DashboardMediumGraph
                          title={`${moment().weekday(day.day).format('dddd')} Attendance`}
                          subtitle={'Past 8 weeks'}
{'fraction_non_alphanumeric': 0.14263295553618136, 'fraction_numerical': 0.008718395815170008, 'mean_word_length': 2.344314868804665, 'pattern_counts': {'":': 0, '<': 63, '<?xml version=': 0, '>': 73, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1048111', 'n_tokens_mistral': 3462, 'n_tokens_neox': 3326, 'n_words': 672}