mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-21 08:31:13 -05:00
feat: Add diagnostic logging for tab focus issue
This commit is contained in:
@@ -158,9 +158,21 @@ export function useModerationQueueManager(
|
|||||||
const fetchItems = useCallback(async (silent = false) => {
|
const fetchItems = useCallback(async (silent = false) => {
|
||||||
if (!user) return;
|
if (!user) return;
|
||||||
|
|
||||||
// Check if tab is hidden
|
// Get caller info
|
||||||
if (pauseFetchingRef.current || document.hidden) {
|
const callerStack = new Error().stack;
|
||||||
console.log('⏸️ Fetch paused (tab hidden)');
|
const callerLine = callerStack?.split('\n')[2]?.trim();
|
||||||
|
|
||||||
|
console.log('🔄 [FETCH ITEMS] Called', {
|
||||||
|
silent,
|
||||||
|
pauseFetchingRef: pauseFetchingRef.current,
|
||||||
|
documentHidden: document.hidden,
|
||||||
|
caller: callerLine,
|
||||||
|
timestamp: new Date().toISOString()
|
||||||
|
});
|
||||||
|
|
||||||
|
// Check if fetching is paused (controlled by visibility handler if enabled)
|
||||||
|
if (pauseFetchingRef.current) {
|
||||||
|
console.log('⏸️ Fetch paused by pauseFetchingRef');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -794,15 +806,26 @@ export function useModerationQueueManager(
|
|||||||
|
|
||||||
// Visibility change handler
|
// Visibility change handler
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
console.log('🔍 Visibility effect running - refreshOnTabVisible:', settings.refreshOnTabVisible);
|
console.log('🔍 [VISIBILITY EFFECT] Running', {
|
||||||
|
settingsObject: settings,
|
||||||
|
refreshOnTabVisible: settings.refreshOnTabVisible,
|
||||||
|
typeOf: typeof settings.refreshOnTabVisible,
|
||||||
|
rawValue: JSON.stringify(settings.refreshOnTabVisible),
|
||||||
|
stringValue: String(settings.refreshOnTabVisible),
|
||||||
|
boolValue: Boolean(settings.refreshOnTabVisible),
|
||||||
|
timestamp: new Date().toISOString()
|
||||||
|
});
|
||||||
|
|
||||||
// Early return if feature is disabled
|
// Early return if feature is disabled
|
||||||
if (!settings.refreshOnTabVisible) {
|
if (!settings.refreshOnTabVisible) {
|
||||||
console.log('⚙️ refreshOnTabVisible is DISABLED - no listener attached');
|
console.log(' ✅ Setting is FALSE - NO listener will be attached');
|
||||||
|
console.log(' ✅ Tab focus will NOT trigger refreshes');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log('✅ refreshOnTabVisible is ENABLED - attaching listener');
|
console.error(' ❌ Setting is TRUE - listener WILL be attached');
|
||||||
|
console.error(' ❌ THIS MEANS TAB FOCUS **WILL** TRIGGER REFRESHES');
|
||||||
|
console.error(' ⚠️ If you disabled this setting, it is NOT working properly');
|
||||||
|
|
||||||
const handleVisibilityChange = () => {
|
const handleVisibilityChange = () => {
|
||||||
// Double-check setting before doing anything (defensive check)
|
// Double-check setting before doing anything (defensive check)
|
||||||
@@ -812,17 +835,21 @@ export function useModerationQueueManager(
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (document.hidden) {
|
if (document.hidden) {
|
||||||
console.log('📴 Tab hidden - pausing queue updates');
|
console.log('👁️ [VISIBILITY HANDLER] Tab hidden - pausing fetches');
|
||||||
pauseFetchingRef.current = true;
|
pauseFetchingRef.current = true;
|
||||||
} else {
|
} else {
|
||||||
console.log('📱 Tab visible - resuming queue updates');
|
console.error('👁️ [VISIBILITY HANDLER] Tab visible - THIS IS WHERE THE REFRESH HAPPENS');
|
||||||
|
console.error(' 🔴 TAB FOCUS REFRESH TRIGGERED HERE');
|
||||||
|
console.error(' 📍 Stack trace below:');
|
||||||
|
console.trace();
|
||||||
|
|
||||||
pauseFetchingRef.current = false;
|
pauseFetchingRef.current = false;
|
||||||
|
|
||||||
if (initialFetchCompleteRef.current && !isMountingRef.current && fetchItemsRef.current) {
|
if (initialFetchCompleteRef.current && !isMountingRef.current && fetchItemsRef.current) {
|
||||||
console.log('🔄 Tab became visible - triggering refresh (setting enabled)');
|
console.error(' ➡️ Calling fetchItems(true) NOW');
|
||||||
fetchItemsRef.current(true);
|
fetchItemsRef.current(true);
|
||||||
} else {
|
} else {
|
||||||
console.log('⏭️ Tab became visible - skipping refresh (initial fetch not complete or mounting)');
|
console.log(' ⏭️ Skipping refresh (initial fetch not complete or mounting)');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -335,16 +335,24 @@ function AuthProviderComponent({ children }: { children: React.ReactNode }) {
|
|||||||
|
|
||||||
// Handle page visibility changes - only verify if inactive for >5 minutes
|
// Handle page visibility changes - only verify if inactive for >5 minutes
|
||||||
const handleVisibilityChange = () => {
|
const handleVisibilityChange = () => {
|
||||||
if (document.visibilityState === 'visible') {
|
|
||||||
const timeSinceLastCheck = Date.now() - lastVisibilityVerificationRef.current;
|
const timeSinceLastCheck = Date.now() - lastVisibilityVerificationRef.current;
|
||||||
const FIVE_MINUTES = 5 * 60 * 1000;
|
const FIVE_MINUTES = 5 * 60 * 1000;
|
||||||
|
|
||||||
|
console.log('🔐 [AUTH] Visibility changed', {
|
||||||
|
state: document.visibilityState,
|
||||||
|
timeSinceLastCheck: Math.round(timeSinceLastCheck / 1000) + 's',
|
||||||
|
willVerifySession: document.visibilityState === 'visible' && timeSinceLastCheck > FIVE_MINUTES
|
||||||
|
});
|
||||||
|
|
||||||
|
if (document.visibilityState === 'visible') {
|
||||||
if (timeSinceLastCheck > FIVE_MINUTES) {
|
if (timeSinceLastCheck > FIVE_MINUTES) {
|
||||||
authLog('[Auth] Tab visible after 5+ minutes, verifying session');
|
authLog('[Auth] Tab visible after 5+ minutes, verifying session');
|
||||||
|
console.log(' ⚠️ Verifying session - this may cause component re-renders');
|
||||||
lastVisibilityVerificationRef.current = Date.now();
|
lastVisibilityVerificationRef.current = Date.now();
|
||||||
verifySession();
|
verifySession();
|
||||||
} else {
|
} else {
|
||||||
authLog('[Auth] Tab visible, session recently verified, skipping');
|
authLog('[Auth] Tab visible, session recently verified, skipping');
|
||||||
|
console.log(' ✅ Session recently verified, skipping verification');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user