diff --git a/Frontend/src/hooks/useSaveSync.ts b/Frontend/src/hooks/useSaveSync.ts index 0114d41..80fc8c2 100644 --- a/Frontend/src/hooks/useSaveSync.ts +++ b/Frontend/src/hooks/useSaveSync.ts @@ -89,6 +89,36 @@ export function useSaveSync({ getGameState, onLoad, playTimeSeconds }: SaveSyncO return () => clearInterval(interval); }, [saveToServer, user]); + // Reload from server on tab focus (multi-tab/multi-browser sync) + useEffect(() => { + if (!user) return undefined; + + const handleFocus = () => { + apiRequest("/save").then((data) => { + if (data?.gameState && data.lastSave) { + // Only load if server save is newer than our last known save + if (!lastSaveRef.current || new Date(data.lastSave) > new Date(lastSaveRef.current)) { + onLoad(data.gameState); + lastSaveRef.current = data.lastSave; + console.info("[SaveSync] Reloaded from server on focus"); + } + } + }); + }; + + const handleBlur = () => { + saveToServer(); + console.info("[SaveSync] Saved on blur — other tabs will get latest"); + }; + + window.addEventListener("focus", handleFocus); + window.addEventListener("blur", handleBlur); + return () => { + window.removeEventListener("focus", handleFocus); + window.removeEventListener("blur", handleBlur); + }; + }, [user, onLoad]); + // Save on page unload useEffect(() => { const handleUnload = () => {