Pass scoped vars to create label (#27047)

public/app/plugins/datasource/prometheus/datasource.ts

@@ -171,7 +171,13 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
     return templateSrv.variableExists(target.expr);
     return templateSrv.variableExists(target.expr);
   }
   }
 
 
-  processResult = (response: any, query: PromQueryRequest, target: PromQuery, responseListLength: number) => {
+  processResult = (
+    response: any,
+    query: PromQueryRequest,
+    target: PromQuery,
+    responseListLength: number,
+    scopedVars?: ScopedVars
+  ) => {
     // Keeping original start/end for transformers
     // Keeping original start/end for transformers
     const transformerOptions = {
     const transformerOptions = {
       format: target.format,
       format: target.format,
@@ -181,6 +187,7 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
       end: query.end,
       end: query.end,
       query: query.expr,
       query: query.expr,
       responseListLength,
       responseListLength,
+      scopedVars,
       refId: target.refId,
       refId: target.refId,
       valueWithRefId: target.valueWithRefId,
       valueWithRefId: target.valueWithRefId,
       meta: {
       meta: {
@@ -256,7 +263,7 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
       return this.exploreQuery(queries, activeTargets, end);
       return this.exploreQuery(queries, activeTargets, end);
     }
     }
 
 
-    return this.panelsQuery(queries, activeTargets, end, options.requestId);
+    return this.panelsQuery(queries, activeTargets, end, options.requestId, options.scopedVars);
   }
   }
 
 
   private exploreQuery(queries: PromQueryRequest[], activeTargets: PromQuery[], end: number) {
   private exploreQuery(queries: PromQueryRequest[], activeTargets: PromQuery[], end: number) {
@@ -287,7 +294,13 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
     return merge(...subQueries);
     return merge(...subQueries);
   }
   }
 
 
-  private panelsQuery(queries: PromQueryRequest[], activeTargets: PromQuery[], end: number, requestId: string) {
+  private panelsQuery(
+    queries: PromQueryRequest[],
+    activeTargets: PromQuery[],
+    end: number,
+    requestId: string,
+    scopedVars: ScopedVars
+  ) {
     const observables: Array<Observable<Array<TableModel | TimeSeries>>> = queries.map((query, index) => {
     const observables: Array<Observable<Array<TableModel | TimeSeries>>> = queries.map((query, index) => {
       const target = activeTargets[index];
       const target = activeTargets[index];
 
 
@@ -298,7 +311,7 @@ export class PrometheusDatasource extends DataSourceApi<PromQuery, PromOptions>
       return observable.pipe(
       return observable.pipe(
         filter((response: any) => (response.cancelled ? false : true)),
         filter((response: any) => (response.cancelled ? false : true)),
         map((response: any) => {
         map((response: any) => {
-          const data = this.processResult(response, query, target, queries.length);
+          const data = this.processResult(response, query, target, queries.length, scopedVars);
           return data;
           return data;
         })
         })
       );
       );

public/app/plugins/datasource/prometheus/result_transformer.ts

@@ -160,7 +160,7 @@ export class ResultTransformer {
 
 
   createLabelInfo(labels: { [key: string]: string }, options: any): { name?: string; labels: Labels; title?: string } {
   createLabelInfo(labels: { [key: string]: string }, options: any): { name?: string; labels: Labels; title?: string } {
     if (options?.legendFormat) {
     if (options?.legendFormat) {
-      const title = this.renderTemplate(this.templateSrv.replace(options.legendFormat), labels);
+      const title = this.renderTemplate(this.templateSrv.replace(options.legendFormat, options?.scopedVars), labels);
       return { name: title, title, labels };
       return { name: title, title, labels };
     }
     }