matt/inventory
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix reattaching to currently running jobs on load

Browse Source
This commit is contained in:
Matt
2025-01-15 10:16:33 -05:00
parent 0f5e5f75cd
commit 6940b2fe7b
1 changed files with 61 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
inventory/src/components/settings/DataManagement.tsx
View File

@@ -1,7 +1,7 @@
import { useState, useEffect } from 'react'; import { useState, useEffect } from 'react';
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Progress } from "@/components/ui/progress"; import { Progress } from "@/components/ui/progress"; // Import Progress component from shadcn
import { import {
AlertDialog, AlertDialog,
AlertDialogAction, AlertDialogAction,
@@ -128,7 +128,7 @@ export function DataManagement() {
}; };
// Helper function to render progress // Helper function to render progress
const renderProgress = (progress: any) => { const renderProgress = (progress: any, operationType: 'update' | 'import' | 'reset' | 'reset-metrics' | 'calculate-metrics') => {
if (!progress) return null; if (!progress) return null;
const status = progress.status?.toLowerCase(); const status = progress.status?.toLowerCase();
@@ -156,12 +156,10 @@ export function DataManagement() {
{isFinished ? statusText : `${percent}%`} {isFinished ? statusText : `${percent}%`}
</span> </span>
</div> </div>
<div className="w-full bg-gray-200 rounded-full h-2.5"> <Progress
<div value={percent}
className={`h-2.5 rounded-full ${barColor} transition-all duration-500`} className={barColor}
style={{ width: isFinished ? '100%' : `${percent}%` }} />
/>
</div>
{/* Additional details */} {/* Additional details */}
<div className="flex flex-col gap-1 text-xs text-gray-600"> <div className="flex flex-col gap-1 text-xs text-gray-600">
{/* Progress details (only show during active progress) */} {/* Progress details (only show during active progress) */}
@@ -205,7 +203,7 @@ export function DataManagement() {
)} )}
{/* Error message */} {/* Error message */}
{isError && progress.error && !progress.error.includes('cancelled') && !cancelledOperations.has(type) && ( {isError && progress.error && !progress.error.includes('cancelled') && !cancelledOperations.has(operationType) && (
<div className="text-red-600 whitespace-pre-wrap"> <div className="text-red-600 whitespace-pre-wrap">
{progress.error} {progress.error}
</div> </div>
@@ -492,6 +490,7 @@ export function DataManagement() {
// Check status on mount and periodically // Check status on mount and periodically
useEffect(() => { useEffect(() => {
const checkStatus = async () => { const checkStatus = async () => {
console.log('Checking status...');
try { try {
// Check all operations in parallel // Check all operations in parallel
const [metricsResponse, importResponse] = await Promise.all([ const [metricsResponse, importResponse] = await Promise.all([
@@ -503,14 +502,25 @@ export function DataManagement() {
}).catch(() => null) }).catch(() => null)
]); ]);
console.log('Got responses:', {
metricsOk: metricsResponse?.ok,
importOk: importResponse?.ok
});
// Handle metrics status // Handle metrics status
if (metricsResponse?.ok) { if (metricsResponse?.ok) {
const metricsData = await metricsResponse.json().catch(() => null); const metricsData = await metricsResponse.json().catch(() => null);
if (metricsData?.active) { console.log('Metrics data:', metricsData);
if (metricsData?.status === 'running' || metricsData?.active) {
console.log('Metrics calculation is running');
setIsCalculatingMetrics(true); setIsCalculatingMetrics(true);
setMetricsProgress(metricsData.progress); setMetricsProgress(metricsData.progress || metricsData);
connectToEventSource('calculate-metrics'); if (!eventSource) {
connectToEventSource('calculate-metrics');
}
} else if (metricsData?.lastStatus) { } else if (metricsData?.lastStatus) {
console.log('Setting last metrics status');
setLastMetricsStatus(metricsData.lastStatus); setLastMetricsStatus(metricsData.lastStatus);
} }
} }
@@ -518,35 +528,50 @@ export function DataManagement() {
// Handle import/update/reset status // Handle import/update/reset status
if (importResponse?.ok) { if (importResponse?.ok) {
const importData = await importResponse.json().catch(() => null); const importData = await importResponse.json().catch(() => null);
if (importData?.active) { console.log('Import data:', importData);
const operation = importData.progress?.operation?.toLowerCase() || '';
if (importData?.status === 'running' || importData?.active) {
console.log('Found running operation:', importData);
const operation = (importData.progress?.operation || importData.operation || '').toLowerCase();
if (operation.includes('import')) { if (operation.includes('import')) {
console.log('Import is running');
setIsImporting(true); setIsImporting(true);
if (operation.includes('purchase orders')) { if (operation.includes('purchase orders')) {
setPurchaseOrdersProgress(importData.progress); setPurchaseOrdersProgress(importData.progress || importData);
} else { } else {
setImportProgress(importData.progress); setImportProgress(importData.progress || importData);
}
if (!eventSource) {
connectToEventSource('import');
} }
connectToEventSource('import');
} else if (operation.includes('update')) { } else if (operation.includes('update')) {
console.log('Update is running');
setIsUpdating(true); setIsUpdating(true);
setUpdateProgress(importData.progress); setUpdateProgress(importData.progress || importData);
connectToEventSource('update'); if (!eventSource) {
connectToEventSource('update');
}
} else if (operation.includes('reset')) { } else if (operation.includes('reset')) {
if (operation.includes('metrics')) { if (operation.includes('metrics')) {
console.log('Reset metrics is running');
setIsResettingMetrics(true); setIsResettingMetrics(true);
setResetMetricsProgress(importData.progress); setResetMetricsProgress(importData.progress || importData);
connectToEventSource('reset-metrics'); if (!eventSource) {
connectToEventSource('reset-metrics');
}
} else { } else {
console.log('Reset is running');
setIsResetting(true); setIsResetting(true);
setResetProgress(importData.progress); setResetProgress(importData.progress || importData);
connectToEventSource('reset'); if (!eventSource) {
connectToEventSource('reset');
}
} }
} }
} else if (importData?.lastStatus) { } else if (importData?.lastStatus) {
// Handle last status based on operation type console.log('Setting last status for:', importData.lastStatus?.operation);
const operation = importData.lastStatus?.operation?.toLowerCase() || ''; const operation = (importData.lastStatus?.operation || '').toLowerCase();
if (operation.includes('import')) { if (operation.includes('import')) {
setLastImportStatus(importData.lastStatus); setLastImportStatus(importData.lastStatus);
} else if (operation.includes('update')) { } else if (operation.includes('update')) {
@@ -565,11 +590,14 @@ export function DataManagement() {
} }
}; };
// Check status immediately and then every 5 seconds console.log('Setting up status check interval');
checkStatus(); checkStatus();
const interval = setInterval(checkStatus, 5000); const interval = setInterval(checkStatus, 5000);
return () => clearInterval(interval); return () => {
console.log('Cleaning up status check interval');
clearInterval(interval);
};
}, []); }, []);
const handleUpdateCSV = async () => { const handleUpdateCSV = async () => {
@@ -845,7 +873,7 @@ export function DataManagement() {
)} )}
</div> </div>
{(isUpdating || lastUpdateStatus) && renderProgress(updateProgress || lastUpdateStatus)} {(isUpdating || lastUpdateStatus) && renderProgress(updateProgress || lastUpdateStatus, 'update')}
</CardContent> </CardContent>
</Card> </Card>
@@ -887,8 +915,8 @@ export function DataManagement() {
{(isImporting || lastImportStatus) && ( {(isImporting || lastImportStatus) && (
<div className="space-y-4"> <div className="space-y-4">
{renderProgress(importProgress || lastImportStatus)} {renderProgress(importProgress || lastImportStatus, 'import')}
{renderProgress(purchaseOrdersProgress)} {renderProgress(purchaseOrdersProgress, 'import')}
</div> </div>
)} )}
</CardContent> </CardContent>
@@ -930,7 +958,7 @@ export function DataManagement() {
)} )}
</div> </div>
{(isCalculatingMetrics || lastMetricsStatus) && renderProgress(metricsProgress || lastMetricsStatus)} {(isCalculatingMetrics || lastMetricsStatus) && renderProgress(metricsProgress || lastMetricsStatus, 'calculate-metrics')}
</CardContent> </CardContent>
</Card> </Card>
@@ -1000,13 +1028,13 @@ export function DataManagement() {
{(resetProgress || lastResetStatus) && ( {(resetProgress || lastResetStatus) && (
<div className="mt-4"> <div className="mt-4">
{renderProgress(resetProgress || lastResetStatus)} {renderProgress(resetProgress || lastResetStatus, 'reset')}
</div> </div>
)} )}
{(resetMetricsProgress || lastResetMetricsStatus) && ( {(resetMetricsProgress || lastResetMetricsStatus) && (
<div className="mt-4"> <div className="mt-4">
{renderProgress(resetMetricsProgress || lastResetMetricsStatus)} {renderProgress(resetMetricsProgress || lastResetMetricsStatus, 'reset-metrics')}
</div> </div>
)} )}
</CardContent> </CardContent>