Refactor: Apply smart merging to all refreshes

This commit is contained in:
gpt-engineer-app[bot]
2025-10-06 19:43:36 +00:00
parent fd20c02e5e
commit c3b0ae3d76

View File

@@ -520,55 +520,58 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
return a.id.localeCompare(b.id); return a.id.localeCompare(b.id);
}); });
// Use smart merging for silent refreshes if strategy is 'merge' // ALWAYS use smart merge to detect actual changes (prevents flashing)
if (silent && refreshStrategy === 'merge') { const mergeResult = smartMergeArray(items, formattedItems, {
const mergeResult = smartMergeArray(items, formattedItems, { compareFields: ['status', 'reviewed_at', 'reviewed_by', 'reviewer_notes', 'submission_type', 'entity_name', 'park_name'],
compareFields: ['status', 'reviewed_at', 'reviewed_by', 'reviewer_notes', 'submission_type', 'entity_name', 'park_name'], preserveOrder: silent, // Only preserve order for silent refreshes
preserveOrder: true, addToTop: true,
addToTop: true, });
// Only update state if there are actual changes
if (mergeResult.hasChanges) {
const actuallyNewItems = mergeResult.changes.added.length;
// Debug logging for smart merge
console.log('🔄 Smart merge detected changes:', {
added: actuallyNewItems,
updated: mergeResult.changes.updated.length,
removed: mergeResult.changes.removed.length,
totalItems: mergeResult.items.length,
silent,
}); });
// Only update state if there are actual changes // Only apply protection map for silent refreshes
if (mergeResult.hasChanges) { let finalItems = mergeResult.items;
const actuallyNewItems = mergeResult.changes.added.length; if (silent && preserveInteraction && interactingWith.size > 0) {
finalItems = mergeResult.items.map(item => {
// Debug logging for smart merge if (interactingWith.has(item.id)) {
console.log('🔄 Smart merge detected changes:', { const currentItem = items.find(i => i.id === item.id);
added: actuallyNewItems, return currentItem || item;
updated: mergeResult.changes.updated.length, }
removed: mergeResult.changes.removed.length, return item;
totalItems: mergeResult.items.length,
}); });
}
// Only apply protection map if needed
let finalItems = mergeResult.items;
if (preserveInteraction && interactingWith.size > 0) {
finalItems = mergeResult.items.map(item => {
if (interactingWith.has(item.id)) {
const currentItem = items.find(i => i.id === item.id);
return currentItem || item;
}
return item;
});
}
// Only call setItems if reference has actually changed // Only call setItems if reference has actually changed
if (finalItems !== items) { if (finalItems !== items) {
setItems(finalItems); setItems(finalItems);
} }
// Only set new items count if there are genuinely new items // For non-silent refreshes, reset the counter
if (actuallyNewItems > 0) { if (!silent) {
setNewItemsCount(actuallyNewItems); setNewItemsCount(0);
} } else if (actuallyNewItems > 0) {
} else { // For silent refreshes, show new items count
// No changes detected - skip all state updates setNewItemsCount(actuallyNewItems);
console.log('✅ No changes detected, keeping current state');
} }
} else { } else {
// Full replacement for non-silent refreshes or 'replace' strategy // No changes detected - skip all state updates
setItems(formattedItems); console.log('✅ No changes detected, keeping current state');
setNewItemsCount(0);
// For non-silent refreshes, still reset the counter even if no changes
if (!silent) {
setNewItemsCount(0);
}
} }
} catch (error: any) { } catch (error: any) {
console.error('Error fetching moderation items:', error); console.error('Error fetching moderation items:', error);