mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-21 06:51:12 -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) => {
|
||||
if (!user) return;
|
||||
|
||||
// Check if tab is hidden
|
||||
if (pauseFetchingRef.current || document.hidden) {
|
||||
console.log('⏸️ Fetch paused (tab hidden)');
|
||||
// Get caller info
|
||||
const callerStack = new Error().stack;
|
||||
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;
|
||||
}
|
||||
|
||||
@@ -794,15 +806,26 @@ export function useModerationQueueManager(
|
||||
|
||||
// Visibility change handler
|
||||
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
|
||||
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;
|
||||
}
|
||||
|
||||
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 = () => {
|
||||
// Double-check setting before doing anything (defensive check)
|
||||
@@ -812,17 +835,21 @@ export function useModerationQueueManager(
|
||||
}
|
||||
|
||||
if (document.hidden) {
|
||||
console.log('📴 Tab hidden - pausing queue updates');
|
||||
console.log('👁️ [VISIBILITY HANDLER] Tab hidden - pausing fetches');
|
||||
pauseFetchingRef.current = true;
|
||||
} 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;
|
||||
|
||||
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);
|
||||
} 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
|
||||
const handleVisibilityChange = () => {
|
||||
if (document.visibilityState === 'visible') {
|
||||
const timeSinceLastCheck = Date.now() - lastVisibilityVerificationRef.current;
|
||||
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) {
|
||||
authLog('[Auth] Tab visible after 5+ minutes, verifying session');
|
||||
console.log(' ⚠️ Verifying session - this may cause component re-renders');
|
||||
lastVisibilityVerificationRef.current = Date.now();
|
||||
verifySession();
|
||||
} else {
|
||||
authLog('[Auth] Tab visible, session recently verified, skipping');
|
||||
console.log(' ✅ Session recently verified, skipping verification');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user