Estoy tratando de realizar un algoritmo simple en next.js y obtengo estos errores de hidratación.

Este es el código que estoy usando:

 import numeros from "../../functions/numberGenerators.js" export default function teste(){ let number = numeros() return number.map(n => <div key={n}> Number: {n} </div>) }

Y:

 export default function megaSena(qtde = 6){ let listNumbers = [] while(listNumbers.length <= qtde - 1){ const numeroRandom = parseInt(Math.random() * 60) + 1 if (!listNumbers.includes(numeroRandom)){ listNumbers.push(numeroRandom) } } return listNumbers }

Y estoy teniendo estos siguientes errores:

1° - Error: la hidratación falló porque la interfaz de usuario inicial no coincide con lo que se representó en el servidor.

2° - Error: el contenido del texto no coincide con el HTML generado por el servidor.

3° - Error: la hidratación falló porque la interfaz de usuario inicial no coincide con lo que se representó en el servidor.

4° - Error: Hubo un error al hidratar. Debido a que el error ocurrió fuera de un límite de suspensión, toda la raíz cambiará a la representación del cliente.

¿Qué puedo hacer para resolver esto?