import React, { Component } from 'react'; import { QUARTERS } from './classes'; interface QuarterPickerProps { onPick: (qtr: string) => any; // called when a quarter is picked } // Displays UI that allows the user to choose a quarter. export class QuarterPicker extends Component<QuarterPickerProps, {}> { render() { let buttons: any[] = []; for (let i = 0; i < QUARTERS.length; i++) { buttons.push( <div> <button type="button" className="btn btn-dark" onClick={evt => this.props.onPick(QUARTERS[i])}> {QUARTERS[i]} </button> </div>); } return <div>{buttons}</div>; // all buttons added as children } }