diff --git a/webapp/packages/plugin-codemirror6/src/useEditorDefaultExtensions.ts b/webapp/packages/plugin-codemirror6/src/useEditorDefaultExtensions.ts index a48b3e3a416..beeb580fefe 100644 --- a/webapp/packages/plugin-codemirror6/src/useEditorDefaultExtensions.ts +++ b/webapp/packages/plugin-codemirror6/src/useEditorDefaultExtensions.ts @@ -22,9 +22,9 @@ import { tooltips, } from '@codemirror/view'; import { classHighlighter } from '@lezer/highlight'; -import { useRef } from 'react'; +import { useMemo } from 'react'; -import { GlobalConstants, isObjectsEqual } from '@cloudbeaver/core-utils'; +import { GlobalConstants } from '@cloudbeaver/core-utils'; import { clsx } from '@dbeaver/ui-kit'; // @TODO allow to configure bindings outside of the component @@ -119,16 +119,67 @@ const DEFAULT_EXTENSIONS_COMPARTMENT = new Compartment(); /** Provides the necessary extensions to establish a basic editor */ export function useEditorDefaultExtensions(options?: IDefaultExtensions): [Compartment, Extension] { - const previousOptions = useRef(options); - const isOptionsChanged = !isObjectsEqual(options, previousOptions.current); - const extensions = useRef<[Compartment, Extension] | null>(null); + const { + lineNumbers, + tooltips, + highlightSpecialChars, + syntaxHighlighting, + bracketMatching, + dropCursor, + crosshairCursor, + foldGutter, + highlightActiveLineGutter, + highlightSelectionMatches, + highlightActiveLine, + indentOnInput, + rectangularSelection, + keymap, + lineWrapping, + search, + tabIndentation, + } = options ?? {}; - if (isOptionsChanged || extensions.current === null) { - previousOptions.current = options; - extensions.current = createExtensions(options); - } - - return extensions.current; + return useMemo( + () => + createExtensions({ + lineNumbers, + tooltips, + highlightSpecialChars, + syntaxHighlighting, + bracketMatching, + dropCursor, + crosshairCursor, + foldGutter, + highlightActiveLineGutter, + highlightSelectionMatches, + highlightActiveLine, + indentOnInput, + rectangularSelection, + keymap, + lineWrapping, + search, + tabIndentation, + }), + [ + lineNumbers, + tooltips, + highlightSpecialChars, + syntaxHighlighting, + bracketMatching, + dropCursor, + crosshairCursor, + foldGutter, + highlightActiveLineGutter, + highlightSelectionMatches, + highlightActiveLine, + indentOnInput, + rectangularSelection, + keymap, + lineWrapping, + search, + tabIndentation, + ], + ); } function createExtensions(options?: IDefaultExtensions): [Compartment, Extension] {