aretherecookies-mobile/js/modals/RadiusModal.js

// @flow
import React from 'react';
import FullScreenModal from './FullScreenModal';
import PickerItemRow from '../components/PickerItemRow';
import { compose } from 'ramda';

export const CHOICES = [5, 10, 15, 20, 25, 30];

type Props = {
	onClose: () => void,
	onUpdate: (o: CHOICES) => void,
	radius: CHOICES,
};

export const RadiusModal = ({ onUpdate, onClose, radius: currentRadius }: Props) => {
	const onPress = compose(
		onClose,
		onUpdate
	);

	return (
		<FullScreenModal title="Sort" onClose={onClose}>
			{CHOICES.map(radius => (
				<PickerItemRow
					key={radius}
					isSelected={currentRadius === radius}
					text={`${radius} miles`}
					onPress={() => onPress(radius)}
				/>
			))}
		</FullScreenModal>
	);
};

export default RadiusModal;