import React from 'react';
import _ from 'lodash';
import Icon from './Icon';

class AccountBar extends React.Component {
	handleClick = (e) => {
		var currentTarget = e.currentTarget;

		this.props.setDisplayView(currentTarget.dataset.displayType);
	}

	render() {
		var props = this.props;

		var buttons = 'compact cozy comfortable'.split(' ').map(
			(item, index) => {
				var btnClassName = `btn btn-default ${props.config.view === item ? 'active' : ''}`;
				var iconClassName = `icon-monospaced display-${item}-icon`;

				return <a className={btnClassName} href="javascript:;" data-display-type={item} key={index} onClick={this.handleClick} title={_.capitalize(item)}>
					<Icon className={iconClassName} name="list-ul" />
				</a>;
			}
		);

		// console.log(this.props);

		return <div className="management-bar management-bar-default">
			<div className="container-fluid-1280 app-column">
				<div className="management-bar-header-right">
					{buttons}
				</div>
			</div>
		</div>;
	}
}

export default AccountBar;
@@ -751,39 +751,8 @@
 );%0A%0A
-%09%09// console.log(this.props);%0A%0A
 %09%09re
@@ -865,16 +865,248 @@
 olumn%22%3E%0A
+%09%09%09%09%3Cul className=%22management-bar-nav nav%22%3E%0A%09%09%09%09%09%3Cli%3E%0A%09%09%09%09%09%09%3Ca href=%22javascript:;%22 onClick=%7B(e) =%3E %7Bprops.loadPulls();%7D%7D%3E%0A%09%09%09%09%09%09%09%3CIcon className=%22icon-monospaced%22 name=%22reload%22 /%3E%0A%09%09%09%09%09%09%09Reload Pulls%0A%09%09%09%09%09%09%3C/a%3E%0A%09%09%09%09%09%3C/li%3E%0A%09%09%09%09%3C/ul%3E%0A
 %09%09%09%09%3Cdiv

Add ability to force reload the pulls