aretherecookies-mobile/js/modals/OrderByModal.js

// @flow
import React, { PureComponent } from 'react';
import FullScreenModal from './FullScreenModal';
import PickerItemRow from '../components/PickerItemRow';
import { getOrderbyText } from '../helpers/OrderByHelpers';
import { ORDER_BY } from '../constants/OrderByConstants';
import { type OrderBy } from '../constants/OrderByConstants';

type Props = {
	onClose: () => void,
	onUpdate: (o: OrderBy) => void,
	orderBy: OrderBy,
};

class OrderByModal extends PureComponent {
	static displayName = 'OrderByModal';

	props: Props;

	updateAndClose = (item: string) => {
		this.props.onUpdate(item);
		this.props.onClose();
	};

	render() {
		const { onClose, orderBy: currentOrderBy } = this.props;

		return (
			<FullScreenModal title="Sort" onClose={onClose}>
				{ORDER_BY.map(orderBy => (
					<PickerItemRow
						key={orderBy}
						isSelected={currentOrderBy === orderBy}
						text={getOrderbyText(orderBy)}
						onPress={() => this.updateAndClose(orderBy)}
					/>
				))}
			</FullScreenModal>
		);
	}
}

export default OrderByModal;