diff --git a/src/platform/packages/private/kbn-esql-editor/src/editor_footer/keyboard_shortcuts.tsx b/src/platform/packages/private/kbn-esql-editor/src/editor_footer/keyboard_shortcuts.tsx
index 9ad22d8b72fed..d61cbd2748e81 100644
--- a/src/platform/packages/private/kbn-esql-editor/src/editor_footer/keyboard_shortcuts.tsx
+++ b/src/platform/packages/private/kbn-esql-editor/src/editor_footer/keyboard_shortcuts.tsx
@@ -58,6 +58,16 @@ const listItems = [
defaultMessage: 'Open quick search',
}),
},
+ {
+ title: (
+ <>
+ {COMMAND_KEY} I
+ >
+ ),
+ description: i18n.translate('esqlEditor.query.prettifyKeyboardShortcutsLabel', {
+ defaultMessage: 'Prettify query',
+ }),
+ },
];
export function KeyboardShortcuts() {
diff --git a/src/platform/packages/private/kbn-esql-editor/src/editor_footer/query_wrap_component.tsx b/src/platform/packages/private/kbn-esql-editor/src/editor_footer/query_wrap_component.tsx
index fc3a9f8a499e7..82af5454c1161 100644
--- a/src/platform/packages/private/kbn-esql-editor/src/editor_footer/query_wrap_component.tsx
+++ b/src/platform/packages/private/kbn-esql-editor/src/editor_footer/query_wrap_component.tsx
@@ -10,15 +10,8 @@
import React from 'react';
import { i18n } from '@kbn/i18n';
import { EuiFlexItem, EuiToolTip, EuiButtonIcon } from '@elastic/eui';
-import { prettifyQuery } from '@kbn/esql-utils';
-export function QueryWrapComponent({
- code,
- updateQuery,
-}: {
- code: string;
- updateQuery: (qs: string) => void;
-}) {
+export function QueryWrapComponent({ onPrettifyQuery }: { onPrettifyQuery: () => void }) {
return (
{
- const updatedCode = prettifyQuery(code);
- if (code !== updatedCode) {
- updateQuery(updatedCode);
- }
- }}
+ onClick={onPrettifyQuery}
/>
diff --git a/src/platform/packages/private/kbn-esql-editor/src/esql_editor.tsx b/src/platform/packages/private/kbn-esql-editor/src/esql_editor.tsx
index fb1f826dcc3cc..eaacfdba9e3a8 100644
--- a/src/platform/packages/private/kbn-esql-editor/src/esql_editor.tsx
+++ b/src/platform/packages/private/kbn-esql-editor/src/esql_editor.tsx
@@ -33,6 +33,7 @@ import {
getInferenceEndpoints,
getEditorExtensions,
fixESQLQueryWithVariables,
+ prettifyQuery,
} from '@kbn/esql-utils';
import type { CodeEditorProps } from '@kbn/code-editor';
import { CodeEditor } from '@kbn/code-editor';
@@ -258,6 +259,16 @@ const ESQLEditorInternal = function ESQLEditor({
[onQuerySubmit, onQueryUpdate, telemetryService]
);
+ const onPrettifyQuery = useCallback(() => {
+ const qs = editorRef.current?.getValue();
+ if (qs) {
+ const prettyCode = prettifyQuery(qs);
+ if (qs !== prettyCode) {
+ onQueryUpdate(prettyCode);
+ }
+ }
+ }, [onQueryUpdate]);
+
const onCommentLine = useCallback(() => {
const currentSelection = editorRef?.current?.getSelection();
const startLineNumber = currentSelection?.startLineNumber;
@@ -1103,7 +1114,7 @@ const ESQLEditorInternal = function ESQLEditor({
});
// Add editor key bindings
- addEditorKeyBindings(editor, onQuerySubmit, toggleVisor);
+ addEditorKeyBindings(editor, onQuerySubmit, toggleVisor, onPrettifyQuery);
// Store disposables for cleanup
const currentEditor = editorRef.current;
@@ -1214,7 +1225,7 @@ const ESQLEditorInternal = function ESQLEditor({
code={code}
onErrorClick={onErrorClick}
onUpdateAndSubmitQuery={onUpdateAndSubmitQuery}
- updateQuery={onQueryUpdate}
+ onPrettifyQuery={onPrettifyQuery}
detectedTimestamp={detectedTimestamp}
hideRunQueryText={hideRunQueryText}
editorIsInline={editorIsInline}