SectionList.tsx 1.97 KB
Newer Older
Zac Wood's avatar
Zac Wood committed
1 2 3 4 5
import * as React from 'react';
import Section from '../section';

interface Props {
    sections: Section[];
6
    selectSectionCallback?: (section: Section) => void;
Zac Wood's avatar
Zac Wood committed
7 8 9 10 11 12
}

export default class SectionList extends React.Component<Props, any> {
    render() {
        return (
            <table>
13 14 15 16 17 18 19 20 21 22 23 24 25
                <tbody>
                    <tr>
                        <th>Course</th>
                        <th>Section Name</th>
                        <th>CRN</th>
                        <th>Days</th>
                        <th>Instructor</th>
                        <th>Location</th>
                        <th>Time</th>
                        <th />
                    </tr>
                    {this.renderRowsForSections(this.props.sections)}
                </tbody>
Zac Wood's avatar
Zac Wood committed
26 27 28 29 30 31 32
            </table>
        );
    }

    renderRowsForSections(sections: Section[]): JSX.Element[] {
        return sections.map(section => {
            return (
33
                <tr key={section.id}>
Zac Wood's avatar
Zac Wood committed
34 35 36 37 38 39 40
                    <td>{section.name}</td>
                    <td>{section.title}</td>
                    <td>{section.crn}</td>
                    <td>{section.days}</td>
                    <td>{section.instructor}</td>
                    <td>{section.location}</td>
                    <td>{[section.startTime, section.endTime].join(' - ')}</td>
41
                    {this.renderSelectSectionColumn(section.crn)}
Zac Wood's avatar
Zac Wood committed
42 43 44 45
                </tr>
            );
        });
    }
46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62

    renderSelectSectionColumn(rowCRN: string): JSX.Element {
        if (this.props.selectSectionCallback) {
            const sectionWithCRN = this.getSectionWithCRN(rowCRN);
            return (
                <td>
                    <button onClick={() => this.props.selectSectionCallback(sectionWithCRN)}>Add to schedule</button>
                </td>
            );
        } else {
            return <td />;
        }
    }

    getSectionWithCRN(crn: string): Section {
        return this.props.sections.find(section => section.crn === crn);
    }
Zac Wood's avatar
Zac Wood committed
63
}