diff --git a/frontend/src/components/script-editor/ScriptBodyEditor.tsx b/frontend/src/components/script-editor/ScriptBodyEditor.tsx index c4c505be..03a651ba 100644 --- a/frontend/src/components/script-editor/ScriptBodyEditor.tsx +++ b/frontend/src/components/script-editor/ScriptBodyEditor.tsx @@ -1,4 +1,4 @@ -import { useCallback } from 'react' +import { useCallback, useRef } from 'react' import Editor, { type BeforeMount } from '@monaco-editor/react' import { resolutionFlowTheme, THEME_ID } from '@/components/tree-editor/code-mode/resolutionFlowTheme' import { Spinner } from '@/components/common/Spinner' @@ -10,11 +10,22 @@ interface Props { } export function ScriptBodyEditor({ value, onChange, disabled }: Props) { + const lastValueRef = useRef(value) + lastValueRef.current = value + const handleBeforeMount: BeforeMount = useCallback((monaco) => { // Register our dark theme if not already defined monaco.editor.defineTheme(THEME_ID, resolutionFlowTheme) }, []) + const handleChange = useCallback((v: string | undefined) => { + const next = v ?? '' + // Only propagate user-initiated edits, not echoes from external value prop changes + if (next !== lastValueRef.current) { + onChange(next) + } + }, [onChange]) + return (
onChange(v ?? '')} + onChange={handleChange} beforeMount={handleBeforeMount} loading={