<commit_before>import { React, PropTypes, action, withRouter } from 'vendor';
import { Button, Card } from 'react-bootstrap';
import { SpyMode } from 'shared';
import Router from '../../helpers/router';
import LoadableItem from '../../components/loadable-item';
import { isEmpty } from 'lodash';
import * as PerformanceForecast from '../../flux/performance-forecast';
import PerformanceForecastColorKey from '../../screens/performance-forecast/color-key';
import Section from '../../screens/performance-forecast/section';
import PracticeWeakestButton from '../../components/buttons/practice-weakest';

// Number of sections to display
const NUM_SECTIONS = 4;

// eslint-disable-next-line react/prefer-stateless-function
class ProgressGuide extends React.Component {

  static propTypes = {
    courseId: PropTypes.oneOfType([
      PropTypes.string,
      PropTypes.number,
    ]).isRequired,
  };

  render() {
    const { courseId } = this.props;
    const sections = PerformanceForecast.Helpers.recentSections(
      PerformanceForecast.Student.store.getAllSections(courseId)
    );

    return (
      <Card className="progress-guide">
        <h2>
          Performance Forecast
        </h2>
        <h3 className="recent">
          Recent topics
        </h3>
        <div className="guide-group">
          <div className="chapter-panel">
            {sections.map((section, i) =>
              <Section key={i} section={section} canPractice={true} {...this.props} />)}
          </div>
        </div>
        <PerformanceForecastColorKey />
      </Card>
    );
  }
}

@withRouter
class ProgressGuideCards extends React.Component {

  static propTypes = {
    courseId: PropTypes.string.isRequired,
    history: PropTypes.object.isRequired,
  }

  @action.bound viewPerformanceForecast() {
    return this.props.history.push(
      Router.makePathname('viewPerformanceGuide', this.props)
    );
  }

  renderEmpty(sections) {
    return (
      <Card className="progress-guide empty">
        <div className="actions-box">
          <h2>
            Performance Forecast
          </h2>
          <p>
            The performance forecast is an estimate of your
            current understanding of a topic.
            It is a personalized display based on your answers
            to reading questions, homework problems,
            and previous practices.
          </p>
          <p>
            This area will fill in with topics as you
            complete your assignments
          </p>
          <SpyMode.Content>
            <ul>
              <li>
                {sections.length} sections were returned
                by the performance forecast
              </li>
              {sections.map((section) =>
                <li>
                  {section.chapter_section.asString}
                  {' section.title'}<commit_msg>add key to progress guide sections<commit_after>import { React, PropTypes, action, withRouter } from 'vendor';
import { Button, Card } from 'react-bootstrap';
import { SpyMode } from 'shared';
import Router from '../../helpers/router';
import LoadableItem from '../../components/loadable-item';
import { isEmpty } from 'lodash';
import * as PerformanceForecast from '../../flux/performance-forecast';
import PerformanceForecastColorKey from '../../screens/performance-forecast/color-key';
import Section from '../../screens/performance-forecast/section';
import PracticeWeakestButton from '../../components/buttons/practice-weakest';

// Number of sections to display
const NUM_SECTIONS = 4;

// eslint-disable-next-line react/prefer-stateless-function
class ProgressGuide extends React.Component {

  static propTypes = {
    courseId: PropTypes.oneOfType([
      PropTypes.string,
      PropTypes.number,
    ]).isRequired,
  };

  render() {
    const { courseId } = this.props;
    const sections = PerformanceForecast.Helpers.recentSections(
      PerformanceForecast.Student.store.getAllSections(courseId)
    );

    return (
      <Card className="progress-guide">
        <h2>
          Performance Forecast
        </h2>
        <h3 className="recent">
          Recent topics
        </h3>
        <div className="guide-group">
          <div className="chapter-panel">
            {sections.map((section, i) =>
              <Section key={i} section={section} canPractice={true} {...this.props} />)}
          </div>
        </div>
        <PerformanceForecastColorKey />
      </Card>
    );
  }
}

@withRouter
class ProgressGuideCards extends React.Component {

  static propTypes = {
    courseId: PropTypes.string.isRequired,
    history: PropTypes.object.isRequired,
  }

  @action.bound viewPerformanceForecast() {
    return this.props.history.push(
      Router.makePathname('viewPerformanceGuide', this.props)
    );
  }

  renderEmpty(sections) {
    return (
      <Card className="progress-guide empty">
        <div className="actions-box">
          <h2>
            Performance Forecast
          </h2>
          <p>
            The performance forecast is an estimate of your
            current understanding of a topic.
            It is a personalized display based on your answers
            to reading questions, homework problems,
            and previous practices.
          </p>
          <p>
            This area will fill in with topics as you
            complete your assignments
          </p>
          <SpyMode.Content>
            <ul>
              <li>
                {sections.length} sections were returned
                by the performance forecast
              </li>
              {sections.map((section) =>
                <li key={section.chapter_section.join('.')}>
                  {section.chapter_section.join('.')}
                  {' section.title'}
{'fraction_non_alphanumeric': 0.11425104022191401, 'fraction_numerical': 0.0024271844660194173, 'mean_word_length': 2.2067815453029462, 'pattern_counts': {'":': 0, '<': 53, '<?xml version=': 0, '>': 57, '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': '5040157', 'n_tokens_mistral': 1551, 'n_tokens_neox': 1498, 'n_words': 387}