From 0000ad910c0f8d5ef24f15d85e2a99db76bee865 Mon Sep 17 00:00:00 2001 From: Anton Dosov Date: Tue, 26 Apr 2022 12:31:30 +0200 Subject: [PATCH 1/2] wip add remote-ui/rpc --- package.json | 1 + src/plugins/vis_type_script/README.md | 1 + .../vis_type_script/public/renderer/index.tsx | 46 ++++++++++++++++++- yarn.lock | 5 ++ 4 files changed, 52 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 5d863bcc76e75..1dcdd4d443aff 100644 --- a/package.json +++ b/package.json @@ -194,6 +194,7 @@ "@mapbox/mapbox-gl-draw": "1.3.0", "@mapbox/mapbox-gl-rtl-text": "0.2.3", "@reduxjs/toolkit": "^1.6.1", + "@remote-ui/rpc": "1.3.0", "@slack/webhook": "^5.0.4", "@turf/along": "6.0.1", "@turf/area": "6.0.1", diff --git a/src/plugins/vis_type_script/README.md b/src/plugins/vis_type_script/README.md index 49a8f2c7c3c0a..8ee3636b0fb70 100644 --- a/src/plugins/vis_type_script/README.md +++ b/src/plugins/vis_type_script/README.md @@ -10,6 +10,7 @@ Add the following to `kibana.yml` (**DO NOT USE IN PRODUCTION**): ```yml csp.warnLegacyBrowsers: false +csp.strict: false csp.script_src: - 'unsafe-inline' - 'https://unpkg.com/' diff --git a/src/plugins/vis_type_script/public/renderer/index.tsx b/src/plugins/vis_type_script/public/renderer/index.tsx index fbe9770383fb1..0cf0bdc272c96 100644 --- a/src/plugins/vis_type_script/public/renderer/index.tsx +++ b/src/plugins/vis_type_script/public/renderer/index.tsx @@ -7,6 +7,7 @@ */ import React from 'react'; +import { createEndpoint, fromIframe } from '@remote-ui/rpc'; import './index.scss'; @@ -22,8 +23,31 @@ const getSandboxDocument = (script: string) => { + + - + `; @@ -34,8 +58,28 @@ export const ScriptRenderer: React.FunctionComponent<{ script: string }> = ({ }: { script: string; }) => { + const iframeRef = React.useRef(null); + + React.useEffect(() => { + if (!iframeRef.current) throw new Error('Iframe init error'); + const iframeEl = iframeRef.current; + const endpoint = createEndpoint<{ onUpdate: () => void }>(fromIframe(iframeEl)); + + endpoint.expose({ + searchEs: () => { + // eslint-disable-next-line no-console + console.log('Running search from parent'); + }, + }); + + // eslint-disable-next-line no-console + console.log('Calling on update from parent'); + endpoint.call.onUpdate(); + }, []); + return (