Tempo: Create separate functions for querying the v1/v2 API for tag values (#61998)

public/app/plugins/datasource/tempo/QueryEditor/NativeSearch.test.tsx

@@ -7,7 +7,7 @@ import { TempoQuery } from '../types';
 
 import NativeSearch from './NativeSearch';
 
-const getOptions = jest.fn().mockImplementation(() => {
+const getOptionsV1 = jest.fn().mockImplementation(() => {
   return new Promise((resolve) => {
     setTimeout(() => {
       resolve([
@@ -26,7 +26,7 @@ const getOptions = jest.fn().mockImplementation(() => {
 
 jest.mock('../language_provider', () => {
   return jest.fn().mockImplementation(() => {
-    return { getOptions };
+    return { getOptionsV1 };
   });
 });
 

public/app/plugins/datasource/tempo/QueryEditor/NativeSearch.tsx

@@ -45,7 +45,7 @@ const NativeSearch = ({ datasource, query, onChange, onBlur, onRunQuery }: Props
       setIsLoading((prevValue) => ({ ...prevValue, [name]: true }));
 
       try {
-        const options = await languageProvider.getOptions(lpName);
+        const options = await languageProvider.getOptionsV1(lpName);
         const filteredOptions = options.filter((item) => (item.value ? fuzzyMatch(item.value, query).found : false));
         return filteredOptions;
       } catch (error) {

public/app/plugins/datasource/tempo/QueryEditor/TagsField/autocomplete.ts

@@ -78,7 +78,7 @@ export class CompletionProvider implements monacoTypes.languages.CompletionItemP
     if (this.cachedValues.hasOwnProperty(tagName)) {
       tagValues = this.cachedValues[tagName];
     } else {
-      tagValues = await this.languageProvider.getOptions(tagName);
+      tagValues = await this.languageProvider.getOptionsV1(tagName);
       this.cachedValues[tagName] = tagValues;
     }
     return tagValues;

public/app/plugins/datasource/tempo/language_provider.ts

@@ -87,10 +87,21 @@ export default class TempoLanguageProvider extends LanguageProvider {
     return { suggestions };
   }
 
-  async getOptions(tag: string): Promise<Array<SelectableValue<string>>> {
-    const response = await this.request(`/api/v2/search/tag/${tag}/values`);
+  async getOptionsV1(tag: string): Promise<Array<SelectableValue<string>>> {
+    const response = await this.request(`/api/search/tag/${tag}/values`);
     let options: Array<SelectableValue<string>> = [];
+    if (response && response.tagValues) {
+      options = response.tagValues.map((v: string) => ({
+        value: v,
+        label: v,
+      }));
+    }
+    return options;
+  }
 
+  async getOptionsV2(tag: string): Promise<Array<SelectableValue<string>>> {
+    const response = await this.request(`/api/v2/search/tag/${tag}/values`);
+    let options: Array<SelectableValue<string>> = [];
     if (response && response.tagValues) {
       options = response.tagValues.map((v: { type: string; value: string }) => ({
         type: v.type,
@@ -98,7 +109,6 @@ export default class TempoLanguageProvider extends LanguageProvider {
         label: v.value,
       }));
     }
-
     return options;
   }
 }

public/app/plugins/datasource/tempo/traceql/autocomplete.test.ts

@@ -29,7 +29,7 @@ describe('CompletionProvider', () => {
   it('does not wrap the tag value in quotes if the type in the response is something other than "string"', async () => {
     const { provider, model } = setup('{foo=}', 5, defaultTags);
 
-    jest.spyOn(provider.languageProvider, 'getOptions').mockImplementation(
+    jest.spyOn(provider.languageProvider, 'getOptionsV2').mockImplementation(
       () =>
         new Promise((resolve) => {
           resolve([
@@ -54,7 +54,7 @@ describe('CompletionProvider', () => {
   it('wraps the tag value in quotes if the type in the response is set to "string"', async () => {
     const { provider, model } = setup('{foo=}', 5, defaultTags);
 
-    jest.spyOn(provider.languageProvider, 'getOptions').mockImplementation(
+    jest.spyOn(provider.languageProvider, 'getOptionsV2').mockImplementation(
       () =>
         new Promise((resolve) => {
           resolve([
@@ -79,7 +79,7 @@ describe('CompletionProvider', () => {
   it('inserts the tag value without quotes if the user has entered quotes', async () => {
     const { provider, model } = setup('{foo="}', 6, defaultTags);
 
-    jest.spyOn(provider.languageProvider, 'getOptions').mockImplementation(
+    jest.spyOn(provider.languageProvider, 'getOptionsV2').mockImplementation(
       () =>
         new Promise((resolve) => {
           resolve([
@@ -171,7 +171,7 @@ describe('CompletionProvider', () => {
   it('suggests tag values after a space inside a string', async () => {
     const { provider, model } = setup('{foo="bar test " }', 15, defaultTags);
 
-    jest.spyOn(provider.languageProvider, 'getOptions').mockImplementation(
+    jest.spyOn(provider.languageProvider, 'getOptionsV2').mockImplementation(
       () =>
         new Promise((resolve) => {
           resolve([

public/app/plugins/datasource/tempo/traceql/autocomplete.ts

@@ -98,7 +98,7 @@ export class CompletionProvider implements monacoTypes.languages.CompletionItemP
     if (this.cachedValues.hasOwnProperty(tagName)) {
       tagValues = this.cachedValues[tagName];
     } else {
-      tagValues = await this.languageProvider.getOptions(tagName);
+      tagValues = await this.languageProvider.getOptionsV2(tagName);
       this.cachedValues[tagName] = tagValues;
     }
     return tagValues;