import React from 'react'
import {
  TimeInterval,
  timeIntervals,
  timeIntervalStringShort,
} from '../types/TimeInterval'
import { Selector } from './Selector'

/*
 * Select one of the time intervals from a set of options
 */
export const TimeIntervalSelector: React.FC<{
  selectedTimeInterval: TimeInterval
  onSelectTimeInterval: (timeInterval: TimeInterval) => void
}> = ({ selectedTimeInterval, onSelectTimeInterval }) => {
  return (
    <Selector
      options={timeIntervals}
      selectedOption={selectedTimeInterval}
      onSelect={onSelectTimeInterval}
      labelExtractor={(timeInterval) => timeIntervalStringShort[timeInterval]}
      keyExtractor={(timeInterval) => timeInterval}
    />
  )
}
