Add package @mongodb-js/mongodb-constants

Author: haohanyang

package-lock.json

@@ -68,11 +68,12 @@
     "@grafana/runtime": "^11.2.0",
     "@grafana/schema": "^10.4.0",
     "@grafana/ui": "^11.2.0",
+    "@mongodb-js/mongodb-constants": "^0.11.1",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "shadowrealm-api": "^0.8.3",
     "tslib": "2.5.3",
     "validator": "^13.15.0"
   },
   "packageManager": "[email protected]"
-}
+}

package.json

@@ -1,7 +1,7 @@
 import { useRef, useEffect } from 'react';
 import { type Monaco, type monacoTypes, type MonacoEditor } from '@grafana/ui';
 import { languages } from 'monaco-editor';
-import stages from './stages.json';
+import { STAGE_OPERATORS } from '@mongodb-js/mongodb-constants'
 
 interface CompletionState {
   name: string;
@@ -46,7 +46,7 @@ class CompletionProvider implements monacoTypes.languages.CompletionItemProvider
       endColumn: word.endColumn,
     };
 
-    const suggestions: languages.CompletionItem[] = stages.map((stage) => ({
+    const suggestions: languages.CompletionItem[] = STAGE_OPERATORS.map((stage) => ({
       label: `"${stage.name}"`,
       kind: languages.CompletionItemKind.Function,
       insertText: `"\\${stage.name}": ${stage.snippet}`,

src/editor/autocomplete.ts

@@ -1,8 +1,9 @@
 import { useEffect, useRef } from 'react';
 import { monacoTypes, type Monaco, type MonacoEditor } from '@grafana/ui';
-import stages from './stages.json';
+import { STAGE_OPERATORS } from '@mongodb-js/mongodb-constants'
 
-const stageObj = Object.fromEntries(stages.map((stage) => [stage.name, [stage.description, stage.comment]]))
+
+const stages = Object.fromEntries(STAGE_OPERATORS.map((stage) => [stage.name, [stage.description, stage.comment]]))
 
 class HoverProvider implements monacoTypes.languages.HoverProvider {
     constructor(private readonly editor: MonacoEditor) { }
@@ -12,8 +13,8 @@ class HoverProvider implements monacoTypes.languages.HoverProvider {
         }
 
         const word = model.getWordAtPosition(position);
-        if (word && Object.keys(stageObj).includes(word.word)) {
-            const [description, comment] = stageObj[word.word];
+        if (word && word.word in stages) {
+            const [description, comment] = stages[word.word];
             return {
                 range: {
                     startLineNumber: position.lineNumber,
@@ -24,7 +25,13 @@ class HoverProvider implements monacoTypes.languages.HoverProvider {
                 contents: [
                     { value: `[${word.word}](https://www.mongodb.com/docs/manual/reference/operator/aggregation/${word.word.substring(1)})` },
                     { value: description },
-                    { value: comment },
+                    {
+                        value: comment
+                            .trim()
+                            .replace(/^\/\*\*/g, '')
+                            .replace(/\*\/$/g, '')
+                            .trim()
+                    },
                 ]
             };
         }