import React from 'react';
import { switchPokemonList } from '../actions/switchActions';


export default class Layout extends React.Component {
	handleClick (type) {
		this.props.dispatch(switchPokemonList(type));
	}

	render () {
		const gen1Class = this.props.activeType === 'gen1' ? 'btn-primary' : 'btn-success';
		const gen2Class = this.props.activeType === 'gen2' ? 'btn-primary' : 'btn-success';
		const rareClass = this.props.activeType === 'rare' ? 'btn-primary' : 'btn-success';
		const nearMeClass = this.props.activeType === 'nearMe' ? 'btn-primary' : 'btn-success';
		return (
            <div className="pokeSwitch row">
                <div className="col-md-3 col-sm-3 col-xs-6">
					<button type="button" className={'gen1 btn btn-block ' + gen1Class} onClick={this.handleClick.bind(this, 'gen1')}>Gen1</button>
				</div>
                <div className="col-md-3 col-sm-3 col-xs-6">
					<button type="button" className={'gen2 btn btn-block ' + gen2Class} onClick={this.handleClick.bind(this, 'gen2')}>Gen2</button>
				</div>
                <div className="col-md-3 col-sm-3 col-xs-6">
					<button type="button" className={'rare btn btn-block ' + rareClass} onClick={this.handleClick.bind(this, 'rare')}>Rare</button>
				</div>
                <div className="col-md-3 col-sm-3 col-xs-6">
					<button type="button" className={'nearMe btn btn-block ' + nearMeClass} onClick={this.handleClick.bind(this, 'nearMe')}>Near Me</button>
				</div>
            </div>
		);
	}
}

@@ -813,12 +813,82 @@
 ')%7D%3E
-Gen1
+%0A%09%09%09%09%09%09%3Ci className=%22fa fa-hand-pointer-o%22 aria-hidden=%22true%22/%3E Gen1%0A%09%09%09%09%09
 %3C/bu
@@ -1088,12 +1088,80 @@
 ')%7D%3E
-Gen2
+%0A%09%09%09%09%09%09%3Ci className=%22fa fa-hand-peace-o%22 aria-hidden=%22true%22/%3E Gen2%0A%09%09%09%09%09
 %3C/bu
@@ -1361,12 +1361,75 @@
 ')%7D%3E
-Rare
+%0A%09%09%09%09%09%09%3Ci className=%22fa fa-diamond%22 aria-hidden=%22true%22/%3E Rare%0A%09%09%09%09%09
 %3C/bu
@@ -1635,15 +1635,81 @@
 ')%7D%3E
+%0A%09%09%09%09%09%09%3Ci className=%22fa fa-crosshairs%22 aria-hidden=%22true%22/%3E 
 Near Me
+%0A%09%09%09%09%09
 %3C/bu

Switch button icons