Feat: introduce option to enable/disable shuffling
This commit is contained in:
parent
b6136cb1ad
commit
8b7ab4b7a1
|
@ -11,13 +11,13 @@ import _ from 'underscore';
|
||||||
import './VerseSampler.css'
|
import './VerseSampler.css'
|
||||||
import VerseValidator from "./VerseValidator";
|
import VerseValidator from "./VerseValidator";
|
||||||
|
|
||||||
const GenerateTestList = ({ packs, testCount}) => {
|
const GenerateTestList = ({ packs, testCount, toShuffle}) => {
|
||||||
let testList = packs.reduce(
|
let testList = packs.reduce(
|
||||||
// grab all elements included checked in "packs"
|
// grab all elements included checked in "packs"
|
||||||
(accumulator, currentValue) => accumulator.concat(VerseData[currentValue]),
|
(accumulator, currentValue) => accumulator.concat(VerseData[currentValue]),
|
||||||
new Array()
|
new Array()
|
||||||
);
|
);
|
||||||
testList = _.sample(testList, testCount);
|
testList = toShuffle ? _.sample(testList, testCount) : _.first(testList, testCount);
|
||||||
return (
|
return (
|
||||||
<ArrayTester array={testList} />
|
<ArrayTester array={testList} />
|
||||||
)
|
)
|
||||||
|
@ -130,10 +130,20 @@ function App() {
|
||||||
const [expanded, setExpanded] = useState([])
|
const [expanded, setExpanded] = useState([])
|
||||||
|
|
||||||
|
|
||||||
|
// state for toShuffle
|
||||||
|
const [toShuffle, setShuffle] = useState(false);
|
||||||
|
// Function to handle checkbox change
|
||||||
|
const handleShuffleCheckboxChange = () => {
|
||||||
|
// Toggle the state when the checkbox is changed
|
||||||
|
setShuffle(!toShuffle);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="App">
|
<div className="App">
|
||||||
<h1>Pick Number of Verses:</h1>
|
<h1>Scripture Memory Tester</h1>
|
||||||
|
<h2>Pick Number of Verses:</h2>
|
||||||
<label className="test-count-box-label" htmlFor="testCountBox">
|
<label className="test-count-box-label" htmlFor="testCountBox">
|
||||||
Number of Verses Tested:
|
Number of Verses Tested:
|
||||||
</label>
|
</label>
|
||||||
|
@ -145,7 +155,16 @@ function App() {
|
||||||
onChange={testCountChange}
|
onChange={testCountChange}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<h1>Pick Your Packs:</h1>
|
<h2>
|
||||||
|
Set Shuffle:
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
checked={toShuffle}
|
||||||
|
onChange={handleShuffleCheckboxChange}
|
||||||
|
/>
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<h2>Pick Your Packs:</h2>
|
||||||
<CheckboxWidget
|
<CheckboxWidget
|
||||||
checked={checked}
|
checked={checked}
|
||||||
expanded={expanded}
|
expanded={expanded}
|
||||||
|
@ -154,7 +173,11 @@ function App() {
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<h1>Verses:</h1>
|
<h1>Verses:</h1>
|
||||||
<GenerateTestList packs={checked} testCount={testCount} />
|
<GenerateTestList
|
||||||
|
packs={checked}
|
||||||
|
testCount={testCount}
|
||||||
|
toShuffle={toShuffle}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue