Feature: Class formation
  Scenario: Class has a teacher
    When a class is created
    Then the class must have one teacher

  Scenario: Class with no students
    When a class is created
    Then the class cannot have zero students

  Scenario: Class has more than one student
    When a class is created
    Then the class must have at least one student

  Scenario: Class has several students
    When a class is created
    Then the class can have several students

Feature: Teacher dealing with quizzes
  Scenario: Teacher create a quiz
    When a teacher create a quiz
    Then the quiz must belong to a class

  Scenario: Teacher assign a quiz
    When a quiz exists
    Then the quiz must be assigned to several students

Feature: Quiz creation
  Scenario: Quiz creation
    When a quiz is created
    Then the quiz must have at least one question

Feature: Question creation
  Scenario: Question creation
    When a question is created
    Then the question must have multiple choice

Feature: Quiz solving
  Scenario: Solving entire quiz
    When a student answers one question from a quiz with one question
    Then the quiz is finished

  Scenario: Solving partial quiz
    When a student answers one question from a quiz with two questions
    Then the quiz is not finished

  Scenario: Solve quiz correctly with one question
    When a student answers one question currectly from a quiz with one question
    Then the quiz grade is 10

  Scenario: Solve quiz correctly with multiple questions
    When a student answers two questions currectly from a quiz with two questions
    Then the quiz grade is 10

  Scenario: Solve quiz partially correct
    When a student answers one question currectly from a quiz with two questions
    Then the quiz grade is 5

  Scenario: Solve quiz partially incorrect
    When a student answers one question incurrectly from a quiz with two questions
    Then the quiz grade is 5

  Scenario: Solve quiz incorrectly
    When a student answers one question incurrectly from a quiz with one question
    Then the quiz grade is 0

Feature: Overall student grade
  Scenario: Student one quiz over the semester
    When a student has one quiz assigned to semester 2000.1
    And the student has grade 7 for this quiz
    Then the student grade is 7 for semester 2000.1

  Scenario: Student multiple quizzes over the semester
    When a student has two quizzes assigned to semester 2000.1
    And the student has grade 10 for the first quiz
    And the student has grade 8 for the second quiz
    Then the student grade is 9 for semester 2000.1

  Scenario: Student with quizzes spanning several semesters
    When a student has one quiz assigned to semester 2000.1
    And the student has another quiz assigned to semester 2000.2
    And the student has grade 9 for the first quiz
    And the student has grade 7 for the second quiz
    Then the student grade is 7 for semester 2000.2

/**
* This React class is intended to query an endpoint that will return an alphanumeric string, after clicking a button.
* This component is passed a prop "apiQueryDelay", which delays the endpoint request by N milliseconds. There is a 
* second button to disable this functionality and have the endpoint request run immediately after button click.
* This data is then to be displayed inside a simple container.
* The "queryAPI" XHR handler will return the endpoint response in the form of a Promise (such as axios, fetch).
* The response object will look like the following: {data: "A0B3HCJ"}
* The containing element ref isn't used, but should remain within the class.
* Please identify, correct and comment on any errors or bad practices you see in the React component class below.
* Additionally, please feel free to change the code style as you see fit.
* Please note - React version for this exercise is 15.5.4
*/

import React, { Component, Fragment } from 'react';
import queryAPI from 'queryAPI';

export default class extends Component {
  static displayName = 'ShowResultsFromAPI'

  static defaultProps = {
    apiQueryDelay: 0,
  }

  static propTypes = {
    apiQueryDelay: React.propTypes.number
  }

  constructor(props) {
    super(props);
    this.state = {
      apiQueryDelay: props.apiQueryDelay,
      data: '',
      error: false,
    };
  }

  onDisableDelay() {
    this.setState({ apiQueryDelay: 0 });
  }

  submitRequest() {
    setTimeout(() => this.fetchData(), this.state.apiQueryDelay);
  }

  async fetchData() {
    try {
      const response = await queryAPI();

      if (!response || !response.data) {
        throw new Error(`Response did not return any data. Response: ${response}`);
      }

      this.setState({
        data: response.data,
        error: false,
      });
    } catch (err) {
      console.error(err);
      this.setState({ error: true });
    }
  }

  render() {
    return (
      <Fragment>
        <div className="content-container" ref={(element) => { this.container = element; }} >
          {
            this.state.error ?
              <p>Sorry - there was an error with your request.</p> :
              <p>{this.state.data}</p>
          }
        </div>
        <button onClick={this.onDisableDelay.bind(this)}>Disable request delay</button>
        <button onClick={this.submitRequest.bind(this)}>Request data from endpoint</button>
      </Fragment>
    );
  }
}