antialias/soroban-abacus-flashcards
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: resolve arrow disappearing and incorrect bead targeting in 3+14=17 story

Browse Source 
- Fix arrow disappearing issue by ensuring stepIndex matches currentStep for proper display
- Fix earth bead position for 18→17 subtraction to target correct bead (position 2 instead of 0)
- When value is 18 (heaven + 3 earth beads), subtracting 1 should deactivate the highest positioned earth bead

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Thomas Hallock
2025-09-22 14:50:30 -05:00
parent 5d39bdc84e
commit b253a21c6c
1 changed files with 13 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
packages/abacus-react/src/AbacusReact.multi-step-test.stories.tsx
View File

@@ -26,7 +26,7 @@ const generateAbacusInstructions = (startValue: number, targetValue: number) =>
{
placeValue: 0,
beadType: 'earth' as const,
position: 0,
position: 2, // 18 = heaven(5) + 3 earth beads(0,1,2), so deactivate position 2 to subtract 1
stepIndex: 2,
direction: 'deactivate' as const,
order: 0
@@ -117,7 +117,7 @@ const generateAbacusInstructions = (startValue: number, targetValue: number) =>
{
placeValue: 0,
beadType: 'earth' as const,
position: 0,
position: 2, // 18 = heaven(5) + 3 earth beads(0,1,2), so deactivate position 2 to subtract 1
stepIndex: 0,
direction: 'deactivate' as const,
order: 0
@@ -291,15 +291,23 @@ export const ThreePlusFourteenTest: Story = {
try {
// Generate arrows to get from current value to current expected step's target
const dynamicInstruction = generateAbacusInstructions(currentValue, currentExpectedStep.targetValue);
// CRITICAL FIX: Set all stepIndex to match currentStep for arrow display
const adjustedStepBeads = dynamicInstruction.stepBeadHighlights?.map(bead => ({
...bead,
stepIndex: currentStep // Force stepIndex to match currentStep
}));
console.log('🔄 Dynamic instruction:', {
from: currentValue,
to: currentExpectedStep.targetValue,
expectedStepIndex: currentStep,
expectedStepDescription: currentExpectedStep.description,
stepBeads: dynamicInstruction.stepBeadHighlights,
stepCount: dynamicInstruction.stepBeadHighlights?.length || 0
originalStepBeads: dynamicInstruction.stepBeadHighlights,
adjustedStepBeads: adjustedStepBeads,
stepCount: adjustedStepBeads?.length || 0
});
return dynamicInstruction.stepBeadHighlights;
return adjustedStepBeads;
} catch (error) {
console.error('Failed to generate dynamic instruction:', error);
return undefined;