Still getting 'Error: Start time must be strictly greater than previous start time' when trying to create a metronome

[cordial]

Describe the bug

I want a metronome. It should tap a file loaded from firestore every 4n and turn on and off when you hover over a grid item. Each grid item will potentially play a different tap noise (which are all store in firestore). Therefore I need to load the file on every hover. My code works except it throws this error -

"Unhandled Runtime Error Error: Start time must be strictly greater than previous start time"

Here is the relevant code :-

In mouseover function -

 .then((fireBaseUrl) => {
                    player.load(fireBaseUrl).then(() => {
                        Transport.scheduleRepeat(function (time) {
                            player.start();
                        }, "4n");

                        Transport.start("+0");
                    });
                });

In the mouseLeave function -

player.stop();
        player.dispose();
        Transport.stop();

What I need to do is reset Transport somehow and start over? I've tried with various combos of stopping / disposing etc but as Transport doesnt get reset I get this error (I think at least)

To Reproduce

1 Create a metronome that can be reset with different sound files each time

Expected behavior Should play without error

What I've tried I've tried with various combos of stopping / disposing etc but as Transport doesnt get reset I get this error (I think at least)

Additional context This is running in react / next.js on the client only.

[cordial]

Bastically I want to remove the repeat and re add it somehow (with the new file potentially).

[cordial]

Ahh, Transport.cancel() seems to make the error go away. Is that the correct way to reset?

[tambien]

Also make sure you pass in the time into this function:

Transport.scheduleRepeat(function (time) {
    player.start(time);
}, "4n");

[dirkk0]

Like this: https://codepen.io/dirkk0/pen/QWgzPXP