pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-21 03:51:12 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat: Implement comprehensive re-render optimizations

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-10-10 14:42:57 +00:00
parent d7a20b7979
commit 2626afc59d
2 changed files with 76 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/components/moderation/ModerationQueue.tsx
View File

@@ -494,14 +494,28 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
break;
case 'replace':
// Full refresh: replace entire queue
setItems(moderationItems);
// Smart refresh: only update if data actually changed
const mergeResult = smartMergeArray(itemsRef.current, moderationItems, {
compareFields: ['status', 'content', 'reviewed_at', 'reviewed_by', 'reviewer_notes', 'assigned_to', 'locked_until'],
preserveOrder: false,
addToTop: false,
});
if (mergeResult.hasChanges) {
setItems(mergeResult.items);
console.log('🔄 Queue updated (replace mode):', {
added: mergeResult.changes.added.length,
removed: mergeResult.changes.removed.length,
updated: mergeResult.changes.updated.length,
});
} else {
console.log('✅ Queue unchanged (replace mode) - no visual updates needed');
}
if (!currentPreserveInteraction) {
// Reset interaction state if not preserving
setPendingNewItems([]);
setNewItemsCount(0);
}
console.log('🔄 Queue replaced (replace mode) - full refresh with', moderationItems.length, 'items');
break;
default:
@@ -821,7 +835,15 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
if (wasInQueue && !shouldBeInQueue) {
// Submission moved out of current filter (e.g., pending → approved)
console.log('❌ Submission moved out of queue:', updatedSubmission.id);
setItems(prev => prev.filter(i => i.id !== updatedSubmission.id));
setItems(prev => {
const exists = prev.some(i => i.id === updatedSubmission.id);
if (!exists) {
console.log('✅ Realtime: Item already removed', updatedSubmission.id);
return prev; // Keep existing array reference
}
console.log('❌ Realtime: Removing item from queue', updatedSubmission.id);
return prev.filter(i => i.id !== updatedSubmission.id);
});
} else if (shouldBeInQueue) {
// Submission should be in queue - update it
console.log('🔄 Submission updated in queue:', updatedSubmission.id);
@@ -870,10 +892,32 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
// Update or add to queue
setItems(prev => {
const exists = prev.some(i => i.id === fullItem.id);
if (exists) {
// Check if item actually changed before updating
const currentItem = prev.find(i => i.id === fullItem.id);
if (!currentItem) return prev;
// Deep comparison of critical fields
const hasChanged =
currentItem.status !== fullItem.status ||
currentItem.reviewed_at !== fullItem.reviewed_at ||
currentItem.reviewed_by !== fullItem.reviewed_by ||
currentItem.reviewer_notes !== fullItem.reviewer_notes ||
currentItem.assigned_to !== fullItem.assigned_to ||
currentItem.locked_until !== fullItem.locked_until ||
JSON.stringify(currentItem.content) !== JSON.stringify(fullItem.content);
if (!hasChanged) {
console.log('✅ Realtime UPDATE: No changes detected for', fullItem.id);
return prev; // Keep existing array reference
}
console.log('🔄 Realtime UPDATE: Changes detected for', fullItem.id);
return prev.map(i => i.id === fullItem.id ? fullItem : i);
} else {
return [fullItem, ...prev]; // Add at top
console.log('🆕 Realtime UPDATE: Adding new item', fullItem.id);
return [fullItem, ...prev];
}
});
} catch (error) {