Refactor polling to prevent interruptions

This commit is contained in:
gpt-engineer-app[bot]
2025-10-03 19:12:50 +00:00
parent a2d3ed5ea4
commit b221c75d4a
3 changed files with 57 additions and 23 deletions

View File

@@ -56,6 +56,7 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
const isMobile = useIsMobile();
const [items, setItems] = useState<ModerationItem[]>([]);
const [loading, setLoading] = useState(true);
const [isInitialLoad, setIsInitialLoad] = useState(true);
const [actionLoading, setActionLoading] = useState<string | null>(null);
const [notes, setNotes] = useState<Record<string, string>>({});
const [activeEntityFilter, setActiveEntityFilter] = useState<EntityFilter>('all');
@@ -77,17 +78,20 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
// Expose refresh method via ref
useImperativeHandle(ref, () => ({
refresh: () => {
fetchItems(activeEntityFilter, activeStatusFilter);
fetchItems(activeEntityFilter, activeStatusFilter, false); // Manual refresh shows loading
}
}), [activeEntityFilter, activeStatusFilter]);
const fetchItems = async (entityFilter: EntityFilter = 'all', statusFilter: StatusFilter = 'pending') => {
const fetchItems = async (entityFilter: EntityFilter = 'all', statusFilter: StatusFilter = 'pending', silent = false) => {
if (!user) {
return;
}
try {
setLoading(true);
// Only show loading on initial load or filter change
if (!silent) {
setLoading(true);
}
let reviewStatuses: string[] = [];
let submissionStatuses: string[] = [];
@@ -346,29 +350,35 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
variant: "destructive",
});
} finally {
setLoading(false);
// Only clear loading if it was set
if (!silent) {
setLoading(false);
}
if (isInitialLoad) {
setIsInitialLoad(false);
}
}
};
// Initial fetch on mount and filter changes
useEffect(() => {
if (user) {
fetchItems(activeEntityFilter, activeStatusFilter);
fetchItems(activeEntityFilter, activeStatusFilter, false); // Show loading
}
}, [activeEntityFilter, activeStatusFilter, user]);
// Polling for auto-refresh
useEffect(() => {
if (!user || refreshMode !== 'auto') return;
if (!user || refreshMode !== 'auto' || isInitialLoad) return;
const interval = setInterval(() => {
fetchItems(activeEntityFilter, activeStatusFilter);
fetchItems(activeEntityFilter, activeStatusFilter, true); // Silent refresh
}, pollInterval);
return () => {
clearInterval(interval);
};
}, [user, refreshMode, pollInterval, activeEntityFilter, activeStatusFilter]);
}, [user, refreshMode, pollInterval, activeEntityFilter, activeStatusFilter, isInitialLoad]);
const handleResetToPending = async (item: ModerationItem) => {
setActionLoading(item.id);