Tempo: Update the query whenever the value of the TraceQL editor changes (#57199)

This commit is contained in:
Hamas Shafiq 2022-10-21 16:01:53 +01:00 committed by GitHub
parent 5d7d54d076
commit 07ac388e8b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 9 additions and 3 deletions

View File

@ -95,7 +95,8 @@ class UnthemedCodeEditor extends PureComponent<Props> {
};
handleOnMount = (editor: MonacoEditorType, monaco: Monaco) => {
const { onEditorDidMount } = this.props;
const { onChange, onEditorDidMount } = this.props;
this.getEditorValue = () => editor.getValue();
editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS, this.onSave);
@ -103,6 +104,7 @@ class UnthemedCodeEditor extends PureComponent<Props> {
if (onEditorDidMount) {
languagePromise.then(() => onEditorDidMount(editor, monaco));
editor.getModel()?.onDidChangeContent(() => onChange?.(editor.getValue()));
}
};

View File

@ -42,6 +42,9 @@ export interface CodeEditorProps {
/** Handler to be performed when editor is blurred */
onBlur?: CodeEditorChangeHandler;
/** Handler to be performed whenever the text inside the editor changes */
onChange?: CodeEditorChangeHandler;
/** Handler to be performed when Cmd/Ctrl+S is pressed */
onSave?: CodeEditorChangeHandler;

View File

@ -22,7 +22,7 @@ interface Props {
}
export function TraceQLEditor(props: Props) {
const { onRunQuery, placeholder } = props;
const { onChange, onRunQuery, placeholder } = props;
const setupAutocompleteFn = useAutocomplete(props.datasource);
const theme = useTheme2();
const styles = getStyles(theme, placeholder);
@ -31,7 +31,8 @@ export function TraceQLEditor(props: Props) {
<CodeEditor
value={props.value}
language={langId}
onBlur={props.onChange}
onBlur={onChange}
onChange={onChange}
height={'30px'}
containerStyles={styles.queryField}
monacoOptions={{