fix(settings): the power-supply panel crashed the window when opened

It held a useState and a useEffect of its own, and the panels in that registry
are called as plain functions — PANELS[x]() — not rendered as elements. So its
hooks landed in SettingsModal's own hook list, and only while that section was
open: React counted more hooks than the render before and stopped drawing the
whole window (error #310).

The file says so three lines above the entry I added, on the two panels that DO
carry hooks and are therefore wrapped in JSX. Reading it would have been quicker
than the screenshot.

No hook here now. The COM ports come from the list SettingsModal already loads
when it opens, for the Winkeyer panel — one machine, one set of serial ports,
fetched once instead of twice.
This commit is contained in:
2026-08-16 13:18:47 +02:00
parent 8683a450a7
commit 0924062ced
+9 -2
View File
@@ -3394,9 +3394,16 @@ export function SettingsModal({ onClose, onSaved, initialSection, onMainPaneChan
// register — the output on/off. The voltage and current SET points are shown // register — the output on/off. The voltage and current SET points are shown
// because they are worth seeing, and are not editable here: they belong to the // because they are worth seeing, and are not editable here: they belong to the
// supply's front panel, and a logbook that can set them can set them wrong. // supply's front panel, and a logbook that can set them can set them wrong.
// NO HOOKS IN HERE. This panel is called as a plain function, like its
// neighbours — PANELS[x]() — so a useState of its own lands in SettingsModal's
// hook list and only while this section is open. React counts those, and it
// stopped drawing the moment the section was clicked (error #310, "rendered
// more hooks than during the previous render"). The COM ports come from the
// list SettingsModal already loads for the Winkeyer panel: one machine, one
// set of serial ports, loaded once.
function PSUPanelSettings() { function PSUPanelSettings() {
const [ports, setPorts] = useState<string[]>([]); const ports = wkPorts;
useEffect(() => { ListSerialPorts().then((p) => setPorts((p ?? []) as string[])).catch(() => setPorts([])); }, []); const setPorts = setWkPorts;
return ( return (
<> <>
<SectionHeader title={t('psu.title')} hint={t('psu.hint')} /> <SectionHeader title={t('psu.title')} hint={t('psu.hint')} />