1
Fork 0

Added reverser to navbar

This commit is contained in:
Jake Howard 2016-01-20 18:51:47 +00:00
parent ae414a4a85
commit 87f3fb9882
2 changed files with 27 additions and 3 deletions

View file

@ -1,6 +1,30 @@
import React from 'react';
import Reverser from '../../helpers/reverser';
export default class Item extends React.Component {
constructor() {
super();
this.state = {
url: '#'
};
}
componentDidMount() {
if (!this.props.href && !this.props.ident) {
return;
}
if (this.props.href) {
this.setState({url: this.props.href});
} else {
Reverser(this.props.ident, this.props.args)
.then(function (url) {
this.setState({ url });
}.bind(this))
.catch(console.log);
}
}
render() {
let icon;
if (this.props.icon) {
@ -9,7 +33,7 @@ export default class Item extends React.Component {
);
}
return (
<li><a href={this.props.href}>{icon}{this.props.children}</a></li>
<li><a href={this.state.url}>{icon}{this.props.children}</a></li>
);
}
}

View file

@ -18,7 +18,7 @@ export default class NavBar extends React.Component {
</ul>
<ul className="nav navbar-nav" id="navigation">
<Dropdown title="Projects">
<Item href="#" icon="ion-social-freebsd-devil">Pithos</Item>
<Item ident="pages:projects" args={['pithos']} icon="ion-social-freebsd-devil">Pithos</Item>
<Item href="#" icon="ion-ios-monitor">BSOD Enabler</Item>
<Item href="#" icon="ion-chatbox-working">Hipchat Emoticons for All</Item>
<Item href="#" icon="ion-social-windows">Custom PC</Item>
@ -54,7 +54,7 @@ export default class NavBar extends React.Component {
</Dropdown>
<Item href="#">Links</Item>
<Dropdown title="About">
<Item href="#" icon="ion-android-person">Me</Item>
<Item ident="pages:about-me" icon="ion-android-person">Me</Item>
<Item href="#" icon="">Website</Item>
<Item href="#" icon="ion-android-contacts">Contact Me</Item>
</Dropdown>