<commit_before>import React, { Component } from "react"
import { Link } from "react-router"

import {default as Select} from 'react-virtualized-select'
require('react-virtualized/styles.css')
require('react-select/dist/react-select.css')
require('react-virtualized-select/styles.css')

class ClassList extends Component {
    constructor(props) {
        super(props)
        this.checkItem = this.checkItem.bind(this)
    }

    componentDidMount() {
        this.unsubscribe = window.store.subscribe(() => this.forceUpdate())
    }

    componentWillUnmount() {
        this.unsubscribe()
    }

    checkItem(e) {
        const target = $(e['target'])
        const value = target.attr('value')

        window.store.dispatch({
            type: 'TOGGLE_COURSE',
            id: value
        })
    }

    render() {
        const items = this.props.items.map(item => {
            const d = item['course']['data']['info']
            const value = item['id']
            const title = `${d['Subject']} ${d['Catalog Number']}`
            const name = d['Course Title']
            const checked = item['selected']

            const url = `/class/${value.replace(' ', '-')}`

            return (
                <div key={value}>
                  <input type="checkbox" value={value}
                         checked={checked} onChange={this.checkItem}/>
                  <span>{title} -- {name}</span> <Link to={url}>(sections)</Link>
                </div>
            )
        })

        return (
            <div className="ClassList">
              <div> Classes </div>
              <div>
                {items}
              </div>
            </div>
        )
    }
}

export class ClassPicker extends Component {

    constructor(props) {
        super(props)
        this.updateOptions(window.data)
        this.onChange = this.onChange.bind(this)
    }

    componentDidMount() {
        this.unsubscribe = window.store.subscribe(() => this.forceUpdate())

        $('#generate').click(this.props.onGenerate)
    }

    componentWillUnmount() {
        this.unsubscribe()
    }

    onChange(val) {
        if(val == null) {
            return
        }

        window.store.dispatch({
            type: 'ADD_COURSE',
            course: val,
            id: val['value']
        })
    }

    updateOptions(data) {
        const options = []
        const rows = Object.keys(data)

        for(let i=0; i < rows.length; i += 1) {
            const d = data[rows[i]]['info']
            const title = `${d['Subject']} ${d['Catalog Number']}`
            const option = {value: rows[i], label: title, data: data[rows[i]]}
            options.push(option)
        }

        this.options = options
    }

    render() {
        const options = this.options
        var state = window.store.getState()

        return (
            <div className="ClassPicker">
              <Select value={undefined}
                      options={options}
                      onChange={this.onChange}
                      />
              <ClassList items={state.courses.picked}  />
              <button id="generate" type="button">Generate schedules!</button>
            </div>
        )
    }
}
<commit_msg>minor fix: use const instead of var<commit_after>import React, { Component } from "react"
import { Link } from "react-router"

import {default as Select} from 'react-virtualized-select'
require('react-virtualized/styles.css')
require('react-select/dist/react-select.css')
require('react-virtualized-select/styles.css')

class ClassList extends Component {
    constructor(props) {
        super(props)
        this.checkItem = this.checkItem.bind(this)
    }

    componentDidMount() {
        this.unsubscribe = window.store.subscribe(() => this.forceUpdate())
    }

    componentWillUnmount() {
        this.unsubscribe()
    }

    checkItem(e) {
        const target = $(e['target'])
        const value = target.attr('value')

        window.store.dispatch({
            type: 'TOGGLE_COURSE',
            id: value
        })
    }

    render() {
        const items = this.props.items.map(item => {
            const d = item['course']['data']['info']
            const value = item['id']
            const title = `${d['Subject']} ${d['Catalog Number']}`
            const name = d['Course Title']
            const checked = item['selected']

            const url = `/class/${value.replace(' ', '-')}`

            return (
                <div key={value}>
                  <input type="checkbox" value={value}
                         checked={checked} onChange={this.checkItem}/>
                  <span>{title} -- {name}</span> <Link to={url}>(sections)</Link>
                </div>
            )
        })

        return (
            <div className="ClassList">
              <div> Classes </div>
              <div>
                {items}
              </div>
            </div>
        )
    }
}

export class ClassPicker extends Component {

    constructor(props) {
        super(props)
        this.updateOptions(window.data)
        this.onChange = this.onChange.bind(this)
    }

    componentDidMount() {
        this.unsubscribe = window.store.subscribe(() => this.forceUpdate())

        $('#generate').click(this.props.onGenerate)
    }

    componentWillUnmount() {
        this.unsubscribe()
    }

    onChange(val) {
        if(val == null) {
            return
        }

        window.store.dispatch({
            type: 'ADD_COURSE',
            course: val,
            id: val['value']
        })
    }

    updateOptions(data) {
        const options = []
        const rows = Object.keys(data)

        for(let i=0; i < rows.length; i += 1) {
            const d = data[rows[i]]['info']
            const title = `${d['Subject']} ${d['Catalog Number']}`
            const option = {value: rows[i], label: title, data: data[rows[i]]}
            options.push(option)
        }

        this.options = options
    }

    render() {
        const options = this.options
        const state = window.store.getState()

        return (
            <div className="ClassPicker">
              <Select value={undefined}
                      options={options}
                      onChange={this.onChange}
                      />
              <ClassList items={state.courses.picked}  />
              <button id="generate" type="button">Generate schedules!</button>
            </div>
        )
    }
}

{'fraction_non_alphanumeric': 0.14124381188118812, 'fraction_numerical': 0.0006188118811881188, 'mean_word_length': 1.6792374637380854, 'pattern_counts': {'":': 0, '<': 43, '<?xml version=': 0, '>': 47, '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': '5583467', 'n_tokens_mistral': 1803, 'n_tokens_neox': 1761, 'n_words': 350}