fix(27-01): add ignore flag to prevent unmount state updates
- Add let ignore = false at start of duration fetch useEffect - Check ignore flag after async jamClient call - Add cleanup function that sets ignore = true - Prevents 'state update on unmounted component' React warnings when closing backing track popup quickly
This commit is contained in:
parent
d958b26008
commit
bba12ac905
|
|
@ -88,6 +88,8 @@ const JKSessionBackingTrackPlayer = ({
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
let ignore = false;
|
||||||
|
|
||||||
// For popup mode, treat as always "open" since the popup window itself indicates open state
|
// For popup mode, treat as always "open" since the popup window itself indicates open state
|
||||||
const shouldInitialize = (isOpen || isPopup) && backingTrack && jamClient;
|
const shouldInitialize = (isOpen || isPopup) && backingTrack && jamClient;
|
||||||
|
|
||||||
|
|
@ -99,16 +101,23 @@ const JKSessionBackingTrackPlayer = ({
|
||||||
|
|
||||||
// Fetch and set duration immediately when track loads (async)
|
// Fetch and set duration immediately when track loads (async)
|
||||||
const fetchDuration = async () => {
|
const fetchDuration = async () => {
|
||||||
|
if (ignore) return;
|
||||||
setIsLoadingDuration(true);
|
setIsLoadingDuration(true);
|
||||||
|
|
||||||
try {
|
try {
|
||||||
if (!jamClient) {
|
if (!jamClient) {
|
||||||
|
if (!ignore) {
|
||||||
handleError('general', 'Audio engine not available', null);
|
handleError('general', 'Audio engine not available', null);
|
||||||
setIsLoadingDuration(false);
|
setIsLoadingDuration(false);
|
||||||
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const durationInMs = await jamClient.SessionGetTracksPlayDurationMs();
|
const durationInMs = await jamClient.SessionGetTracksPlayDurationMs();
|
||||||
|
|
||||||
|
// Check ignore AFTER async operation
|
||||||
|
if (ignore) return;
|
||||||
|
|
||||||
// Convert string to number (jamClient returns string values)
|
// Convert string to number (jamClient returns string values)
|
||||||
const validDuration = parseInt(durationInMs, 10) || 0;
|
const validDuration = parseInt(durationInMs, 10) || 0;
|
||||||
|
|
||||||
|
|
@ -131,15 +140,21 @@ const JKSessionBackingTrackPlayer = ({
|
||||||
clearError(); // Clear any previous errors
|
clearError(); // Clear any previous errors
|
||||||
setIsLoadingDuration(false);
|
setIsLoadingDuration(false);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
|
if (!ignore) {
|
||||||
handleError('file', 'Failed to load track duration', error);
|
handleError('file', 'Failed to load track duration', error);
|
||||||
setDuration('0:00');
|
setDuration('0:00');
|
||||||
setDurationMs(0);
|
setDurationMs(0);
|
||||||
setIsLoadingDuration(false);
|
setIsLoadingDuration(false);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
fetchDuration();
|
fetchDuration();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
ignore = true;
|
||||||
|
};
|
||||||
}, [isOpen, isPopup, backingTrack, jamClient, handleError, formatTime, clearError]);
|
}, [isOpen, isPopup, backingTrack, jamClient, handleError, formatTime, clearError]);
|
||||||
|
|
||||||
// Playback monitoring with visibility-aware polling
|
// Playback monitoring with visibility-aware polling
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue