diff --git a/webui/src/components/ModelsDialog.tsx b/webui/src/components/ModelsDialog.tsx index d5ba733..c1218ca 100644 --- a/webui/src/components/ModelsDialog.tsx +++ b/webui/src/components/ModelsDialog.tsx @@ -88,20 +88,30 @@ const ModelsDialog: React.FC = ({ } }, [instanceName, isRunning]) - // Poll for models while dialog is open + // Fetch models when dialog opens useEffect(() => { if (!open || !isRunning) return // Initial fetch void fetchModels() + }, [open, isRunning, fetchModels]) - // Poll every 2 seconds + // Auto-refresh only when models are loading + useEffect(() => { + if (!open || !isRunning) return + + // Check if any model is in loading state + const hasLoadingModel = models.some(m => m.status.value === 'loading') + + if (!hasLoadingModel) return + + // Poll every 2 seconds when there's a loading model const interval = setInterval(() => { void fetchModels() }, 2000) return () => clearInterval(interval) - }, [open, isRunning, fetchModels]) + }, [open, isRunning, models, fetchModels]) // Load model const loadModel = async (modelName: string) => { @@ -110,7 +120,10 @@ const ModelsDialog: React.FC = ({ try { await llamaCppApi.loadModel(instanceName, modelName) - // Polling will pick up the change + // Wait a bit for the backend to process the load + await new Promise(resolve => setTimeout(resolve, 500)) + // Refresh models list after loading + await fetchModels() } catch (err) { setError(err instanceof Error ? err.message : 'Failed to load model') } finally { @@ -129,7 +142,10 @@ const ModelsDialog: React.FC = ({ try { await llamaCppApi.unloadModel(instanceName, modelName) - // Polling will pick up the change + // Wait a bit for the backend to process the unload + await new Promise(resolve => setTimeout(resolve, 500)) + // Refresh models list after unloading + await fetchModels() } catch (err) { setError(err instanceof Error ? err.message : 'Failed to unload model') } finally { @@ -230,7 +246,7 @@ const ModelsDialog: React.FC = ({