PapaTutuWawa/Lateinicus
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feat: Implement setting the last review

Browse Source
This commit is contained in:
Alexander Polynomdivision 2018-09-15 17:32:20 +02:00
parent 18c13c06cd
commit 2c41347cea
5 changed files with 66 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/SummaryTable.tsx
View File

@ -9,11 +9,13 @@ import TableCell from "@material-ui/core/TableCell";
import { IReviewMetadata } from "../models/review";
interface IProps {
reviewMeta: IReviewMetadata;
reviewMeta: () => IReviewMetadata;
}
export default class SummaryTable extends React.Component<IProps> {
render() {
const meta = this.props.reviewMeta();
return <Table>
<TableHead>
<TableRow>
@ -24,15 +26,11 @@ export default class SummaryTable extends React.Component<IProps> {
<TableBody>
<TableRow>
<TableCell>Korrekt</TableCell>
<TableCell numeric>{this.props.reviewMeta.correct}</TableCell>
</TableRow>
<TableRow>
<TableCell>Fast richtig</TableCell>
<TableCell numeric>{this.props.reviewMeta.nearly}</TableCell>
<TableCell numeric>{meta.correct}</TableCell>
</TableRow>
<TableRow>
<TableCell>Falsch</TableCell>
<TableCell numeric>{this.props.reviewMeta.wrong}</TableCell>
<TableCell numeric>{meta.wrong}</TableCell>
</TableRow>
</TableBody>
</Table>;

35
src/components/app.tsx
View File

@ -39,6 +39,8 @@ import { IReviewMetadata, ReviewType } from "../models/review";
interface IState {
loggedIn: boolean;
lastReview: IReviewMetadata;
drawerOpen: boolean;
showDrawerButton: boolean;
}
@ -54,8 +56,15 @@ export default class Application extends React.Component<{}, IState> {
// TODO
const loggedIn = authKey !== null;
// TODO: Fetch the last review
this.state = {
loggedIn,
lastReview: {
correct: 0,
wrong: 0,
},
drawerOpen: false,
showDrawerButton: true,
};
@ -82,15 +91,18 @@ export default class Application extends React.Component<{}, IState> {
return levels;
}
getLastReview(): IReviewMetadata {
getLastReview = (): IReviewMetadata => {
console.log("STUB: Application::getLastReview");
// TODO: Actually fetch this
return {
correct: 5,
nearly: 5,
wrong: 5,
};
return this.state.lastReview;
}
setLastReview = (meta: IReviewMetadata) => {
// TODO: Send this to the server
this.setState({
lastReview: meta,
});
}
getReviewQueue = (): IVocab[] => {
@ -360,7 +372,7 @@ export default class Application extends React.Component<{}, IState> {
component={() => {
return <Dashboard
nextLevel={this.getNextLevel}
lastReview={this.getLastReview}
getLastReview={this.getLastReview}
getTopTen={this.getTopTenLearners} />
}} />
<AuthRoute
@ -382,7 +394,8 @@ export default class Application extends React.Component<{}, IState> {
return <LevelPage
id={match.params.id}
levelVocab={this.getLevelVocab}
drawerButtonState={this.drawerButtonState} />;
drawerButtonState={this.drawerButtonState}
setLastReview={this.setLastReview} />;
} else {
return <Redirect to="/login" />;
}
@ -395,7 +408,8 @@ export default class Application extends React.Component<{}, IState> {
reviewType={ReviewType.LEVEL}
levelId={match.params.id}
vocabByLevel={this.getLevelVocab}
drawerButtonState={this.drawerButtonState} />;
drawerButtonState={this.drawerButtonState}
setLastReview={this.setLastReview} />;
} else {
return <Redirect to="/login" />;
}
@ -407,7 +421,8 @@ export default class Application extends React.Component<{}, IState> {
return <ReviewPage
reviewType={ReviewType.QUEUE}
vocabByQueue={this.getReviewQueue}
drawerButtonState={this.drawerButtonState} />;
drawerButtonState={this.drawerButtonState}
setLastReview={this.setLastReview} />;
}} />
<AuthRoute
isAuth={this.isAuthenticated}

2
src/models/review.ts
View File

@ -3,8 +3,6 @@ export interface IReviewMetadata {
correct: number;
// Number of wrong answers
wrong: number;
// Number of nearly correct answers
nearly: number;
};
export enum ReviewType {

4
src/pages/dashboard.tsx
View File

@ -16,7 +16,7 @@ import { IReviewMetadata } from "../models/review";
interface IProps {
nextLevel: () => ILevel;
lastReview: () => IReviewMetadata;
getLastReview: () => IReviewMetadata;
getTopTen: () => ILearner[];
}
@ -59,7 +59,7 @@ export default class Dashboard extends React.Component<IProps> {
<Typography variant="title">
Letzte Wiederholung
</Typography>
<SummaryTable reviewMeta={this.props.lastReview()} />
<SummaryTable reviewMeta={this.props.getLastReview} />
</Paper>
</Grid>
</Grid>

40
src/pages/review.tsx
View File

@ -11,7 +11,7 @@ import Popover from "@material-ui/core/Popover";
import { Redirect } from "react-router-dom";
import { IVocab, IReviewCard, vocabToReviewCard, reviewQTypeToStr } from "../models/vocab";
import { ReviewType } from "../models/review";
import { ReviewType, IReviewMetadata } from "../models/review";
import { levW } from "../algorithms/levenshtein";
import { LEVENSHTEIN_MAX_DISTANCE } from "../config";
@ -23,6 +23,8 @@ interface IProps {
vocabByLevel?: (level: number) => IVocab[];
vocabByQueue?: () => IVocab[];
setLastReview: (meta: IReviewMetadata) => void;
reviewType: ReviewType;
drawerButtonState: (state: boolean) => void;
@ -32,6 +34,8 @@ interface IState {
input: string;
current: IReviewCard;
metadata: IReviewMetadata;
toSummary: boolean;
popoverOpen: boolean;
@ -41,7 +45,7 @@ interface IState {
export default class ReviewPage extends React.Component<IProps, IState> {
private vocab: IVocab[] = [];
private reviewQueue: Queue<IReviewCard> = new Queue();
private reviewQueue: Queue<IReviewCard> = undefined;
// Used for positioning the popover
private buttonRef: HTMLButtonElement;
@ -73,13 +77,20 @@ export default class ReviewPage extends React.Component<IProps, IState> {
}
// Turn the vocabulary into IReviewCards and queue them
this.vocab.forEach((vocab) => {
vocabToReviewCard(vocab).forEach(this.reviewQueue.enqueue);
});
if (!this.reviewQueue) {
this.reviewQueue = new Queue();
this.vocab.forEach((vocab) => {
vocabToReviewCard(vocab).forEach(this.reviewQueue.enqueue);
});
}
this.state = {
input: "",
current: this.reviewQueue.dequeue(),
metadata: {
correct: 0,
wrong: 0,
},
toSummary: false,
@ -89,6 +100,15 @@ export default class ReviewPage extends React.Component<IProps, IState> {
};
}
increaseMeta = (correct: number, wrong: number): IReviewMetadata => {
const { metadata } = this.state;
return {
wrong: metadata.wrong + wrong,
correct: metadata.correct + correct,
};
}
vocabFromId = (id: number) => {
return this.vocab.find((el) => el.id === this.state.current.id);
}
@ -104,20 +124,27 @@ export default class ReviewPage extends React.Component<IProps, IState> {
// Find the lowest distance
const minDist = Math.min(...dists);
console.log(this.reviewQueue.size());
// Check if the user's answer was correct
if (minDist === 0) {
// TODO: Show it's correct?
// Show the next vocab word
if (this.reviewQueue.size() === 0) {
// TODO: Set some data that the summary screen will show
// Go to the summary screen
this.setState({
toSummary: true,
}, () => {
// Update the "Last Review" data
this.props.setLastReview(this.state.metadata);
});
} else {
// Increase the vocab
this.setState({
current: this.reviewQueue.dequeue(),
input: "",
// Add one correct answer
metadata: this.increaseMeta(1, 0),
});
}
} else if (minDist <= LEVENSHTEIN_MAX_DISTANCE) {
@ -140,6 +167,7 @@ export default class ReviewPage extends React.Component<IProps, IState> {
popoverColor: "red",
// TODO: Or maybe don't reset the text
input: "",
metadata: this.increaseMeta(0, 1),
});
}