Commit 4fbd3293 authored by Zach Osman's avatar Zach Osman
Browse files

Some good stuff

parent dc77cf01
Pipeline #3244 passed with stage
in 1 minute
...@@ -3,22 +3,18 @@ import ReactDOM from 'react-dom'; ...@@ -3,22 +3,18 @@ import ReactDOM from 'react-dom';
import { HashRouter, Route, Link } from 'react-router-dom'; import { HashRouter, Route, Link } from 'react-router-dom';
import { Button } from 'reactstrap'; import { Button } from 'reactstrap';
import { HomePage, AboutPage, NavBar } from 'Components'; import { HomePage, AboutPage, NavBar, PageTemplate } from 'Components';
import { Routes } from 'Utils';
const Dhaynes = () => <p>dhaynes</p>; // const App = () => (
// <PageTemplate>
const App = () => ( // <Routes />
<div> // </PageTemplate>
<NavBar /> // );
<Route path="/" exact component={HomePage} />
<Route path="/dhaynes" component={Dhaynes} />
<Route path="/about" component={AboutPage} />
</div>
);
ReactDOM.render( ReactDOM.render(
<HashRouter> <HashRouter>
<App /> <Routes />
</HashRouter>, </HashRouter>,
document.getElementById('root') document.getElementById('root')
); );
import React from 'react'; import React from 'react';
import { import { Navbar, NavbarBrand, Nav, NavItem, NavLink } from 'reactstrap';
Collapse,
Navbar,
NavbarToggler,
NavbarBrand,
Nav,
NavItem,
NavLink,
UncontrolledDropdown,
DropdownToggle,
DropdownMenu,
DropdownItem,
} from 'reactstrap';
export default class NavBar extends React.Component { export default class NavBar extends React.Component {
constructor(props) {
super(props);
this.toggle = this.toggle.bind(this);
this.state = {
isOpen: false,
};
}
toggle() {
this.setState({
isOpen: !this.state.isOpen,
});
}
render() { render() {
return ( return (
<div> <div>
<Navbar color="light" light expand="md"> <Navbar color="dark" dark expand="md">
<NavbarBrand href="/">Go</NavbarBrand> <NavbarBrand href="#">Go</NavbarBrand>
<NavbarToggler onClick={this.toggle} />
<Collapse isOpen={this.state.isOpen} navbar> <Nav className="ml-auto" navbar>
<Nav className="ml-auto" navbar> <NavItem>
<NavItem> <NavLink href="#/dhaynes" active={this.props.page == 'dhaynes'}>
<NavLink href="#/dhaynes">Dhaynes</NavLink> Dhaynes
</NavItem> </NavLink>
<NavItem> </NavItem>
<NavLink href="#/about">About</NavLink> <NavItem>
</NavItem> <NavLink href="#/about" active={this.props.page == 'about'}>
</Nav> About
</Collapse> </NavLink>
</NavItem>
</Nav>
</Navbar> </Navbar>
</div> </div>
); );
......
import React from 'react'; import React from 'react';
import { PageTemplate } from 'Components';
export default class AboutPage extends React.Component { export default class AboutPage extends React.Component {
state = {}; state = {};
render() { render() {
return ( return (
<div> <PageTemplate page={'about'}>
<p>About page</p> <p>About page</p>
</div> </PageTemplate>
); );
} }
} }
import React from 'react';
import { PageTemplate } from 'Components';
export default class DhaynesPage extends React.Component {
state = {};
render() {
return (
<PageTemplate page={'dhaynes'}>
<h2>DAVID HAYNES</h2>
</PageTemplate>
);
}
}
import React from 'react'; import React from 'react';
import { PageTemplate } from 'Components';
export default class HomePage extends React.Component { export default class HomePage extends React.Component {
state = {}; state = {};
render() { render() {
return ( return (
<div> <PageTemplate page={'home'}>
<p>Hello World! 1</p> <p>Hello World! 1</p>
</div> </PageTemplate>
); );
} }
} }
import HomePage from './HomePage'; import HomePage from './HomePage';
import AboutPage from './AboutPage'; import AboutPage from './AboutPage';
import DhaynesPage from './DhaynesPage';
export { HomePage, AboutPage }; export { HomePage, AboutPage, DhaynesPage };
...@@ -5,8 +5,8 @@ import { NavBar } from 'Components'; ...@@ -5,8 +5,8 @@ import { NavBar } from 'Components';
export default class PageTemplate extends React.Component { export default class PageTemplate extends React.Component {
render() { render() {
return ( return (
<div style={[styles.container, this.props.style]}> <div>
<NavBar /> <NavBar page={this.props.page} />
<div>{this.props.children}</div> <div>{this.props.children}</div>
</div> </div>
); );
......
import { PageTemplate } from './Templates'; import { PageTemplate } from './Templates';
import { HomePage, AboutPage } from './Pages'; import { HomePage, AboutPage, DhaynesPage } from './Pages';
import { NavBar } from './Organisms'; import { NavBar } from './Organisms';
export { export {
...@@ -8,6 +8,7 @@ export { ...@@ -8,6 +8,7 @@ export {
//Pages //Pages
HomePage, HomePage,
AboutPage, AboutPage,
DhaynesPage,
//Organisms //Organisms
NavBar, NavBar,
}; };
import React from 'react';
import { Route } from 'react-router-dom';
import { HomePage, AboutPage, DhaynesPage } from 'Components';
const Routes = () => (
<div>
<Route path="/" exact component={HomePage} />
<Route path="/dhaynes" component={DhaynesPage} />
<Route path="/about" component={AboutPage} />
</div>
);
export default Routes;
import Routes from './Routes';
export { Routes };
...@@ -2,15 +2,15 @@ ...@@ -2,15 +2,15 @@
"name": "go", "name": "go",
"version": "3.0", "version": "3.0",
"description": "University-branded URL shortening", "description": "University-branded URL shortening",
"main": "index.js", "main": "App.js",
"repository": "git@git.gmu.edu:srct/go.git", "repository": "git@git.gmu.edu:srct/go.git",
"author": "Mason SRCT", "author": "Mason SRCT",
"license": "Apache-2.0", "license": "Apache-2.0",
"private": false, "private": false,
"scripts": { "scripts": {
"start": "yarn dev", "start": "yarn dev",
"dev": "webpack --mode development ./go/go_ahead/src/index.js --output ./go/static/main.js --watch", "dev": "webpack --mode development ./go/go_ahead/src/App.js --output ./go/static/main.js --watch",
"build": "webpack --mode production ./project/frontend/src/index.js --output ./go/static/main.js" "build": "webpack --mode production ./project/frontend/src/App.js --output ./go/static/main.js"
}, },
"babel": { "babel": {
"presets": [ "presets": [
......
...@@ -14,6 +14,7 @@ module.exports = { ...@@ -14,6 +14,7 @@ module.exports = {
extensions: ['*', '.js', '.jsx'], extensions: ['*', '.js', '.jsx'],
alias: { alias: {
Components: path.resolve(__dirname, './go/go_ahead/src/Components'), Components: path.resolve(__dirname, './go/go_ahead/src/Components'),
Utils: path.resolve(__dirname, './go/go_ahead/src/Utils'),
}, },
}, },
}; };
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment