Stian Aune
5 years ago
5 changed files with 123 additions and 28 deletions
-
65webui/package-lock.json
-
8webui/package.json
-
5webui/src/App.js
-
38webui/src/Components/Header.jsx
-
35webui/src/Components/LoginForm.jsx
@ -1,21 +1,29 @@ |
|||
import React, {Component} from "react" |
|||
import React, {useState} from "react" |
|||
import {Collapse, Nav, Navbar, NavbarBrand, NavbarToggler, NavItem, NavLink} from "reactstrap"; |
|||
import {connect} from "react-redux"; |
|||
import {Navbar, NavbarBrand} from "reactstrap"; |
|||
|
|||
class Header extends Component { |
|||
constructor(props) { |
|||
super(props); |
|||
} |
|||
function Header({isLoggedIn}) { |
|||
const [showMenu, setShowMenu] = useState(false); |
|||
|
|||
render() { |
|||
return ( |
|||
<Navbar color="dark" expand="md"> |
|||
<NavbarBrand href="/">Lucifer</NavbarBrand> |
|||
</Navbar> |
|||
); |
|||
} |
|||
return ( |
|||
<Navbar color="dark" dark expand="md"> |
|||
<NavbarBrand href="/">Lucifer</NavbarBrand> |
|||
<NavbarToggler onClick={() => setShowMenu(!showMenu)}/> |
|||
<Collapse isOpen={showMenu} navbar> |
|||
{isLoggedIn && ( |
|||
<Nav className="ml-auto" navbar> |
|||
<NavItem> |
|||
<NavLink href="/lights">Grupper</NavLink> |
|||
</NavItem> |
|||
</Nav> |
|||
)} |
|||
</Collapse> |
|||
</Navbar> |
|||
); |
|||
} |
|||
|
|||
const mapStateToProps = (state) => ({}); |
|||
const mapStateToProps = (state) => ({ |
|||
isLoggedIn: state.auth.isLoggedIn, |
|||
}); |
|||
|
|||
export default connect(mapStateToProps)(Header); |
|||
export default connect(mapStateToProps)(Header); |
|||
@ -0,0 +1,35 @@ |
|||
import React from "react"; |
|||
import {connect} from "react-redux"; |
|||
import {Card, CardBody, CardHeader, CardTitle, Col, Form, FormGroup, Input, Label} from "reactstrap"; |
|||
|
|||
function LoginForm(props) { |
|||
|
|||
|
|||
return ( |
|||
<Card> |
|||
<CardHeader> |
|||
<CardTitle>Innlogging</CardTitle> |
|||
</CardHeader> |
|||
<CardBody> |
|||
<Form> |
|||
<FormGroup row> |
|||
<Label sm={2} for="input-username">Brukernavn</Label> |
|||
<Col sm={10}> |
|||
<Input type="text" name="email" id="input-username"/> |
|||
</Col> |
|||
</FormGroup> |
|||
<FormGroup row> |
|||
<Label sm={2} for="input-password">Passord</Label> |
|||
<Col sm={10}> |
|||
<Input type="password" name="email" id="input-password"/> |
|||
</Col> |
|||
</FormGroup> |
|||
</Form> |
|||
</CardBody> |
|||
</Card> |
|||
); |
|||
} |
|||
|
|||
const mapStateToProps = (state) => ({}); |
|||
|
|||
export default connect(mapStateToProps)(LoginForm); |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue