Function QueryEditor

app/src/components/queryEditor.tsx:65–90

(props)

	// We usually ignore changes to `value` to prevent unnecessary `view.setState` calls
	externalValue: string
}> = (props) => {
	let ref!: HTMLDivElement
	onMount(() => {
		const [theme] = useThemeContext()
		const view = new EditorView({
			parent: ref,
		})
		createEffect(
			on(theme, (t) => {
				view.setState(createEditorState(view, props.value, t, props.setValue))
			}),
		)
		createEffect(
			on(
				() => props.externalValue,
				(v) => {
					view.setState(createEditorState(view, v, theme(), props.setValue))
				},
			),
		)
		onCleanup(() => {
			view.destroy()
		})
	})
	return <div class='query-editor max-h-40 flex-1 overflow-auto' ref={ref} />
}

export default QueryEditor