36 lines
1.1 KiB
TypeScript
36 lines
1.1 KiB
TypeScript
import { useEffect, useRef } from 'react';
|
|
import { useAppDispatch, useAppState } from './state';
|
|
|
|
export function useMessaging() {
|
|
const dispatch = useAppDispatch();
|
|
const { vscode, design } = useAppState();
|
|
const initializedRef = useRef(false);
|
|
|
|
useEffect(() => {
|
|
const handler = (event: MessageEvent) => {
|
|
const message = event.data;
|
|
switch (message.type) {
|
|
case 'designData':
|
|
case 'loadDesign':
|
|
initializedRef.current = true;
|
|
dispatch({ type: 'init', payload: message.data });
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
};
|
|
window.addEventListener('message', handler);
|
|
return () => window.removeEventListener('message', handler);
|
|
}, [dispatch]);
|
|
|
|
useEffect(() => {
|
|
if (!initializedRef.current) return;
|
|
vscode.postMessage({ type: 'designUpdated', data: design });
|
|
}, [design, vscode]);
|
|
|
|
useEffect(() => {
|
|
vscode.postMessage({ type: 'getDesignData' });
|
|
vscode.postMessage({ type: 'webviewReady' });
|
|
}, [vscode]);
|
|
}
|