diff --git a/package-lock.json b/package-lock.json index c476268..43b949e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1788,6 +1788,14 @@ "react-transition-group": "^4.4.0" } }, + "@material-ui/icons": { + "version": "4.11.2", + "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.2.tgz", + "integrity": "sha512-fQNsKX2TxBmqIGJCSi3tGTO/gZ+eJgWmMJkgDiOfyNaunNaxcklJQFaFogYcFl0qFuaEz1qaXYXboa/bUXVSOQ==", + "requires": { + "@babel/runtime": "^7.4.4" + } + }, "@material-ui/styles": { "version": "4.11.4", "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.4.tgz", diff --git a/package.json b/package.json index db0d9d0..98d56f1 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,7 @@ "private": true, "dependencies": { "@material-ui/core": "^4.11.4", + "@material-ui/icons": "^4.11.2", "@testing-library/jest-dom": "^5.12.0", "@testing-library/react": "^11.2.6", "@testing-library/user-event": "^12.8.3", diff --git a/src/helpers/AccountHelper.ts b/src/helpers/AccountHelper.ts new file mode 100644 index 0000000..09b59f9 --- /dev/null +++ b/src/helpers/AccountHelper.ts @@ -0,0 +1,16 @@ +/** + * Account helper + * + * @author Pierre Hubert + */ + +export class AccountHelper { + /** + * Check whether access token are available + * or not + */ + static get hasAccessToken() : boolean { + // TODO : implement support + return false; + } +} \ No newline at end of file diff --git a/src/ui/routes/LoginRoute.tsx b/src/ui/routes/LoginRoute.tsx new file mode 100644 index 0000000..a82ba2a --- /dev/null +++ b/src/ui/routes/LoginRoute.tsx @@ -0,0 +1,113 @@ +/** + * Login route + * + * @author Pierre Hubert + */ + +import { Typography, Link, makeStyles, Container, CssBaseline, Avatar, TextField, FormControlLabel, Checkbox, Button, Grid, Box } from "@material-ui/core"; +import LockOutlinedIcon from '@material-ui/icons/LockOutlined'; +import React from "react"; + +function Copyright() { + return ( + + {'Copyright © '} + + Your Website + {' '} + {new Date().getFullYear()} + {'.'} + + ); + } + + const useStyles = makeStyles((theme) => ({ + paper: { + marginTop: theme.spacing(8), + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + }, + avatar: { + margin: theme.spacing(1), + backgroundColor: theme.palette.secondary.main, + }, + form: { + width: '100%', // Fix IE 11 issue. + marginTop: theme.spacing(1), + }, + submit: { + margin: theme.spacing(3, 0, 2), + }, + })); + +export function LoginRoute() { + const classes = useStyles(); + + return ( + + +
+ + + + + Sign in + +
+ + + } + label="Remember me" + /> + + + + + Forgot password? + + + + + {"Don't have an account? Sign Up"} + + + + +
+ + + +
+ ); + } + \ No newline at end of file diff --git a/src/ui/widgets/AsyncWidget.tsx b/src/ui/widgets/AsyncWidget.tsx index e6c776f..43411a9 100644 --- a/src/ui/widgets/AsyncWidget.tsx +++ b/src/ui/widgets/AsyncWidget.tsx @@ -55,7 +55,7 @@ export class AsyncWidget extends React.Component ); - if(this.state.status == Status.SUCCESS) + if(this.state.status === Status.SUCCESS) return this.props.onBuild(); return () diff --git a/src/ui/widgets/InitWidget.tsx b/src/ui/widgets/InitWidget.tsx index 43a1862..8b61bbf 100644 --- a/src/ui/widgets/InitWidget.tsx +++ b/src/ui/widgets/InitWidget.tsx @@ -5,24 +5,33 @@ */ import React from "react"; +import { AccountHelper } from "../../helpers/AccountHelper"; +import { LoginRoute } from "../routes/LoginRoute"; import { AsyncWidget } from "./AsyncWidget"; +interface InitWidgetState { + signedIn: boolean, +} -export class InitWidget extends React.Component { +export class InitWidget extends React.Component<{}, InitWidgetState> { constructor(props: any) { super(props); + this.state = { + signedIn: false + }; + this.init = this.init.bind(this); this.build = this.build.bind(this); } async init() { - await new Promise((res, rej) => { - setTimeout(() => { - rej(null); - }, 500) - }) + this.setState({ signedIn: false }); + + if (AccountHelper.hasAccessToken) { + throw Error("UNIMPLEMENTED!"); + } } render() { @@ -34,6 +43,6 @@ export class InitWidget extends React.Component { } build() { - return (
yes !!! done !!!
); + return this.state.signedIn ? null : (); } } \ No newline at end of file