49 lines
1.5 KiB
React
49 lines
1.5 KiB
React
import { render } from "solid-js/web";
|
|
import { createStore } from "solid-js/store";
|
|
import { HierarchyApp } from "../components/HierarchyApp";
|
|
|
|
export const HierarchyBridge = {
|
|
mounted() {
|
|
console.log("HierarchyBridge mounted");
|
|
|
|
// 1. Initialize store
|
|
const initialSprings = JSON.parse(this.el.dataset.initialSprings || "[]");
|
|
|
|
const [state, setState] = createStore({
|
|
springs: initialSprings,
|
|
rivers: {}, // Map spring_id -> rivers
|
|
streams: {}, // Map river_id -> streams
|
|
trenches: {}, // Map stream_id -> trenches
|
|
activeSpringId: null,
|
|
activeRiverId: null,
|
|
activeStreamId: null
|
|
});
|
|
|
|
// 2. Render parameters
|
|
this._cleanup = render(() => (
|
|
<HierarchyApp
|
|
state={state}
|
|
push={(e, p) => this.pushEvent(e, p)}
|
|
setState={setState}
|
|
/>
|
|
), this.el);
|
|
|
|
// 3. Listen for server assignments
|
|
this.handleEvent("update_rivers", ({ spring_id, rivers }) => {
|
|
setState("rivers", spring_id, rivers);
|
|
});
|
|
|
|
this.handleEvent("update_streams", ({ river_id, streams }) => {
|
|
setState("streams", river_id, streams);
|
|
});
|
|
|
|
this.handleEvent("update_trenches", ({ stream_id, trenches }) => {
|
|
setState("trenches", stream_id, trenches);
|
|
});
|
|
},
|
|
|
|
destroyed() {
|
|
if (this._cleanup) this._cleanup();
|
|
}
|
|
};
|