feat: Basic implementation of showing the score

This commit is contained in:
Alexander Polynomdivision 2018-09-20 17:34:01 +02:00
parent a1971f8ba8
commit 4c9e328ad0
7 changed files with 23 additions and 2 deletions

View File

@ -6,6 +6,7 @@ import AppBar from "@material-ui/core/AppBar";
import Toolbar from "@material-ui/core/Toolbar"; import Toolbar from "@material-ui/core/Toolbar";
import Typography from "@material-ui/core/Typography"; import Typography from "@material-ui/core/Typography";
import IconButton from "@material-ui/core/IconButton"; import IconButton from "@material-ui/core/IconButton";
import Button from "@material-ui/core/Button";
import SwipeableDrawer from "@material-ui/core/SwipeableDrawer"; import SwipeableDrawer from "@material-ui/core/SwipeableDrawer";
import List from "@material-ui/core/List"; import List from "@material-ui/core/List";
import ListItem from "@material-ui/core/ListItem"; import ListItem from "@material-ui/core/ListItem";
@ -21,9 +22,12 @@ import HomeIcon from "@material-ui/icons/Home";
import BookIcon from "@material-ui/icons/Book"; import BookIcon from "@material-ui/icons/Book";
import ViewWeekIcon from "@material-ui/icons/ViewWeek"; import ViewWeekIcon from "@material-ui/icons/ViewWeek";
import { IUser } from "../models/user";
interface IProps { interface IProps {
logout: () => void; logout: () => void;
user: IUser;
open: boolean; open: boolean;
showButton: boolean; showButton: boolean;
authenticated: boolean; authenticated: boolean;
@ -55,6 +59,13 @@ export default class Drawer extends React.Component<IProps> {
<Typography className="flex" variant="title" color="inherit"> <Typography className="flex" variant="title" color="inherit">
Lateinicus Lateinicus
</Typography> </Typography>
{
this.props.authenticated ? (
<Button color="inherit">
{`${this.props.user.score} / 200`}
</Button>
) : undefined
}
</Toolbar> </Toolbar>
</AppBar> </AppBar>
<SwipeableDrawer <SwipeableDrawer

View File

@ -6,6 +6,7 @@ import Drawer from "../components/Drawer";
const mapStateToProps = state => { const mapStateToProps = state => {
return { return {
user: state.user,
open: state.drawer, open: state.drawer,
authenticated: state.authenticated, authenticated: state.authenticated,
showButton: state.drawerButton, showButton: state.drawerButton,

View File

@ -2,6 +2,7 @@ export interface IUser {
username: string; username: string;
uid: string; uid: string;
showWelcome: boolean; showWelcome: boolean;
score: number;
sessionToken: string; sessionToken: string;
}; };

View File

@ -68,6 +68,7 @@ export default class IntroPage extends React.Component<{}> {
</Typography> </Typography>
</CardContent> </CardContent>
<CardActions> <CardActions>
{/*TODO: Tell the server to not show this page again*/}
<Button <Button
fullWidth={true} fullWidth={true}
component={Link} component={Link}

View File

@ -35,7 +35,13 @@ const LoginPageWithRouter = withRouter(
const username = this.usernameRef.value || ""; const username = this.usernameRef.value || "";
const password = this.passwordRef.value || ""; const password = this.passwordRef.value || "";
this.props.login(username, password).then((res: IUser) => { this.props.login(username, password).then((res: IUser) => {
this.props.history.push("/dashboard"); if (res.showWelcome) {
// If the user logs in for the first time, a welcome
// screen should be shown
this.props.history.push("/welcome");
} else {
this.props.history.push("/dashboard");
}
}, (err) => { }, (err) => {
this.props.setLoading(false); this.props.setLoading(false);
this.props.setSnackbar(true, "Failed to log in"); this.props.setSnackbar(true, "Failed to log in");

View File

@ -102,7 +102,7 @@ const ReviewPageWithRouter = withRouter(
}; };
} }
vocabFromId = (id: number) => { vocabFromId = (id: number): IVocab | {} => {
return this.vocab.find((el) => el.id === this.props.current.id); return this.vocab.find((el) => el.id === this.props.current.id);
} }

View File

@ -90,6 +90,7 @@ const initialState: IState = {
popoverOpen: false, popoverOpen: false,
popoverText: "", popoverText: "",
popoverColor: "", popoverColor: "",
popoverTextColor: "",
}, },
lastReview: { lastReview: {