audioContextの現在再生時間をinput type=rangeと連動させたい。

前提

オーディオの読み込みが終わると押せるようになる再生ボタンを押すと、音楽が流れるものを制作しています。
下記はデモです。
デモ(CodeSandBox)
音楽ファイルを読み込むと、音楽の総再生時間を表示します。

デモは下記を使用しています。

React.js
Web Audio API

実現したいこと

現在の再生時間を表示したいです。
音楽が進むと自動でinput type=rangeも動かしたいです。
input type=rangeを動かすと、inputのvalueに対応する再生位置で、音楽を再生させたいです。

発生している問題・エラーメッセージ

音楽が進んでもinput type=rangeは動かず、input type=rangeを動かしても音楽の再生位置が変わることなく、そのまま再生され続けます。

該当のソースコード

js
1let audioCtx, audioBuffer, sampleSource;
2const audioURL = "/piano.mp3";
3
4const App = () => {
5  const [loaded, setLoaded] = useState(false);
6  const [playing, setPlaying] = useState(false);
7  const [total, setTotal] = useState(0);
8  const [current, setCurrent] = useState(0);
9
10  const audioLoad = async () => {
11    const response = await fetch(audioURL);
12    const arrayBuffer = await response.arrayBuffer();
13    if (arrayBuffer) {
14      audioBuffer = await audioCtx.decodeAudioData(arrayBuffer);
15      setTotal(audioBuffer.duration);
16    }
17    setLoaded(true);
18  };
19  useEffect(() => {
20    audioCtx = new (window.AudioContext || window.webkitAudioContext)();
21    audioLoad();
22    return () => {
23      audioCtx.close();
24      audioCtx = null;
25    };
26  }, []);
27
28  const playAudio = () => {
29    if (!playing) {
30      sampleSource = audioCtx.createBufferSource();
31      sampleSource.buffer = audioBuffer;
32      sampleSource.connect(audioCtx.destination);
33      sampleSource.start();
34      setPlaying(true);
35      return;
36    }
37    sampleSource.disconnect();
38    setCurrent(0);
39    setPlaying(false);
40  };
41
42  const changeSeek = (e) => {
43    setCurrent(e.target.value);
44    audioCtx.currentTime = current;
45    console.log(audioCtx.currentTime);
46  };
47
48  return (
49    <>
50      <p>曲の長さ {total}</p>
51      <p>現在再生時間 {current}</p>
52      <button onClick={playAudio} disabled={loaded ? false : true}>
53        {playing ? "停止" : "再生"}
54      </button>
55      <input
56        onChange={changeSeek}
57        value={current}
58        type="range"
59        max={total}
60        style={inputStyle}
61      />
62    </>
63  );
64};
65
66const inputStyle = {
67  width: "100%"
68};