fix: stabilize auto-save by using ref for currentTime

The handleSaveProject callback had currentTime in its dependencies, which
caused the callback to be recreated on every playback frame update. This
made the auto-save effect reset its timer constantly, preventing auto-save
from ever triggering.

Solution: Use a ref to capture the latest currentTime value without
including it in the callback dependencies. This keeps the callback stable
while still saving the correct currentTime.

Added debug logging to track auto-save scheduling and triggering.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-19 10:05:21 +01:00
parent 1b41fca393
commit 31af08e9f7

View File

@@ -881,6 +881,12 @@ export function AudioEditor() {
}, [loadProjectsList]);
// Save current project
// Use ref to capture latest currentTime without triggering callback recreation
const currentTimeRef = React.useRef(currentTime);
React.useEffect(() => {
currentTimeRef.current = currentTime;
}, [currentTime]);
const handleSaveProject = React.useCallback(async () => {
if (tracks.length === 0) return;
@@ -904,7 +910,7 @@ export function AudioEditor() {
tracks,
{
zoom,
currentTime,
currentTime: currentTimeRef.current, // Use ref value
sampleRate: audioContext.sampleRate,
}
);
@@ -929,17 +935,26 @@ export function AudioEditor() {
duration: 3000,
});
}
}, [tracks, currentProjectId, currentProjectName, zoom, currentTime, addToast]);
}, [tracks, currentProjectId, currentProjectName, zoom, addToast]); // Removed currentTime from deps
// Auto-save effect (saves on track or name changes after 3 seconds of no changes)
React.useEffect(() => {
if (tracks.length === 0) return;
console.log('[Auto-save] Scheduling auto-save in 3 seconds...', {
trackCount: tracks.length,
projectName: currentProjectName,
});
const autoSaveTimer = setTimeout(() => {
console.log('[Auto-save] Triggering auto-save now');
handleSaveProject();
}, 3000); // Auto-save after 3 seconds of no changes
return () => clearTimeout(autoSaveTimer);
return () => {
console.log('[Auto-save] Clearing auto-save timer');
clearTimeout(autoSaveTimer);
};
}, [tracks, currentProjectName, handleSaveProject]);
// Create new project