Issue with Persisting User Progress in Flashcard Array

[jiaruisong]

Problem Summary

I am encountering a problem with maintaining the user's progress within a flashcard array component. The key functionality required is for the application to save the user's current position within the flashcard sequence locally on the client side. This way, if a user switches tabs or navigates away and then returns, they can continue from the last flashcard they viewed instead of starting over from the first flashcard. Attempts to use a setCurrentCard function to achieve this have been unsuccessful, leading me to believe that this function might not directly influence how the flashcard is rendered or does not interact with the component's state as expected.

Expected Behavior

When a user navigates away from the flashcard component (switching tabs, navigating to a different page, etc.) and then returns, their progress should be preserved, allowing them to resume from the last flashcard they were viewing.

Actual Behavior

Currently, despite attempts to implement functionality to save and restore the user's progress (using a setCurrentCard approach), the flashcard array resets to the first card whenever the user leaves and returns to the component, indicating a failure to persist user progress across sessions.

Steps to Reproduce

1. Navigate to the flashcard component and interact with it to change the currently displayed flashcard from the default (first) position.
2. Switch tabs or navigate away from the page.
3. Return to the flashcard component and observe that the display has reset to the first flashcard, instead of displaying the last flashcard viewed.

Attempted Solutions and Observations

• I attempted to save the user's current flashcard index in localStorage upon navigating away and then restore this index using setCurrentCard upon returning.
• The restoration process seems to correctly identify and attempt to set the saved index, but the displayed flashcard does not update accordingly.
• This leads to the hypothesis that setCurrentCard may not be affecting the flashcard rendering process or is not properly integrated with the component's state management.

Request for Assistance

• Could you provide insight or confirm whether setCurrentCard is intended to influence the rendering of flashcards directly, or if an alternative method is recommended for this purpose?
• Is there a recommended approach or best practice for persisting and restoring user progress within the flashcard array component that I might have overlooked?

[ABSanthosh]

Hey! I forgot about this case and I didn’t notice it during development. Give me a few days, I’ll try to add that to the library.

In the meantime, if you want to come up with a solution, feel free to make a PR.

[harbolaez]

any update on this? interested