From 7e9c1463f514158a3fd512eb1f2fdc623e4d334f Mon Sep 17 00:00:00 2001 From: Alexander Polynomdivision Date: Sat, 15 Sep 2018 14:26:22 +0200 Subject: [PATCH] feat: Hide the drawer button during levels and reviews --- src/components/app.tsx | 70 +++++++++++++++++++++++++++++++++++++----- src/models/review.ts | 5 +++ src/pages/level.tsx | 5 +++ src/pages/review.tsx | 37 +++++++++++++++++++--- 4 files changed, 104 insertions(+), 13 deletions(-) diff --git a/src/components/app.tsx b/src/components/app.tsx index ba44e13..3907043 100644 --- a/src/components/app.tsx +++ b/src/components/app.tsx @@ -33,12 +33,13 @@ import SummaryPage from "../pages/summary"; import { ILevel } from "../models/level"; import { ILearner } from "../models/learner"; import { IVocab, VocabType } from "../models/vocab"; -import { IReviewMetadata } from "../models/review"; +import { IReviewMetadata, ReviewType } from "../models/review"; interface IState { loggedIn: boolean; drawerOpen: boolean; + showDrawerButton: boolean; } // TODO: Replace the sessionStorage with localStorage? @@ -55,6 +56,7 @@ export default class Application extends React.Component<{}, IState> { this.state = { loggedIn, drawerOpen: false, + showDrawerButton: true, }; this.login = this.login.bind(this); @@ -90,6 +92,36 @@ export default class Application extends React.Component<{}, IState> { }; } + getReviewQueue = (): IVocab[] => { + console.log("STUB: Application::getReviewQueue"); + + // TODO: Implement + return [{ + german: ["Wein"], + hint: "Worte auf '-um' sind meistens NeutrUM", + type: VocabType.NOMEN, + latin: { + grundform: "Vinum", + genitiv: "Vini", + genus: "Neutrum" + }, + id: 0 + }/* , { + * latin: "Vici", + * german: "", + * hint: "Wird \"Viki\" und nicht \"Vichi\" ausgesprochen", + * mnemonic: "Merk dir das Wort mit Caesars berühmten Worten: \"Veni Vidi Vici\"; Er kam, sah und siegte", + * type: VocabType.NOMEN, + * id: 2 + }, { + * latin: "fuga", + * german: "Flucht", + * hint: "Worte auf \"-a\" sind FeminA", + * type: VocabType.NOMEN, + * id: 3 + } */] as IVocab[]; + } + getLearners(): ILearner[] { console.log("STUB: Application::getLearners"); @@ -140,7 +172,7 @@ export default class Application extends React.Component<{}, IState> { }; } - getLevelVocab(id: string): IVocab[] { + getLevelVocab(id: number): IVocab[] { console.log("STUB: Application::getLevelVocab"); // TODO: Actually implement this @@ -195,6 +227,16 @@ export default class Application extends React.Component<{}, IState> { }); } + drawerButtonState = (show: boolean) => { + // This is required as we would otherwise try to continously update + // the state, resulting in an infinte loop + if (show !== this.state.showDrawerButton) { + this.setState({ + showDrawerButton: show, + }); + } + } + render() { return @@ -202,7 +244,7 @@ export default class Application extends React.Component<{}, IState> { { - this.isAuthenticated() ? ( + (this.isAuthenticated() && this.state.showDrawerButton) ? ( this.setState({ drawerOpen: true })}> @@ -322,13 +364,17 @@ export default class Application extends React.Component<{}, IState> { } /> + component={() => } /> {/*We cannot use AuthRoute here, because match is undefined otherwise*/} { if (this.isAuthenticated()) { - return ; + return ; } else { return ; } @@ -337,7 +383,11 @@ export default class Application extends React.Component<{}, IState> { path="/review/level/:id" component={({ match }) => { if (this.isAuthenticated()) { - return ; + return ; } else { return ; } @@ -346,13 +396,17 @@ export default class Application extends React.Component<{}, IState> { isAuth={this.isAuthenticated} path="/review/queue" component={() => { - return

Get beaned!!

; + return ; }} /> { - return + return }} /> diff --git a/src/models/review.ts b/src/models/review.ts index e69a58a..7562839 100644 --- a/src/models/review.ts +++ b/src/models/review.ts @@ -6,3 +6,8 @@ export interface IReviewMetadata { // Number of nearly correct answers nearly: number; }; + +export enum ReviewType { + LEVEL, + QUEUE +}; diff --git a/src/pages/level.tsx b/src/pages/level.tsx index 890ad99..830e14f 100644 --- a/src/pages/level.tsx +++ b/src/pages/level.tsx @@ -16,6 +16,8 @@ interface IProps { id: string; levelVocab: (id: string) => IVocab[]; + + drawerButtonState: (state: boolean) => void; }; interface IState { @@ -33,6 +35,9 @@ export default class LevelPage extends React.Component { constructor(props: any) { super(props); + // Hide the drawer + this.props.drawerButtonState(false); + this.state = { currentVocab: this.props.levelVocab(this.props.id)[0], lookedAt: [0], diff --git a/src/pages/review.tsx b/src/pages/review.tsx index ca49de1..6395bc5 100644 --- a/src/pages/review.tsx +++ b/src/pages/review.tsx @@ -12,13 +12,19 @@ import Paper from "@material-ui/core/Paper"; import { Redirect } from "react-router-dom"; import { IVocab, ReviewMode, VocabType } from "../models/vocab"; +import { ReviewType } from "../models/review"; import { levW } from "../algorithms/levenshtein"; import { LEVENSHTEIN_MAX_DISTANCE } from "../config"; interface IProps { - levelId: number; - vocabByLevel: (level: number) => IVocab[]; + levelId?: number; + vocabByLevel?: (level: number) => IVocab[]; + vocabByQueue?: () => IVocab[]; + + reviewType: ReviewType; + + drawerButtonState: (state: boolean) => void; } interface IState { @@ -51,8 +57,29 @@ export default class ReviewPage extends React.Component { popoverColor: "red", }; - const { vocabByLevel, levelId } = this.props; - this.vocab = vocabByLevel(levelId); + // Hide the drawer button + this.props.drawerButtonState(false); + + // Get the correct vocabulary + const { reviewType, vocabByLevel, levelId, vocabByQueue } = this.props; + switch (reviewType) { + case ReviewType.LEVEL: + if (!vocabByLevel || !levelId) { + alert("[ReviewPage::constructor] vocabByLevel or levelId undefined"); + } else { + this.vocab = vocabByLevel(levelId); + } + + break; + case ReviewType.QUEUE: + if (!vocabByQueue) { + alert("[ReviewPage::constructor] vocabByQueue undefined"); + } else { + this.vocab = vocabByQueue(); + } + + break; + } } currentVocab = () => { @@ -108,7 +135,7 @@ export default class ReviewPage extends React.Component { ) : undefined } - +