[v10.0.x] Loki: Fix including of template variables in variable query editor (#69709)

Loki: Fix including of template variables in variable query editor (#69698)

(cherry picked from commit 14d2f371a4)

Co-authored-by: Ivana Huckova <30407135+ivanahuckova@users.noreply.github.com>

public/app/plugins/datasource/loki/components/VariableQueryEditor.tsx

@@ -88,7 +88,7 @@ export const LokiVariableQueryEditor = ({ onChange, query, datasource }: Props)
               aria-label="Label"
               onChange={onLabelChange}
               onBlur={handleBlur}
-              value={label}
+              value={{ label: label, value: label }}
               options={labelOptions}
               width={16}
               allowCustomValue

public/app/plugins/datasource/loki/migrations/variableQueryMigrations.test.ts

@@ -3,7 +3,7 @@ import { LokiVariableQuery, LokiVariableQueryType } from '../types';
 import { migrateVariableQuery } from './variableQueryMigrations';
 
 describe('Loki migrateVariableQuery()', () => {
-  it('Does not migrate LokiVariableQuery instances', () => {
+  it('does not migrate LokiVariableQuery instances', () => {
     const query: LokiVariableQuery = {
       refId: 'test',
       type: LokiVariableQueryType.LabelValues,
@@ -15,7 +15,7 @@ describe('Loki migrateVariableQuery()', () => {
     expect(migrateVariableQuery(query)).toStrictEqual(query);
   });
 
-  it('Migrates label_names() queries', () => {
+  it('migrates label_names() queries', () => {
     const query = 'label_names()';
 
     expect(migrateVariableQuery(query)).toStrictEqual({
@@ -24,7 +24,7 @@ describe('Loki migrateVariableQuery()', () => {
     });
   });
 
-  it('Migrates label_values(label) queries', () => {
+  it('migrates label_values(label) queries', () => {
     const query = 'label_values(label)';
 
     expect(migrateVariableQuery(query)).toStrictEqual({
@@ -35,7 +35,18 @@ describe('Loki migrateVariableQuery()', () => {
     });
   });
 
-  it('Migrates label_values(log stream selector, label) queries', () => {
+  it('migrates label_values(label) queries with template variable', () => {
+    const query = 'label_values($label)';
+
+    expect(migrateVariableQuery(query)).toStrictEqual({
+      refId: 'LokiVariableQueryEditor-VariableQuery',
+      type: LokiVariableQueryType.LabelValues,
+      label: '$label',
+      stream: undefined,
+    });
+  });
+
+  it('migrates label_values(log stream selector, label) queries', () => {
     const query = 'label_values(log stream selector, label)';
 
     expect(migrateVariableQuery(query)).toStrictEqual({
@@ -45,4 +56,37 @@ describe('Loki migrateVariableQuery()', () => {
       stream: 'log stream selector',
     });
   });
+
+  it('migrates label_values(log stream selector, label) with template variable as stream', () => {
+    const query = 'label_values($b, label)';
+
+    expect(migrateVariableQuery(query)).toStrictEqual({
+      refId: 'LokiVariableQueryEditor-VariableQuery',
+      type: LokiVariableQueryType.LabelValues,
+      label: 'label',
+      stream: '$b',
+    });
+  });
+
+  it('migrates label_values(log stream selector, label) with template variable in stream', () => {
+    const query = 'label_values({$b="bar"}, label)';
+
+    expect(migrateVariableQuery(query)).toStrictEqual({
+      refId: 'LokiVariableQueryEditor-VariableQuery',
+      type: LokiVariableQueryType.LabelValues,
+      label: 'label',
+      stream: '{$b="bar"}',
+    });
+  });
+
+  it('migrates label_values(log stream selector, label) with template variable in label', () => {
+    const query = 'label_values({$b="bar"}, $label)';
+
+    expect(migrateVariableQuery(query)).toStrictEqual({
+      refId: 'LokiVariableQueryEditor-VariableQuery',
+      type: LokiVariableQueryType.LabelValues,
+      label: '$label',
+      stream: '{$b="bar"}',
+    });
+  });
 });

public/app/plugins/datasource/loki/migrations/variableQueryMigrations.ts

@@ -1,7 +1,7 @@
 import { LokiVariableQuery, LokiVariableQueryType } from '../types';
 
 export const labelNamesRegex = /^label_names\(\)\s*$/;
-export const labelValuesRegex = /^label_values\((?:(.+),\s*)?([a-zA-Z_][a-zA-Z0-9_]*)\)\s*$/;
+export const labelValuesRegex = /^label_values\((?:(.+),\s*)?([a-zA-Z_$][a-zA-Z0-9_]*)\)\s*$/;
 
 export function migrateVariableQuery(rawQuery: string | LokiVariableQuery): LokiVariableQuery {
   // If not string, we assume LokiVariableQuery