@@ -26,7 +26,7 @@ export function mountLayoutWithWebSocket(mountElement, endpoint) {
26
26
27
27
const ws = new WebSocket ( endpoint ) ;
28
28
29
- function registerUpdateCallback ( update ) {
29
+ function saveUpdateHook ( update ) {
30
30
ws . onmessage = ( event ) => {
31
31
const [ pathPrefix , patch ] = JSON . parse ( event . data ) ;
32
32
update ( pathPrefix , patch ) ;
@@ -42,28 +42,33 @@ export function mountLayoutWithWebSocket(mountElement, endpoint) {
42
42
) ;
43
43
}
44
44
45
- return mountLayout ( mountElement , registerUpdateCallback , sendCallback ) ;
45
+ return mountLayout ( mountElement , saveUpdateHook , sendCallback ) ;
46
46
}
47
47
48
- export function mountLayout (
49
- mountElement ,
50
- registerUpdateCallback ,
51
- sendCallback
52
- ) {
53
- return reactDOM . render (
54
- html `< ${ Layout }
55
- registerUpdateCallback =${ registerUpdateCallback }
56
- sendCallback=${ sendCallback }
57
- /> ` ,
48
+ export function mountLayout ( mountElement , saveUpdateHook , sendEvent ) {
49
+ const updateHook = { current : null } ;
50
+
51
+ function setUpdateHook ( hook ) {
52
+ updateHook . current = hook ;
53
+ }
54
+
55
+ reactDOM . render (
56
+ html `< ${ Layout } setUpdateHook =${ setUpdateHook } sendEvent=${ sendEvent } /> ` ,
58
57
mountElement
59
58
) ;
59
+
60
+ saveUpdateHook ( ( pathPrefix , patch ) => {
61
+ if ( updateHook . current ) {
62
+ updateHook . current ( pathPrefix , patch ) ;
63
+ }
64
+ } ) ;
60
65
}
61
66
62
- export default function Layout ( { registerUpdateCallback , sendCallback } ) {
67
+ export default function Layout ( { setUpdateHook , sendEvent } ) {
63
68
const [ model , setModel ] = react . useState ( { } ) ;
64
69
65
70
react . useEffect ( ( ) => {
66
- registerUpdateCallback ( ( pathPrefix , patch ) => {
71
+ setUpdateHook ( ( pathPrefix , patch ) => {
67
72
setModel (
68
73
jsonpatch . applyPatch (
69
74
model ,
@@ -79,7 +84,7 @@ export default function Layout({ registerUpdateCallback, sendCallback }) {
79
84
} , [ model ] ) ;
80
85
81
86
if ( model . tagName ) {
82
- return html `< ${ Element } sendEvent =${ sendCallback } model=${ model } /> ` ;
87
+ return html `< ${ Element } sendEvent =${ sendEvent } model=${ model } /> ` ;
83
88
} else {
84
89
return html `< div /> ` ;
85
90
}
0 commit comments