Fix SolidJS proxy error in batched WebSocket updates

Using reconcile() inside produce() is invalid - reconcile returns a
function that creates a new proxy, but produce expects direct mutations.
Use batch() from solid-js instead to atomically batch the two setState
calls without proxy conflicts.
This commit is contained in:
rcourtman 2025-11-29 18:54:22 +00:00
parent 8bc8a98bb8
commit fbabace023

View file

@ -1,4 +1,4 @@
import { createSignal, onCleanup } from 'solid-js'; import { createSignal, onCleanup, batch } from 'solid-js';
import { createStore, produce, reconcile } from 'solid-js/store'; import { createStore, produce, reconcile } from 'solid-js/store';
import type { import type {
State, State,
@ -472,12 +472,10 @@ export function createWebSocketStore(url: string) {
// Apply updates - batch together if both are present to prevent flapping // Apply updates - batch together if both are present to prevent flapping
if (shouldApplyDockerHosts && processedHosts !== null) { if (shouldApplyDockerHosts && processedHosts !== null) {
// Both dockerHosts and hosts in this message - batch them atomically // Both dockerHosts and hosts in this message - batch them atomically
setState( batch(() => {
produce((s: State) => { setState('dockerHosts', reconcile(processedDockerHosts!, { key: 'id' }));
s.dockerHosts = reconcile(processedDockerHosts!, { key: 'id' })(s.dockerHosts); setState('hosts', reconcile(processedHosts!, { key: 'id' }));
s.hosts = reconcile(processedHosts!, { key: 'id' })(s.hosts); });
})
);
// Lifecycle cleanup for Docker hosts and containers // Lifecycle cleanup for Docker hosts and containers
const hostIds = new Set(processedDockerHosts!.map((h: DockerHost) => h.id).filter(Boolean)); const hostIds = new Set(processedDockerHosts!.map((h: DockerHost) => h.id).filter(Boolean));