Commit 20bd3bab authored by David Haynes's avatar David Haynes 🙆

Finish merge

- Also Prettier things up
parent 70fcd31c
Pipeline #3458 passed with stage
in 53 seconds
import React from 'react'; import React from "react";
import ReactDOM from 'react-dom'; import ReactDOM from "react-dom";
import { HashRouter, Route, Link } from 'react-router-dom'; import { HashRouter, Route, Link } from "react-router-dom";
import { Routes } from 'Utils'; import { Routes } from "Utils";
// Apply Global Masonstrap styling // Apply Global Masonstrap styling
import 'masonstrap/build/css/masonstrap.min.css'; import "masonstrap/build/css/masonstrap.min.css";
import 'masonstrap/build/js/masonstrap.min.js'; import "masonstrap/build/js/masonstrap.min.js";
ReactDOM.render( ReactDOM.render(
<HashRouter> <HashRouter>
<Routes /> <Routes />
</HashRouter>, </HashRouter>,
document.getElementById('root') document.getElementById("root")
); );
import React from "react";
import { Button } from "reactstrap";
class AuthButton extends React.Component {
constructor(props) {
super(props);
this.state = { error: null, is_auth: false };
}
componentDidMount() {
fetch("/auth/status")
.then(res => res.json())
.then(
result => {
this.setState({
is_auth: result.is_authenticated
});
},
error => {
this.setState({
error
});
}
);
}
render() {
const { is_auth, error } = this.state;
if (error) {
return <div>Error: {error.message}</div>;
} else {
return (
<div>
{is_auth ? (
<Button color="info" href="/auth/logout">
Logout
</Button>
) : (
<Button color="info" href="/auth/login">
Login
</Button>
)}
</div>
);
}
}
}
export default AuthButton;
import React from 'react'; import React from "react";
import { Button } from 'reactstrap'; import { Button } from "reactstrap";
export default class AuthButton extends React.Component { class AuthButton extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { is_auth: false }; this.state = { error: null, is_auth: false };
} }
componentDidMount() { componentDidMount() {
this.setState(() => { fetch("/auth/status")
return { is_auth: window.django.user.is_authenticated == 'True' }; .then(res => res.json())
}); .then(
} result => {
this.setState({
is_auth: result.is_authenticated
});
},
error => {
this.setState({
error
});
}
);
}
render() { render() {
return ( const { is_auth, error } = this.state;
<div> if (error) {
{this.state.is_auth ? ( return <div>Error: {error.message}</div>;
<Button color="info" href="/auth/logout"> } else {
Logout return (
</Button> <div>
) : ( {is_auth ? (
<Button color="info" href="/auth/login"> <Button color="info" href="/auth/logout">
Login Logout
</Button> </Button>
)} ) : (
</div> <Button color="info" href="/auth/login">
); Login
</Button>
)}
</div>
);
} }
}
} }
export default AuthButton;
import AuthButton from './AuthButton'; import AuthButton from "./AuthButton";
export { AuthButton }; export { AuthButton };
import React from 'react'; import React from "react";
import { Navbar, NavbarBrand, Nav, NavItem, NavLink } from 'reactstrap'; import { Navbar, NavbarBrand, Nav, NavItem, NavLink } from "reactstrap";
export default class NavBar extends React.Component { export default class NavBar extends React.Component {
render() { render() {
return ( return (
<div> <div>
<Navbar color="dark" dark expand="md"> <Navbar color="dark" dark expand="md">
<NavbarBrand href="#">Go</NavbarBrand> <NavbarBrand href="#">Go</NavbarBrand>
<Nav className="ml-auto" navbar> <Nav className="ml-auto" navbar>
<NavItem> <NavItem>
<NavLink href="#/dhaynes" active={this.props.page == 'dhaynes'}> <NavLink href="#/dhaynes" active={this.props.page == "dhaynes"}>
Dhaynes Dhaynes
</NavLink> </NavLink>
</NavItem> </NavItem>
<NavItem> <NavItem>
<NavLink href="#/about" active={this.props.page == 'about'}> <NavLink href="#/about" active={this.props.page == "about"}>
About About
</NavLink> </NavLink>
</NavItem> </NavItem>
</Nav> </Nav>
</Navbar> </Navbar>
</div> </div>
); );
} }
} }
import NavBar from './NavBar'; import NavBar from "./NavBar";
export { NavBar }; export { NavBar };
import { PageTemplate } from './Templates'; import { PageTemplate } from "./Templates";
import { HomePage, AboutPage, DhaynesPage } from './Pages'; import { HomePage, AboutPage, DhaynesPage } from "./Pages";
import { NavBar } from './Organisms'; import { NavBar } from "./Organisms";
import { AuthButton } from './Molecules'; import { AuthButton } from "./Molecules";
export { export {
//Tempaltes //Tempaltes
PageTemplate, PageTemplate,
//Pages //Pages
HomePage, HomePage,
AboutPage, AboutPage,
DhaynesPage, DhaynesPage,
//Organisms //Organisms
NavBar, NavBar,
//Molecules //Molecules
AuthButton, AuthButton
}; };
import React from 'react'; import React from "react";
import { Route } from 'react-router-dom'; import { Route } from "react-router-dom";
import { HomePage, AboutPage, DhaynesPage } from 'Components'; import { HomePage, AboutPage, DhaynesPage } from "Components";
const Routes = () => ( const Routes = () => (
<div> <div>
<Route path="/" exact component={HomePage} /> <Route path="/" exact component={HomePage} />
<Route path="/dhaynes" component={DhaynesPage} /> <Route path="/dhaynes" component={DhaynesPage} />
<Route path="/about" component={AboutPage} /> <Route path="/about" component={AboutPage} />
</div> </div>
); );
export default Routes; export default Routes;
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