[Drilldowns] Fix drilldown add variable adding additional brackets (#…

…196539)

## Summary

This PR adds a check to create/edit drilldown template editor for
whether the cursor (where variable would be inserted) is already between
double brackets.

Fixes: #121421
(cherry picked from commit 3c3b7c8)

src/plugins/ui_actions_enhanced/public/drilldowns/url_drilldown/components/url_drilldown_collect_config/url_drilldown_collect_config.tsx

@@ -31,6 +31,19 @@ export interface UrlDrilldownCollectConfigProps {
   variablesHelpDocsLink?: string;
 }
 
+const isCursorBetweenDoubleCurlyBrackets = (editor: monaco.editor.IStandaloneCodeEditor) => {
+  const model = editor.getModel();
+  const position = editor.getPosition();
+  if (!model || !position) return false;
+
+  const offset = model.getOffsetAt(position);
+  const text = model.getValue();
+  const twoCharactersBeforeOffset = text.slice(offset - 2, offset);
+  const twoCharactersAfterOffset = text.slice(offset, offset + 2);
+
+  return twoCharactersBeforeOffset === '{{' && twoCharactersAfterOffset === '}}';
+};
+
 export const UrlDrilldownCollectConfig: React.FC<UrlDrilldownCollectConfigProps> = ({
   config,
   variables,
@@ -64,9 +77,10 @@ export const UrlDrilldownCollectConfig: React.FC<UrlDrilldownCollectConfigProps>
       onSelect={(variable: string) => {
         const editor = editorRef.current;
         if (!editor) return;
+        const text = isCursorBetweenDoubleCurlyBrackets(editor) ? variable : `{{${variable}}}`;
 
         editor.trigger('keyboard', 'type', {
-          text: '{{' + variable + '}}',
+          text,
         });
       }}
     />