use library and add note for monaco issue

Author: bohandley

package.json

@@ -92,11 +92,12 @@
     "@emotion/css": "11.11.2",
     "@grafana/aws-sdk": "0.1.3",
     "@grafana/data": "10.2.0",
-    "@grafana/experimental": "1.7.3",
+    "@grafana/experimental": "1.7.9",
     "@grafana/faro-web-sdk": "1.2.1",
-    "@grafana/runtime": "10.2.0",
+    "@grafana/runtime": "10.3.0",
     "@grafana/schema": "10.2.0",
-    "@grafana/ui": "10.2.0",
+    "@grafana/ui": "10.3.0",
+    "@grafana/prometheus": "0.0.1",
     "@leeoniya/ufuzzy": "1.0.8",
     "@lezer/common": "1.1.0",
     "@lezer/highlight": "1.1.3",

src/components/monaco-query-field/MonacoQueryField.tsx

@@ -64,7 +64,8 @@ function ensurePromQL(monaco: Monaco) {
     PROMQL_SETUP_STARTED = true;
     const { aliases, extensions, mimetypes, loader } = promLanguageDefinition;
     monaco.languages.register({ id: PROMQL_LANG_ID, aliases, extensions, mimetypes });
-
+    // This does not work in the external datasource
+    // see library for removing loader in favor of importing language and languageConfiguration
     loader().then((mod) => {
       monaco.languages.setMonarchTokensProvider(PROMQL_LANG_ID, mod.language);
       monaco.languages.setLanguageConfiguration(PROMQL_LANG_ID, mod.languageConfiguration);

src/module.ts

@@ -1,11 +1,15 @@
 import { DataSourcePlugin } from '@grafana/data';
+import { ConfigEditor, PromQueryEditorByApp, PrometheusDatasource, PromCheatSheet } from '@grafana/prometheus';
 
-import PromCheatSheet from './components/PromCheatSheet';
-import PromQueryEditorByApp from './components/PromQueryEditorByApp';
-import { ConfigEditor } from './configuration/ConfigEditor';
-import { PrometheusDatasource } from './datasource';
+// import PromCheatSheet from './components/PromCheatSheet';
+// import PromQueryEditorByApp from './components/PromQueryEditorByApp';
+// import { ConfigEditor } from './configuration/ConfigEditor';
+// import { PrometheusDatasource } from './datasource';
 
+// @ts-ignore
 export const plugin = new DataSourcePlugin(PrometheusDatasource)
+  // @ts-ignore  
   .setQueryEditor(PromQueryEditorByApp)
   .setConfigEditor(ConfigEditor)
+  // @ts-ignore
   .setQueryEditorHelp(PromCheatSheet);