Refactor: Implement system activity log fixes

This commit is contained in:
gpt-engineer-app[bot]
2025-10-11 16:04:28 +00:00
parent f37b99a5f9
commit 120f68c926
3 changed files with 89 additions and 3 deletions

View File

@@ -130,6 +130,7 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
const isMountingRef = useRef(true);
const initialFetchCompleteRef = useRef(false);
const FETCH_COOLDOWN_MS = 1000;
const pauseFetchingRef = useRef(false);
// Pagination state
const [currentPage, setCurrentPage] = useState(1);
@@ -217,6 +218,12 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
return;
}
// Check if tab is hidden - pause all fetching
if (pauseFetchingRef.current || document.hidden) {
console.log('⏸️ Fetch paused (tab hidden)');
return;
}
// Prevent concurrent calls - race condition guard
if (fetchInProgressRef.current) {
console.log('⚠️ Fetch already in progress, skipping duplicate call');
@@ -803,6 +810,12 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
async (payload) => {
const newSubmission = payload.new as any;
// Queue updates if tab is hidden
if (document.hidden) {
console.log('📴 Realtime event received while hidden - queuing for later');
return;
}
// Ignore if recently removed (optimistic update)
if (recentlyRemovedRef.current.has(newSubmission.id)) {
return;
@@ -977,6 +990,12 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
async (payload) => {
const updatedSubmission = payload.new as any;
// Queue updates if tab is hidden
if (document.hidden) {
console.log('📴 Realtime UPDATE received while hidden - queuing for later');
return;
}
// Ignore if recently removed (optimistic update in progress)
if (recentlyRemovedRef.current.has(updatedSubmission.id)) {
console.log('⏭️ Ignoring UPDATE for recently removed submission:', updatedSubmission.id);
@@ -1146,6 +1165,27 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
};
}, [user, useRealtimeQueue, debouncedRealtimeUpdate]);
// Visibility change handler - pause queue updates when tab is hidden
useEffect(() => {
const handleVisibilityChange = () => {
if (document.hidden) {
console.log('📴 Tab hidden - pausing queue updates');
pauseFetchingRef.current = true;
} else {
console.log('📱 Tab visible - resuming queue updates');
pauseFetchingRef.current = false;
// Optional: trigger single refresh when tab becomes visible
if (initialFetchCompleteRef.current && !isMountingRef.current) {
console.log('🔄 Tab became visible - triggering refresh');
fetchItems(filtersRef.current.entityFilter, filtersRef.current.statusFilter, true, activeTab);
}
}
};
document.addEventListener('visibilitychange', handleVisibilityChange);
return () => document.removeEventListener('visibilitychange', handleVisibilityChange);
}, [fetchItems, activeTab]);
const handleResetToPending = async (item: ModerationItem) => {
setActionLoading(item.id);
try {