import Inferno from 'inferno';
import Component from 'inferno-component';
import { Router, Route } from 'inferno-router';
import createBrowserHistory from 'history/createBrowserHistory';

const browserHistory = createBrowserHistory();

class App extends Component {
	constructor(props) {
		super(props);
	}
	render() {
		return (
			<Router history={ browserHistory }>
				<Route path="/" component={ Home }/>
				<Route path="/about" component={ Site }>
					<Route path="/features" component={ Features }/>
				</Route>
				<Route path="/:artist" component={ Artist }>
					<Route path="/:uri" component={ ArtistTrack }/>
				</Route>
			</Router>
		);
	}
}

class Home extends Component {
	constructor(props) {
		super(props);
	}
	render() {
		return (<div>Home</div>);
	}
}

class Site extends Component {
	constructor(props) {
		super(props);
	}
	render() {
		return (<div>Site {this.props.children}</div>);
	}
}

class Features extends Component {
	constructor(props) {
		super(props);
	}
	render() {
		return (<div>Features</div>);
	}
}

class Artist extends Component {
	constructor(props) {
		super(props);
	}
	render() {
		return (<div>Artist {this.props.children}</div>);
	}
}

class ArtistTrack extends Component {
	constructor(props) {
		super(props);
	}
	render() {
		return (<div>ArtistTrack</div>);
	}
}