stepus53/writer
1
0
Fork 0
mirror of https://github.com/usatiuk/writer.git synced 2025-10-29 00:17:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

logout

Browse Source
This commit is contained in:
Stepan Usatiuk
2019-01-03 19:33:16 +03:00
parent a7a36d2199
commit ca773d5b2d
11 changed files with 243 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
frontend/src/Home/Home.tsx
View File

@@ -1,25 +1,83 @@
import { Alignment, Button, Classes, Navbar } from "@blueprintjs/core";
import {
Alignment,
Button,
Classes,
Menu,
Navbar,
Popover,
} from "@blueprintjs/core";
import * as React from "react";
import { connect } from "react-redux";
import { Dispatch } from "redux";
import { IUserJSON } from "~../../src/entity/User";
import { IAppState } from "~redux/reducers";
import { logoutUser } from "~redux/user/actions";
export function Home() {
return (
<>
<Navbar>
<Navbar.Group align={Alignment.LEFT}>
<Navbar.Heading>Writer</Navbar.Heading>
<Navbar.Divider />
<Button
className={Classes.MINIMAL}
icon="home"
text="Home"
/>
<Button
className={Classes.MINIMAL}
icon="document"
text="Files"
/>
</Navbar.Group>
</Navbar>
</>
);
interface IHomeProps {
user: IUserJSON | null;
logout: () => void;
}
export class HomeComponent extends React.PureComponent<IHomeProps> {
constructor(props: IHomeProps) {
super(props);
}
public render() {
return (
<>
{this.props.user && (
<>
<Navbar>
<Navbar.Group align={Alignment.LEFT}>
<Navbar.Heading>Writer</Navbar.Heading>
<Navbar.Divider />
<Button
className={Classes.MINIMAL}
icon="home"
text="Home"
/>
<Button
className={Classes.MINIMAL}
icon="document"
text="Files"
/>
</Navbar.Group>
<Navbar.Group align={Alignment.RIGHT}>
<Popover
target={
<Button id="userButton">
{this.props.user.username}
</Button>
}
content={
<Menu>
<Menu.Item
icon="log-out"
text="Logout"
onClick={this.props.logout}
/>
</Menu>
}
/>
</Navbar.Group>
</Navbar>
</>
)}
</>
);
}
}
function mapStateToProps(state: IAppState) {
return { user: state.user.user };
}
function mapDispatchToProps(dispatch: Dispatch) {
return { logout: () => dispatch(logoutUser()) };
}
export const Home = connect(
mapStateToProps,
mapDispatchToProps,
)(HomeComponent);