<commit_before>import React from 'react'
import {Route, RouteHandler, Link} from 'react-router'
import LessonData from './LessonData'
import StudentData from './StudentData'
import DatePicker from 'react-datepicker'
import moment from 'moment'
import api from '../../../../utils/api';
require('react-datepicker/dist/react-datepicker.css');
import {Button, Card, Row, Col} from 'react-materialize';


class ClassData extends React.Component {
  constructor(props){
    super(props);
    
    this.state = {
      className : '',
      classId: this.props.params.classId,
      classLessons: [],
      classStudents: [],
      studentPolls: [],
      lessonPolls: [],
      
      displayLessons: true,
      displayStudents: false,
      newLessonName: '',
      newLessonDate: moment(),
      
      newStudent: '',
      studentError: ''
    };
  }

  render(){
    return (
      <div>

        <h2 style={{color: '#03A9F4'}} >{this.state.className}</h2>
        <ul>
          <li onClick={() => this.setState({
            displayLessons: true,
            displayStudents: false,
          })} style={{
            cursor: 'default',
            }}>Lessons</li>

          <li onClick={this.switchToStudentsView.bind(this)} style={{cursor: 'default'}}>Students</li>
        </ul>
        
        <Lessons 
          newLessonDate={this.state.newLessonDate}
          newLessonName={this.state.newLessonName} 
          addLesson={this.addLesson.bind(this)}
          handleLessonClick={this.handleLessonClick}
          changeNewLessonName={this.changeNewLessonName.bind(this)}
          changeDate={this.changeDate.bind(this)} 
          lessons={this.state.classLessons} 
          display={this.state.displayLessons} 
          classId={this.state.classId}/>

        <Students 
          students={this.state.classStudents} 
          display={this.state.displayStudents} 
          classId={this.state.classId}
          handleStudentClick={this.handleStudentClick}
          addStudent={this.addStudent.bind(this)}
          newStudent={this.state.newStudent}
          changeNewStudent={this.changeNewStudent.bind(this)}
          />
      </div>
    )
  }

  componentWillMount(){
    api.getClassName(this.state.classId)
    .then((response) => {
      if(response.status === 200) {
        response.json().then((response) => {
          this.setState({
            className: response.name
          });
          api.getClassLessonsData(this.state.classId)
          .then((response) => {
            if(response.status === 400){
              this.setState({
                 error: 'Data forbidden',
                 isLoading: false
               });
              console.error(this.state.error);
            } else if (response.status === 200) {
              response.json().then((response) => {
               console.log("Class lessons from DB:", response);   
                this.setState({
                  classLessons: response,
                  error: false,
                  isLoading: false
                });
              });
            }
          });
        });
      }
    })
  }

  changeDate(newDate){
    this.setState({
      newLessonDate: newDate
    });
  }

  changeNewLessonName(lesson){
    this.setState({
      newLessonName: lesson,
    })
  }

  switchToStudentsView() {
    this.setState({
      displayStudents: true,
      displayLessons: false,
      isLoading: true,
    });
    api.getClassStudentsData(this.state.classId)
    .then((response) => {
      if(response.status === 400){
        this.setState({
           error: 'Data forbidden',
           isLoading: false
         });
        console.error(this.state.error);
      } else if (response.status === 200) {
        response.json().then((response) => {
         console.log("Class students from DB:", response);   
          this.setState({
            classStudents: response,
            error: false,
            isLoading: false
          });
        });
      }
    });
  }

  handleLessonClick(e) {
    console.log(e)
  }

  handleStudentClick(e) {
    console.log(e)
  }

  addLesson(e){
    e.preventDefault();
    // update state with new list item
    if(!!this.state.newLessonName.trim()){
      var newLessonName = this.state.newLessonName.trim();
      var lessonsCopy = this.state.lessons.slice();
      var newLessonDate = this.state.newLessonDate;

      // TODO: push to DB, return lesson object and push it to lessonsCopy
      // on a .then()

      api.addLesson(this.state.classId, newLessonName, newLessonDate)
      .then((response) => {
        if(response.status === 500){
          this.setState({
             error: 'Lesson could not be added',
             isLoading: false
           });
          console.log(this.state.error);
        } else if (response.status === 200) {
          response.json().then((response) => {
           console.log("ADDED LESSON = ", response);   
           var lessonsCopy = this.state.lessons.slice();
           lessonsCopy.push(response);

            this.setState({
              lessons: lessonsCopy,
              newLessonName: '',
              error: false,
              isLoading: false
            });
          });
        }
      });
      
      this.setState({
        lessons: lessonsCopy,
        newLessonName: ''
      });
    }
  }

  changeNewStudent(student){<commit_msg>Update state.studentError if student was already in class<commit_after>import React from 'react'
import {Route, RouteHandler, Link} from 'react-router'
import LessonData from './LessonData'
import StudentData from './StudentData'
import DatePicker from 'react-datepicker'
import moment from 'moment'
import api from '../../../../utils/api';
require('react-datepicker/dist/react-datepicker.css');
import {Button, Card, Row, Col} from 'react-materialize';


class ClassData extends React.Component {
  constructor(props){
    super(props);
    
    this.state = {
      className : '',
      classId: this.props.params.classId,
      classLessons: [],
      classStudents: [],
      studentPolls: [],
      lessonPolls: [],
      
      displayLessons: true,
      displayStudents: false,
      newLessonName: '',
      newLessonDate: moment(),
      
      newStudent: '',
      studentError: ''
    };
  }

  render(){
    return (
      <div>

        <h2 style={{color: '#03A9F4'}} >{this.state.className}</h2>
        <ul>
          <li onClick={() => this.setState({
            displayLessons: true,
            displayStudents: false,
          })} style={{
            cursor: 'default',
            }}>Lessons</li>

          <li onClick={this.switchToStudentsView.bind(this)} style={{cursor: 'default'}}>Students</li>
        </ul>
        
        <Lessons 
          newLessonDate={this.state.newLessonDate}
          newLessonName={this.state.newLessonName} 
          addLesson={this.addLesson.bind(this)}
          handleLessonClick={this.handleLessonClick}
          changeNewLessonName={this.changeNewLessonName.bind(this)}
          changeDate={this.changeDate.bind(this)} 
          lessons={this.state.classLessons} 
          display={this.state.displayLessons} 
          classId={this.state.classId}/>

        <Students 
          students={this.state.classStudents} 
          display={this.state.displayStudents} 
          classId={this.state.classId}
          handleStudentClick={this.handleStudentClick}
          addStudent={this.addStudent.bind(this)}
          newStudent={this.state.newStudent}
          changeNewStudent={this.changeNewStudent.bind(this)}
          />
      </div>
    )
  }

  componentWillMount(){
    api.getClassName(this.state.classId)
    .then((response) => {
      if(response.status === 200) {
        response.json().then((response) => {
          this.setState({
            className: response.name
          });
          api.getClassLessonsData(this.state.classId)
          .then((response) => {
            if(response.status === 400){
              this.setState({
                 error: 'Data forbidden',
                 isLoading: false
               });
              console.error(this.state.error);
            } else if (response.status === 200) {
              response.json().then((response) => {
               console.log("Class lessons from DB:", response);   
                this.setState({
                  classLessons: response,
                  error: false,
                  isLoading: false
                });
              });
            }
          });
        });
      }
    })
  }

  changeDate(newDate){
    this.setState({
      newLessonDate: newDate
    });
  }

  changeNewLessonName(lesson){
    this.setState({
      newLessonName: lesson,
    })
  }

  switchToStudentsView() {
    this.setState({
      displayStudents: true,
      displayLessons: false,
      isLoading: true,
    });
    api.getClassStudentsData(this.state.classId)
    .then((response) => {
      if(response.status === 400){
        this.setState({
           error: 'Data forbidden',
           isLoading: false
         });
        console.error(this.state.error);
      } else if (response.status === 200) {
        response.json().then((response) => {
         console.log("Class students from DB:", response);   
          this.setState({
            classStudents: response,
            error: false,
            isLoading: false
          });
        });
      }
    });
  }

  handleLessonClick(e) {
    console.log(e)
  }

  handleStudentClick(e) {
    console.log(e)
  }

  addLesson(e){
    e.preventDefault();
    // update state with new list item
    if(!!this.state.newLessonName.trim()){
      var newLessonName = this.state.newLessonName.trim();
      var lessonsCopy = this.state.lessons.slice();
      var newLessonDate = this.state.newLessonDate;

      // TODO: push to DB, return lesson object and push it to lessonsCopy
      // on a .then()

      api.addLesson(this.state.classId, newLessonName, newLessonDate)
      .then((response) => {
        if(response.status === 500){
          this.setState({
             error: 'Lesson could not be added',
             isLoading: false
           });
          console.log(this.state.error);
        } else if (response.status === 200) {
          response.json().then((response) => {
           console.log("ADDED LESSON = ", response);   
           var lessonsCopy = this.state.lessons.slice();
           lessonsCopy.push(response);

            this.setState({
              lessons: lessonsCopy,
              newLessonName: '',
              error: false,
              isLoading: false,
              studentError: response.created
            });
          });
        }
      });
      
      this.setState({
        lessons: lessonsCopy,
        newLessonName: ''
      });
    }
  }

  changeNewStudent(student){
{'fraction_non_alphanumeric': 0.1318843249217167, 'fraction_numerical': 0.004973291582243507, 'mean_word_length': 1.87123215230037, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 45, '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': '6615294', 'n_tokens_mistral': 3124, 'n_tokens_neox': 3037, 'n_words': 534}