Setup routing within App.js

This commit modifies App.js to use routing, such that it's possible to
navigate between a home screen, and the Artifact Editor.

Test plan: Run `yarn start`, and navigate between the home screen and
artifact editor. Verify that the artifact editor still works as
expected.
This commit is contained in:
Dandelion Mané 2018-05-08 12:23:38 -07:00
parent 0149d74971
commit 372f8f9bd6
1 changed files with 29 additions and 1 deletions

View File

@ -1,10 +1,38 @@
// @flow
import React from "react";
import {BrowserRouter as Router, Route, NavLink} from "react-router-dom";
import ArtifactEditor from "../plugins/artifact/editor/App";
export default class App extends React.Component<{}> {
render() {
return <ArtifactEditor />;
const ARTIFACT_EDITOR_ROUTE = "/plugins/artifact/editor";
return (
<Router>
<div>
<nav>
<ul>
<li>
<NavLink to="/">Home</NavLink>
</li>
<li>
<NavLink to={ARTIFACT_EDITOR_ROUTE}>Artifact Editor</NavLink>
</li>
</ul>
</nav>
<hr />
<Route exact path="/" component={Home} />
<Route path={ARTIFACT_EDITOR_ROUTE} component={ArtifactEditor} />
</div>
</Router>
);
}
}
const Home = () => (
<div>
<h1>Welcome to SourceCred! Please enjoy your stay.</h1>
</div>
);