Fix build.

Author: fmassot

package-lock.json

@@ -21,17 +21,17 @@
   "license": "AGPL-3.0",
   "devDependencies": {
     "@babel/core": "^7.21.4",
-    "@grafana/e2e": "10.1.9",
+    "@grafana/e2e": "^6.7.6",
     "@grafana/e2e-selectors": "10.1.9",
     "@grafana/eslint-config": "^6.0.0",
     "@grafana/tsconfig": "^1.2.0-rc1",
-    "@storybook/addon-essentials": "^7.6.17",
+    "@storybook/addon-essentials": "^8.6.14",
     "@storybook/addon-interactions": "^7.6.17",
     "@storybook/addon-links": "^7.6.17",
-    "@storybook/addon-onboarding": "^1.0.11",
-    "@storybook/blocks": "^7.6.17",
-    "@storybook/react": "^7.6.17",
-    "@storybook/react-webpack5": "^7.6.17",
+    "@storybook/addon-onboarding": "^9.0.17",
+    "@storybook/blocks": "^8.6.14",
+    "@storybook/react": "^9.0.17",
+    "@storybook/react-webpack5": "^9.0.17",
     "@storybook/test": "^7.6.17",
     "@swc/core": "^1.3.90",
     "@swc/helpers": "^0.5.0",
@@ -59,7 +59,7 @@
     "replace-in-file-webpack-plugin": "^1.0.6",
     "sass": "1.63.2",
     "sass-loader": "13.3.1",
-    "storybook": "^7.6.17",
+    "storybook": "^9.0.17",
     "style-loader": "3.3.3",
     "swc-loader": "^0.2.3",
     "ts-node": "^10.9.1",
@@ -74,16 +74,18 @@
   },
   "dependencies": {
     "@emotion/css": "^11.11",
-    "@grafana/data": "10.1.9",
-    "@grafana/experimental": "^1.7.10",
-    "@grafana/runtime": "10.1.9",
-    "@grafana/ui": "10.1.9",
+    "@grafana/data": "^11.3.0",
+    "@grafana/runtime": "^11.3.0",
+    "@grafana/ui": "^11.3.0",
     "@reduxjs/toolkit": "^1.9.5",
     "@uiw/react-codemirror": "^4.21.21",
     "lucene": "^2.1.1",
     "observable-hooks": "^4.2.3",
     "react": "17.0.2",
     "react-dom": "17.0.2",
+    "react-select": "^5.10.2",
+    "react-select-event": "^5.5.1",
+    "rxjs": "^7.8.1",
     "tslib": "2.5.3",
     "usehooks-ts": "^3.1.0"
   },

package.json

@@ -81,9 +81,9 @@ export function LogContextUI(props: LogContextUIProps ){
     </div>
   ), [setQuery, canRunQuery, origQuery, runQuery])
 
-  const processFilter = useCallback((f: GrafanaField<any, any[]>): Field => {
+  const processFilter = useCallback((f: GrafanaField<any>): Field => {
         let contingency: FieldContingency = {};
-        f.values.forEach((value: string, i) => {
+        f.values.forEach((value: string, i: number) => {
           if (!contingency[value]) {
             contingency[value] = {
               count: 0,

src/LogContext/components/LogContextUI.tsx

@@ -1,8 +1,7 @@
 import React from 'react';
 
 import { AnnotationQuery } from '@grafana/data';
-import { EditorField, EditorRow } from '@grafana/experimental';
-import { Input } from '@grafana/ui';
+import { Input, InlineField, InlineFieldRow } from '@grafana/ui';
 
 import { ElasticsearchQuery } from '@/types';
 
@@ -41,8 +40,8 @@ export function ElasticsearchAnnotationsQueryEditor(props: Props) {
 
       <div className="gf-form-group">
         <h6>Field mappings</h6>
-        <EditorRow>
-          <EditorField label="Time">
+        <InlineFieldRow>
+          <InlineField label="Time">
             <Input
               type="text"
               placeholder="@timestamp"
@@ -54,8 +53,8 @@ export function ElasticsearchAnnotationsQueryEditor(props: Props) {
                 });
               }}
             />
-          </EditorField>
-          <EditorField label="Time End">
+          </InlineField>
+          <InlineField label="Time End">
             <Input
               type="text"
               value={annotation.timeEndField}
@@ -66,8 +65,8 @@ export function ElasticsearchAnnotationsQueryEditor(props: Props) {
                 });
               }}
             />
-          </EditorField>
-          <EditorField label="Text">
+          </InlineField>
+          <InlineField label="Text">
             <Input
               type="text"
               value={annotation.textField}
@@ -78,8 +77,8 @@ export function ElasticsearchAnnotationsQueryEditor(props: Props) {
                 });
               }}
             />
-          </EditorField>
-          <EditorField label="Tags">
+          </InlineField>
+          <InlineField label="Tags">
             <Input
               type="text"
               placeholder="tags"
@@ -91,8 +90,8 @@ export function ElasticsearchAnnotationsQueryEditor(props: Props) {
                 });
               }}
             />
-          </EditorField>
-        </EditorRow>
+          </InlineField>
+        </InlineFieldRow>
       </div>
     </>
   );

src/components/QueryEditor/AnnotationQueryEditor.tsx

@@ -2,8 +2,7 @@ import { css } from '@emotion/css';
 import React from 'react';
 
 import { GrafanaTheme2, VariableOrigin, DataLinkBuiltInVars } from '@grafana/data';
-import { ConfigSubSection } from '@grafana/experimental';
-import { Button, useStyles2 } from '@grafana/ui';
+import { Button, useStyles2, FieldSet } from '@grafana/ui';
 
 import { DataLinkConfig } from '../types';
 
@@ -32,10 +31,8 @@ export const DataLinks = (props: Props) => {
   const styles = useStyles2(getStyles);
 
   return (
-    <ConfigSubSection
-      title="Data links"
-      description="Add links to existing fields. Links will be shown in log row details next to the field value."
-    >
+    <FieldSet label="Data links">
+      <p>Add links to existing fields. Links will be shown in log row details next to the field value.</p>
       <div className={styles.container}>
         {value && value.length > 0 && (
           <div className="gf-form-group">
@@ -83,6 +80,6 @@ export const DataLinks = (props: Props) => {
           Add
         </Button>
       </div>
-    </ConfigSubSection>
+    </FieldSet>
   );
 };

src/configuration/DataLinks.tsx

@@ -1,5 +1,4 @@
-import { Observable, lastValueFrom, from, of } from 'rxjs';
-import { map, mergeMap } from 'rxjs/operators';
+import { Observable, lastValueFrom, from, of, map, mergeMap } from 'rxjs';
 
 import {
   AbstractQuery,

src/datasource/base.ts

@@ -57,7 +57,7 @@
     "updated": "%TODAY%"
   },
   "dependencies": {
-    "grafanaDependency": ">=10.0",
+    "grafanaDependency": ">=11.0.0",
     "plugins": []
   }
 }

src/plugin.json

@@ -4,7 +4,7 @@ import { DefaultsConfigOverrides } from "store/defaults/conf";
 
 export interface QuickwitOptions extends DataSourceJsonData {
     timeField: string;
-    interval?: Interval;
+    interval?: string;
     logMessageField?: string;
     logLevelField?: string;
     dataLinks?: DataLinkConfig[];