62 lines
1.8 KiB
JavaScript
62 lines
1.8 KiB
JavaScript
import {BrowserRouter, Switch, Route} from "react-router-dom";
|
|
import React, {Fragment} from 'react';
|
|
import ReactDOM from 'react-dom';
|
|
|
|
import './styles/reset.css';
|
|
import './styles/main.scss';
|
|
import './styles/grid.scss';
|
|
import './styles/tabs.scss';
|
|
|
|
import {Nav} from "./components/Nav";
|
|
import {SearchBar} from "./components/SearchBar";
|
|
|
|
import {Search} from './views/Search';
|
|
import {ArtistView} from "./views/Artist";
|
|
import {DiscView} from "./views/Disc";
|
|
import {ReleaseView} from "./views/Release";
|
|
import {Recomended} from "./views/Recomended";
|
|
import {SongView} from "./views/Song";
|
|
|
|
const Main = (props) => {
|
|
const navigate = (query) => props.history.push(`/search?query=${query}`);
|
|
|
|
return (
|
|
<Fragment>
|
|
<h1>Busca la musica que te gusta!</h1>
|
|
<SearchBar history={props.history} onQueryChanged={navigate}/>
|
|
<Recomended/>
|
|
</Fragment>
|
|
)
|
|
}
|
|
|
|
const NoRoute = (props) => {
|
|
return (
|
|
<div>
|
|
<h1>Esa pagina no existe</h1>
|
|
<button className='link' onClick={() => props.history.goBack()}>Volver</button>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
const App = () => (
|
|
<main>
|
|
<BrowserRouter>
|
|
<Nav/>
|
|
<Switch>
|
|
<Route path='/search/:who?' component={Search}/>
|
|
<Route path='/artist/:mbid?' component={ArtistView}/>
|
|
<Route path='/disc/:mbid?' component={DiscView}/>
|
|
<Route path='/release/:mbid?' component={ReleaseView}/>
|
|
<Route path='/song/:mbid?' component={SongView}/>
|
|
<Route exact path='/' component={Main}/>
|
|
<Route path='*' component={NoRoute}/>
|
|
</Switch>
|
|
</BrowserRouter>
|
|
</main>
|
|
);
|
|
|
|
ReactDOM.render(
|
|
<App/>,
|
|
document.getElementById('root')
|
|
);
|