diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
index 55402f7..1325ade 100644
--- a/public/locales/en/translation.json
+++ b/public/locales/en/translation.json
@@ -15,7 +15,8 @@
"note_live_validation": "Check this box to enable live validation feedback as you type. Uncheck to only show correctness upon completion.",
"pick_pack": "Pick your pack(s)",
"tools": "Tools:",
- "verses": "Verses:"
+ "verses": "Verses:",
+ "problem_verses_session": "Statistics (This Session):"
},
"verse_validator": {
"input_reference": "Input Verse Reference:",
diff --git a/public/locales/kn/translation.json b/public/locales/kn/translation.json
index 1106508..09b6a96 100644
--- a/public/locales/kn/translation.json
+++ b/public/locales/kn/translation.json
@@ -15,7 +15,8 @@
"note_live_validation": "Check this box to enable live validation feedback as you type. Uncheck to only show correctness upon completion.",
"pick_pack": "Pick your pack(s)",
"tools": "Tools:",
- "verses": "Verses:"
+ "verses": "Verses:",
+ "problem_verses_session": "Statistics (This Session):"
},
"verse_validator": {
"input_reference": "Input Verse Reference: ",
diff --git a/src/VerseSampler.jsx b/src/VerseSampler.jsx
index 46eeb55..477835c 100644
--- a/src/VerseSampler.jsx
+++ b/src/VerseSampler.jsx
@@ -4,7 +4,7 @@ Implemented features:
- create checklist from keys
*/
import fullVerseData from "./assets/verse.json" // the actual verse json data file
-import { useState, useEffect, useMemo } from "react";
+import { useState, useEffect, useMemo, useCallback } from "react";
import CheckboxTree from 'react-checkbox-tree';
import 'react-checkbox-tree/lib/react-checkbox-tree.css';
import _ from 'underscore';
@@ -16,7 +16,7 @@ import logo from './assets/droplet.svg';
import { Suspense } from "react";
-const ArrayTester = ({ array, toHideReference, liveValidation, clearKey, translate}) => {
+const ArrayTester = ({ array, toHideReference, liveValidation, clearKey, translate, onShowAnswer}) => {
const list = array.map((element, index) => (
// key needs to be unique; chose 3 elements that will separate all elements
))
return list
@@ -99,6 +100,18 @@ function Page() {
setClearKey(clearKey => clearKey + 1);
};
+ // New state for tracking problem verses within the session
+ const [sessionProblemVerses, setSessionProblemVerses] = useState({});
+
+ // Callback for when 'Show Answer' is clicked in VerseValidator
+ const handleShowAnswer = useCallback((verseIdentifier) => {
+ const key = `${verseIdentifier.pack}|${verseIdentifier.reference}`;
+ setSessionProblemVerses(prev => ({
+ ...prev,
+ [key]: (prev[key] || 0) + 1
+ }));
+ }, []);
+
// setup i18 for function
const { t, i18n } = useTranslation();
@@ -200,6 +213,11 @@ function Page() {
return toShuffle ? _.sample(list, testCount) : _.first(list, testCount);
}, [VerseData, checked, testCount, toShuffle, shuffleKey]);
+ // Reset session problem verses when the testList changes (new session)
+ useEffect(() => {
+ setSessionProblemVerses({});
+ }, [testList]);
+
return (
@@ -302,9 +320,25 @@ function Page() {
liveValidation={liveValidation}
clearKey={clearKey} // Pass clearKey down
translate={t}
+ onShowAnswer={handleShowAnswer}
/>
}
+ {Object.keys(sessionProblemVerses).length > 0 && (
+
+
{t('main.problem_verses_session')}
+
+ {Object.entries(sessionProblemVerses)
+ .sort(([, countA], [, countB]) => countB - countA) // Sort by count in descending order
+ .map(([key, count]) => {
+ // Assuming key format is "pack:reference"
+ const [pack, reference] = key.split('|');
+ return - {reference} (Shown Answer: {count} time{count > 1 ? 's' : ''})
;
+ })}
+
+
+ )}
+
Built on: {VITE_BUILD_DATE}
diff --git a/src/VerseValidator.jsx b/src/VerseValidator.jsx
index 408f9a4..d09b85b 100644
--- a/src/VerseValidator.jsx
+++ b/src/VerseValidator.jsx
@@ -12,7 +12,7 @@ const STATE = {
// function to render and handle logic of each of the cells
-const VerseValidator = ({ element: { pack, title, chapterTitle, reference, verse } , toHideReference, liveValidation, clearKey, t, index}) => { // useful use of destructuring here
+const VerseValidator = ({ element: { pack, title, chapterTitle, reference, verse } , toHideReference, liveValidation, clearKey, t, index, onShowAnswer}) => { // useful use of destructuring here
const [inputReference, setReference] = useState('')
const [referenceBool, setReferenceBool] = useState(STATE.INCORRECT)
const [inputChapterTitle, setChapterTitle] = useState('')
@@ -355,7 +355,15 @@ const VerseValidator = ({ element: { pack, title, chapterTitle, reference, verse
{/* button to toggle show answer*/}
{/* */}
-
+