diff options
author | 2018-03-15 16:12:24 +0300 | |
---|---|---|
committer | 2023-01-13 10:37:52 +0300 | |
commit | a87c3fcaafc8c839ae1263f84502634ef61081ec (patch) | |
tree | eaac74b23d924248f4104749370a50a123c8acfa /vnext/src/app.js | |
parent | 60e2fe05bd65480ac175378d5bb6cc903b8b1132 (diff) |
switch to react-router
Diffstat (limited to 'vnext/src/app.js')
-rw-r--r-- | vnext/src/app.js | 51 |
1 files changed, 32 insertions, 19 deletions
diff --git a/vnext/src/app.js b/vnext/src/app.js index 1991a14d..82209e45 100644 --- a/vnext/src/app.js +++ b/vnext/src/app.js @@ -1,37 +1,50 @@ import React from "react" import ReactDOM from "react-dom" -import createHistory from 'history/createBrowserHistory'; -const history = createHistory(); +import { BrowserRouter as Router, Route, Link } from "react-router-dom" -import Navigation from "./components/Navigation" import Discover from "./components/Discover" import Post from "./components/Post" class App extends React.Component { constructor(props) { - super(props) - this.navigate = this.navigate.bind(this); + super(props); this.state = { - location: history.location + visitor: { uid: 0 } } } render() { return ( - <div className="wrapper"> - <Navigation onNavigate={this.navigate} /> - { location.pathname === "/" && - <Discover params={this.state.location.search} /> } - { location.pathname === "/post" && - <Post /> } - </div> + <Router> + <div className="wrapper"> + <header> + <div id="header_wrapper"> + <div id="logo"><Link to="/">Juick</Link></div> + <nav id="global"> + <ul> + {this.state.visitor.uid ? + <li><Link to="/?show=discuss"><i data-icon="ei-comment" data-size="s"></i>Discuss</Link></li> + : + <li><Link to="/?show=photos" rel="nofollow"><i data-icon="ei-camera" data-size="s"></i>Photos</Link></li> + } + <li><Link to="/?show=all" rel="nofollow"><i data-icon="ei-search" data-size="s"></i>Discover</Link></li> + <li><Link to="post" href="/post"><i data-icon="ei-pencil" data-size="s"></i>Post</Link> + </li> + </ul> + </nav> + <div id="search"> + <form action="/"> + <input name="search" className="text" + placeholder="Search..." /> + </form> + </div> + </div> + </header> + <Route exact path="/" component={Discover} /> + <Route path="/post" component={Post} /> + </div> + </Router> ) - } - navigate(location) { - console.log(location); - history.push(location); - this.setState({location: location}) } - } |