import R from 'ramda';
import React from 'react';
import repeatString from 'lodash/repeat';

var unsplashURLForKeywords = R.pipe(R.ifElse(R.is(String), function (keywords) {
	return '/800x600?' + keywords;
}, R.always('/800x600?')), R.concat('https://source.unsplash.com'));

var UnsplashImage = React.createClass({
	displayName: 'UnsplashImage',
	getInitialState: function getInitialState() {
		return {
			refreshCount: 0
		};
	},
	onRefresh: function onRefresh() {
		this.setState(function (_ref) {
			var refreshCount = _ref.refreshCount;
			return {
				refreshCount: refreshCount + 1
			};
		});
	},
	render: function render() {
		var _props = this.props,
		    category = _props.category,
		    text = _props.text;
		var refreshCount = this.state.refreshCount;

		var url = '' + unsplashURLForKeywords(category) + repeatString(',', refreshCount);
		return React.createElement('img', { key: refreshCount, src: url, alt: text,
			style: { width: '100%', height: 'auto' },
			onClick: this.onRefresh
		});
	}
});

export default UnsplashImage;