🧹 [Refactor] Use AbortController for event listeners in useAudioPlayer

- Replaced multiple named event handler functions with inline state setters.
- Used an AbortController to cleanly remove all event listeners with a single `controller.abort()` call in the cleanup hook.
- This improves maintainability and readability by reducing verbosity without changing functionality.
- Formatted inline callbacks across multiple lines for better readability as requested.

Co-authored-by: LyAhn <27559362+LyAhn@users.noreply.github.com>
This commit is contained in:
google-labs-jules[bot]
2026-04-29 08:19:17 +00:00
parent 18a97e0bea
commit 153b63a90c
+30 -6
View File
@@ -35,12 +35,36 @@ export function useAudioPlayer(audioUrl: string | null) {
const controller = new AbortController();
const { signal } = controller;
audio.addEventListener("timeupdate", () => setState((prev) => ({ ...prev, currentTime: audio.currentTime })), { signal });
audio.addEventListener("durationchange", () => setState((prev) => ({ ...prev, duration: audio.duration })), { signal });
audio.addEventListener("loadedmetadata", () => setState((prev) => ({ ...prev, duration: audio.duration })), { signal });
audio.addEventListener("ended", () => setState((prev) => ({ ...prev, isPlaying: false, currentTime: 0 })), { signal });
audio.addEventListener("play", () => setState((prev) => ({ ...prev, isPlaying: true })), { signal });
audio.addEventListener("pause", () => setState((prev) => ({ ...prev, isPlaying: false })), { signal });
audio.addEventListener(
"timeupdate",
() => setState((prev) => ({ ...prev, currentTime: audio.currentTime })),
{ signal }
);
audio.addEventListener(
"durationchange",
() => setState((prev) => ({ ...prev, duration: audio.duration })),
{ signal }
);
audio.addEventListener(
"loadedmetadata",
() => setState((prev) => ({ ...prev, duration: audio.duration })),
{ signal }
);
audio.addEventListener(
"ended",
() => setState((prev) => ({ ...prev, isPlaying: false, currentTime: 0 })),
{ signal }
);
audio.addEventListener(
"play",
() => setState((prev) => ({ ...prev, isPlaying: true })),
{ signal }
);
audio.addEventListener(
"pause",
() => setState((prev) => ({ ...prev, isPlaying: false })),
{ signal }
);
return () => {
audio.pause();