From 74755c383d506adf6887653beb80ab363ecf5f03 Mon Sep 17 00:00:00 2001 From: Claude Date: Mon, 3 Nov 2025 06:38:55 +0000 Subject: [PATCH] Fix nicegui-highcharts import error in monitor.py Root cause: The nicegui-highcharts package does not export a HighChart class. Instead, it extends NiceGUI by adding ui.highchart() to the ui namespace. Changes: - Removed incorrect import: from nicegui_highcharts import HighChart - Changed all HighChart() calls to ui.highchart() - Updated .context/IMPLEMENTATION_FIXES.md to reflect correct usage This fixes the ImportError: cannot import name 'HighChart' from 'nicegui_highcharts' The correct usage is to install nicegui-highcharts (already in pixi.toml), which automatically adds the highchart element to NiceGUI's ui namespace. Tested: - Ruff lint: passed - Python syntax check: passed - Code follows NiceGUI highcharts plugin documentation pattern --- .context/IMPLEMENTATION_FIXES.md | 13 +++++++------ src/msquant/app/pages/monitor.py | 15 +++++++-------- 2 files changed, 14 insertions(+), 14 deletions(-) diff --git a/.context/IMPLEMENTATION_FIXES.md b/.context/IMPLEMENTATION_FIXES.md index 6119b37..8b87051 100644 --- a/.context/IMPLEMENTATION_FIXES.md +++ b/.context/IMPLEMENTATION_FIXES.md @@ -49,7 +49,7 @@ This document summarizes the fixes applied to address issues identified during t **Files Modified:** - `src/msquant/app/pages/monitor.py` - Complete rewrite with charts - - Imports `nicegui_highcharts.HighChart` with graceful fallback + - Uses `ui.highchart()` from NiceGUI (after installing nicegui-highcharts plugin) - GPU selector dropdown for multi-GPU systems - Four real-time charts: - GPU Utilization (0-100%) @@ -62,7 +62,7 @@ This document summarizes the fixes applied to address issues identified during t **Features:** - Responsive 2-column grid layout - Auto-refreshing every second -- Graceful degradation if nicegui-highcharts unavailable +- Requires nicegui-highcharts plugin to be installed - Cancel button now disabled when job not running --- @@ -193,10 +193,11 @@ Chart update cycle: 5. Update chart: `chart.options['series'][0]['data'] = new_data` 6. Call `chart.update()` to re-render -Graceful fallback: -- Imports `HighChart` with try/except -- Shows warning message if plugin unavailable -- Text summary still works without charts +Installation note: +- The `nicegui-highcharts` plugin must be installed via pip +- After installation, it adds `ui.highchart()` to NiceGUI's API +- No direct import of `HighChart` class is needed +- Charts are created using `ui.highchart(config_dict).classes('w-full')` --- diff --git a/src/msquant/app/pages/monitor.py b/src/msquant/app/pages/monitor.py index 201ef63..528918a 100644 --- a/src/msquant/app/pages/monitor.py +++ b/src/msquant/app/pages/monitor.py @@ -1,6 +1,5 @@ """Monitor page for tracking job progress and GPU metrics.""" from nicegui import ui -from nicegui_highcharts import HighChart # type: ignore[import-untyped] from msquant.services import JobService from msquant.core.monitoring import GPUMonitor @@ -51,22 +50,22 @@ def create_monitor_page(job_service: JobService, gpu_monitor: GPUMonitor): with ui.grid(columns=2).classes('w-full gap-4'): # Utilization chart - util_chart = HighChart( + util_chart = ui.highchart( build_line_chart("GPU Utilization", "Utilization", "%", y_max=100) ).classes('w-full') - + # Memory chart - mem_chart = HighChart( + mem_chart = ui.highchart( build_line_chart("GPU Memory", "Memory", "%", y_max=100) ).classes('w-full') - + # Temperature chart - temp_chart = HighChart( + temp_chart = ui.highchart( build_line_chart("GPU Temperature", "Temperature", "°C") ).classes('w-full') - + # Power chart - power_chart = HighChart( + power_chart = ui.highchart( build_line_chart("GPU Power", "Power", "W") ).classes('w-full')