mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-22 11:11:14 -05:00
Fix: Simplify moderation queue tab focus reload
This commit is contained in:
@@ -29,31 +29,15 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
|
||||
const { isAdmin, isSuperuser } = useUserRole();
|
||||
const adminSettings = useAdminSettings();
|
||||
|
||||
// Memoize settings to prevent unnecessary effect re-runs
|
||||
// Get actual values from admin settings
|
||||
const refreshMode = adminSettings.getAdminPanelRefreshMode();
|
||||
const pollInterval = adminSettings.getAdminPanelPollInterval();
|
||||
const refreshStrategy = adminSettings.getAutoRefreshStrategy();
|
||||
const preserveInteraction = adminSettings.getPreserveInteractionState();
|
||||
const useRealtimeQueue = adminSettings.getUseRealtimeQueue();
|
||||
const refreshOnTabVisible = adminSettings.getRefreshOnTabVisible();
|
||||
|
||||
// Memoize settings object based on actual values, not function references
|
||||
// Memoize settings - call functions inside useMemo to avoid recreating on every render
|
||||
const settings = useMemo(() => ({
|
||||
refreshMode,
|
||||
pollInterval,
|
||||
refreshStrategy,
|
||||
preserveInteraction,
|
||||
useRealtimeQueue,
|
||||
refreshOnTabVisible,
|
||||
}), [
|
||||
refreshMode,
|
||||
pollInterval,
|
||||
refreshStrategy,
|
||||
preserveInteraction,
|
||||
useRealtimeQueue,
|
||||
refreshOnTabVisible,
|
||||
]);
|
||||
refreshMode: adminSettings.getAdminPanelRefreshMode(),
|
||||
pollInterval: adminSettings.getAdminPanelPollInterval(),
|
||||
refreshStrategy: adminSettings.getAutoRefreshStrategy(),
|
||||
preserveInteraction: adminSettings.getPreserveInteractionState(),
|
||||
useRealtimeQueue: adminSettings.getUseRealtimeQueue(),
|
||||
refreshOnTabVisible: adminSettings.getRefreshOnTabVisible(),
|
||||
}), [adminSettings]);
|
||||
|
||||
// Initialize queue manager (replaces all state management, fetchItems, effects)
|
||||
const queueManager = useModerationQueueManager({
|
||||
|
||||
@@ -894,67 +894,27 @@ export function useModerationQueueManager(config: ModerationQueueManagerConfig):
|
||||
};
|
||||
}, [user, settings.refreshMode, settings.pollInterval, loadingState, settings.useRealtimeQueue]);
|
||||
|
||||
// Extract the boolean value to prevent effect re-runs when settings object changes
|
||||
const isRefreshOnTabVisibleEnabled = settings.refreshOnTabVisible === true;
|
||||
|
||||
// Visibility change handler
|
||||
// Visibility change handler - SIMPLIFIED
|
||||
useEffect(() => {
|
||||
console.log("🔍 [VISIBILITY EFFECT] Hard check", {
|
||||
refreshOnTabVisible: settings.refreshOnTabVisible,
|
||||
typeOf: typeof settings.refreshOnTabVisible,
|
||||
isRefreshOnTabVisibleEnabled,
|
||||
willAttachListener: isRefreshOnTabVisibleEnabled,
|
||||
timestamp: new Date().toISOString(),
|
||||
});
|
||||
|
||||
// Early return if feature is disabled
|
||||
if (!isRefreshOnTabVisibleEnabled) {
|
||||
console.log(" ✅ Feature DISABLED - skipping all visibility logic");
|
||||
console.log(" ✅ Tab focus will NOT trigger refreshes");
|
||||
|
||||
// Cleanup: ensure no lingering handlers
|
||||
return () => {
|
||||
console.log(" 🧹 Cleanup: Ensuring no visibility listeners exist");
|
||||
};
|
||||
}
|
||||
|
||||
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)
|
||||
if (!isRefreshOnTabVisibleEnabled) {
|
||||
console.log("⚠️ Visibility handler called but setting is disabled - ignoring");
|
||||
// Don't attach listener if feature is disabled
|
||||
if (!settings.refreshOnTabVisible) {
|
||||
return;
|
||||
}
|
||||
|
||||
const handleVisibilityChange = () => {
|
||||
if (document.hidden) {
|
||||
console.log("👁️ [VISIBILITY HANDLER] Tab hidden - pausing fetches");
|
||||
pauseFetchingRef.current = true;
|
||||
} else {
|
||||
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.error(" ➡️ Calling fetchItems(true) NOW");
|
||||
fetchItemsRef.current(true);
|
||||
} else {
|
||||
console.log(" ⏭️ Skipping refresh (initial fetch not complete or mounting)");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
document.addEventListener("visibilitychange", handleVisibilityChange);
|
||||
return () => {
|
||||
document.removeEventListener("visibilitychange", handleVisibilityChange);
|
||||
console.log("🧹 Visibility listener removed");
|
||||
};
|
||||
}, [isRefreshOnTabVisibleEnabled]);
|
||||
return () => document.removeEventListener("visibilitychange", handleVisibilityChange);
|
||||
}, [settings.refreshOnTabVisible]);
|
||||
|
||||
// Initialize realtime subscriptions
|
||||
useRealtimeSubscriptions({
|
||||
|
||||
Reference in New Issue
Block a user