Tengo curiosidad acerca de guardar y recuperar de localStorage en Wordle y cómo se implementa en React .

Estoy creando un clon de Wordle como proyecto, pero tengo un obstáculo en este momento. La mayoría de los recursos que encontré no explicarían cómo funciona. Si alguien alguna vez tiene éxito con esto, por favor ayúdame. Muchas gracias :)

En mi caso, tengo un archivo words.json que contiene todas las palabras.

1. Quiero configurar un temporizador para que, después de 10 minutos, cambie la palabra correcta al azar.
2. Todas las claves adivinadas, las palabras adivinadas , el temporizador de conteo y la palabra correcta actual se guardan en el almacenamiento local.
3. Cuando se cambia la palabra correcta, todos los datos en el almacenamiento local anterior se restablecen a la etapa nueva. (Sí, también limpia las fichas)

Problemas:

1. Hasta este punto, mi código puede obtener una palabra nueva cada 10 minutos, pero no sé cómo guardar todos los datos en el localStorage y restablecerlos después de 10 minutos.
2. Configuro correctWord como una cadena vacía para el estado inicial, si escribo "" en el tablero, el juego se romperá porque coincide con la condición ganadora. ( currentWord === correctWord )
3. El temporizador salta el número 0 y luego reinicia el proceso de cuenta regresiva nuevamente.
4. Traté de guardar el timeLeft hasta que la palabra correcta se cambiara a localStorage pero simplemente permanecería en 0 y no haría nada. Si actualizo la página, el temporizador volverá a comenzar desde el principio, no desde el punto en el que debería quedar.
5. No estoy aplicando el código correcto para guardar en localStorage porque copié parte de él. Por favor, siéntase libre de hacerme saber qué puedo cambiar para que se ajuste a mi código.

Todo el código está incrustado en este codeandbox a continuación