{"size": 1039, "ext": "js", "max_stars_repo_path": "pattern-list-details-redux/src/components/SideBar/CityItem.js", "max_stars_repo_name": "nazrdogan/samples", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "pattern-list-details-redux/src/components/SideBar/CityItem.js", "max_issues_repo_name": "nazrdogan/samples", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "pattern-list-details-redux/src/components/SideBar/CityItem.js", "max_forks_repo_name": "nazrdogan/samples", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 22.5869565217, "max_line_length": 106, "alphanum_fraction": 0.6794995188}
import {connect} from 'react-redux';
import Divider from '@enact/moonstone/Divider';
import kind from '@enact/core/kind';
import PropTypes from 'prop-types';
import React from 'react';
import SelectableItem from '@enact/moonstone/SelectableItem';

const CityItem = kind({
	name: 'CityItem',

	propTypes: {
		city: PropTypes.string.isRequired,
		onCityChange: PropTypes.func.isRequired,
		selected: PropTypes.bool
	},

	render: ({city, onCityChange, selected, ...rest}) => {
		return (
			<div {...rest}>
				<SelectableItem
					onToggle={onCityChange}
					selected={selected}
					value={city}
				>
					{city}
				</SelectableItem>
				<Divider />
			</div>
		);
	}
});

const mapStateToProps = (state, ownProps) => {
	const country = state.country;
	const city = ownProps.city
		.split(' ')
		.join('')
		.toLowerCase();

	return city in state.data[country] ? {selected: state.data[country][city].selected} : {selected : false};
};

const CityItemContainer = connect(mapStateToProps, {})(CityItem);

export default CityItemContainer;
