diff --git a/src/components/Assessment.tsx b/src/components/Assessment.tsx index 56d9d09..6e338a8 100644 --- a/src/components/Assessment.tsx +++ b/src/components/Assessment.tsx @@ -154,7 +154,7 @@ export default class Assessment extends React.Component { - this.setState({certification: data as Certification, session: this.getDefaultState().session, activeQuestion: -1}); + this.setState({certification: data as Certification, session: this.getDefaultState().session, activeQuestion: -1, selectedQuestions: {}}); }); } diff --git a/src/components/AssessmentHistory.tsx b/src/components/AssessmentHistory.tsx index 180379b..4515711 100644 --- a/src/components/AssessmentHistory.tsx +++ b/src/components/AssessmentHistory.tsx @@ -108,7 +108,7 @@ export default class AssessmentHistory extends React.PureComponent { let question = this.state.certification.questions.find(q => q.id === arr[0]); - return [question.key, arr[1], question.position] + return [question.key || question.id, arr[1], question.position] }); sortable = sortable.sort((a, b) => (a[2] as number) - (b[2] as number)); @@ -163,6 +163,7 @@ export default class AssessmentHistory extends React.PureComponent; @@ -15,21 +15,46 @@ export interface QuestionSelectionListProps extends IBaseProps { selectedQuestions: IAssociativeArray; } -export default class QuestionSelectionList extends React.PureComponent { +enum FilterType { + GreaterEqual, + LessEqual +} + +interface QuestionSelectionListState { + selectionByQuestionScoreEnabled: boolean; + filterType: FilterType; + filterValue: number; +} + +export default class QuestionSelectionList extends React.PureComponent { constructor(props: QuestionSelectionListProps) { super(props); + this.state = { + selectionByQuestionScoreEnabled: false, + filterType: FilterType.LessEqual, + filterValue: 99 + }; + this.selectNone = this.selectNone.bind(this); this.selectAll = this.selectAll.bind(this); this.selectAnsweredIncorrectlyLastTime = this.selectAnsweredIncorrectlyLastTime.bind(this); + this.selectByQuestionScore = this.selectByQuestionScore.bind(this); + this.showByQuestionScoreFilter = this.showByQuestionScoreFilter.bind(this); + this.hideByQuestionScoreFilter = this.hideByQuestionScoreFilter.bind(this); + this.setFilterToLessEqual = this.setFilterToLessEqual.bind(this); + this.setFilterToGreaterEqual = this.setFilterToGreaterEqual.bind(this); + this.setFilterValue = this.setFilterValue.bind(this); } selectNone(e: any){ - this.props.onSelectionChange(this.props.questions.reduce((acc, val) => { acc[val.id] = false; return acc; }, {} as IAssociativeArray)) + this.props.onSelectionChange(this.props.questions.reduce((acc, val) => { acc[val.id] = false; return acc; }, {} as IAssociativeArray)); + this.hideByQuestionScoreFilter(); } selectAll(e: any){ - this.props.onSelectionChange(this.props.questions.reduce((acc, val) => { acc[val.id] = true; return acc; }, {} as IAssociativeArray)) + this.props.onSelectionChange(this.props.questions.reduce((acc, val) => { acc[val.id] = true; return acc; }, {} as IAssociativeArray)); + this.hideByQuestionScoreFilter(); } selectAnsweredIncorrectlyLastTime(e: any){ @@ -41,21 +66,79 @@ export default class QuestionSelectionList extends React.PureComponent !checkIfAnsweredCorrectly(q.answers, lastSession.answers[q.id].reduce((acc, val) => { acc[val] = true; return acc; }, { } as IAssociativeArray))); - this.props.onSelectionChange(this.props.questions.reduce((acc, val) => { acc[val.id] = incorrectLastTime.some(q => q.id === val.id); return acc; }, {} as IAssociativeArray)) + this.props.onSelectionChange(this.props.questions.reduce((acc, val) => { acc[val.id] = incorrectLastTime.some(q => q.id === val.id); return acc; }, {} as IAssociativeArray)); + this.hideByQuestionScoreFilter(); + } + + selectByQuestionScore(e: any){ + let ratios = calculateScorePerQuestion(this.props.previousSessions); + + // Sorted by created on descending in SQL query + let filteredRatios = Object.keys(ratios).filter(key => this.state.filterType === FilterType.LessEqual ? ratios[key] <= this.state.filterValue : ratios[key] >= this.state.filterValue ); + this.props.onSelectionChange(this.props.questions.reduce((acc, val) => { acc[val.id] = filteredRatios.some(q => q === val.id); return acc; }, {} as IAssociativeArray)); + } + + hideByQuestionScoreFilter() { + this.setState({ + selectionByQuestionScoreEnabled: false + }); + } + + showByQuestionScoreFilter(e: any) { + if (!e.target.checked) { + return; + } + + this.setState({ + selectionByQuestionScoreEnabled: true + }); + } + + setFilterToGreaterEqual () { + this.setState({ + filterType: FilterType.GreaterEqual + }); + } + + setFilterToLessEqual () { + this.setState({ + filterType: FilterType.LessEqual + }); + } + + setFilterValue (e: any) { + this.setState({ + filterValue: parseInt(e.target.value) + }); } render(){ return (

Please select the questions you want to train during this assessment

- + + None All Answered Incorrectly Last Time + Filter by Question Score -
+ + {this.state.selectionByQuestionScoreEnabled && +
+ + + Less Equal + Greater Equal + + + + +
+ } + { this.props.questions.map(q => ) } diff --git a/src/components/SessionRecap.tsx b/src/components/SessionRecap.tsx index 77426c6..3479ae1 100644 --- a/src/components/SessionRecap.tsx +++ b/src/components/SessionRecap.tsx @@ -71,8 +71,8 @@ export default class SessionRecap extends React.PureComponent