1import { useRef } from 'react';
2
3export function UdelFrame({ onEvaluate, hash, instance }) {
4  const ref = useRef();
5  window.addEventListener('message', (message) => {
6    const childWindow = ref?.current?.contentWindow;
7    if (message == null || message.source !== childWindow) {
8      return; // Skip message in this event listener
9    }
10    onEvaluate(message.data);
11  });
12
13  const url = new URL(window.location.origin);
14  url.hash = hash;
15  url.searchParams.append('instance', instance);
16  const source = url.toString();
17
18  return (
19    <iframe
20      ref={ref}
21      style={{
22        display: 'flex',
23        flexGrow: 1,
24        minWidth: '50%',
25        boxSizing: 'border-box',
26        border: '0px',
27      }}
28      title="strudel embed"
29      src={source}
30    ></iframe>
31  );
32}