Refactor and clean up Link component

This commit is contained in:
Alex Liebowitz 2017-01-08 23:56:21 -05:00
parent 1e61af3b24
commit d067a6e006

View file

@ -5,25 +5,44 @@ import {Icon, ToolTip} from './common.js';
export let Link = React.createClass({ export let Link = React.createClass({
propTypes: {
label: React.PropTypes.string,
icon: React.PropTypes.string,
button: React.PropTypes.string,
badge: React.PropTypes.string,
hidden: React.PropTypes.bool,
},
getDefaultProps: function() {
return {
hidden: false,
disabled: false,
};
},
handleClick: function() { handleClick: function() {
if (this.props.onClick) { if (this.props.onClick) {
this.props.onClick(); this.props.onClick();
} }
}, },
render: function() { render: function() {
var href = this.props.href ? this.props.href : 'javascript:;', if (this.props.hidden) {
icon = this.props.icon ? <Icon icon={this.props.icon} fixed={true} /> : '', return null;
className = (this.props.className ? this.props.className : '') + }
(this.props.button ? ' button-block button-' + this.props.button : '') +
(this.props.hidden ? ' hidden' : '') + const className = (this.props.className || '') +
(this.props.disabled ? ' disabled' : ''); (this.props.button ? ' button-block button-' + this.props.button : '') +
(!this.props.className && !this.props.button ? 'button-text' : '') +
(this.props.disabled ? ' disabled' : '');
return ( return (
<a className={className ? className : 'button-text'} href={href} style={this.props.style ? this.props.style : {}} <a className={className} href={this.props.href || 'javascript:;'} title={this.props.title}
title={this.props.title} onClick={this.handleClick}> onClick={this.handleClick} {... 'style' in this.props ? {style: this.props.style} : {}}>
{this.props.icon ? icon : '' } {'icon' in this.props
? <Icon icon={this.props.icon} fixed={true} />
: null}
<span className="link-label">{this.props.label}</span> <span className="link-label">{this.props.label}</span>
{this.props.badge ? <span className="badge">{this.props.badge}</span> : '' } {'badge' in this.props
? <span className="badge">{this.props.badge}</span>
: null}
</a> </a>
); );
} }