From 5ad7cca9d49ad22996ce1949902164f21e1d78e1 Mon Sep 17 00:00:00 2001
From: Galen Kistler <109082771+gtk-grafana@users.noreply.github.com>
Date: Fri, 27 Jan 2023 10:40:12 -0600
Subject: [PATCH] Prometheus: Fix "-Instant" string showing up in prometheus
 instant query UI  (#62265)

Add string constant and make sure to remove from name before outputting to frontend
---
 .../explore/PrometheusListView/ItemLabels.tsx        | 12 +++++++++++-
 .../app/plugins/datasource/prometheus/datasource.tsx |  4 +++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/public/app/features/explore/PrometheusListView/ItemLabels.tsx b/public/app/features/explore/PrometheusListView/ItemLabels.tsx
index 40fb7ba9712..b5db12afe93 100644
--- a/public/app/features/explore/PrometheusListView/ItemLabels.tsx
+++ b/public/app/features/explore/PrometheusListView/ItemLabels.tsx
@@ -4,6 +4,8 @@ import React from 'react';
 import { Field, GrafanaTheme2 } from '@grafana/data/';
 import { useStyles2 } from '@grafana/ui/';
 
+import { InstantQueryRefIdIndex } from '../../../plugins/datasource/prometheus/datasource';
+
 import { rawListItemColumnWidth } from './RawListItem';
 
 const getItemLabelsStyles = (theme: GrafanaTheme2, expanded: boolean) => {
@@ -22,14 +24,22 @@ const getItemLabelsStyles = (theme: GrafanaTheme2, expanded: boolean) => {
   };
 };
 
+const formatValueName = (name: string): string => {
+  if (name.includes(InstantQueryRefIdIndex)) {
+    return name.replace(InstantQueryRefIdIndex, '');
+  }
+  return name;
+};
+
 export const ItemLabels = ({ valueLabels, expanded }: { valueLabels: Field[]; expanded: boolean }) => {
   const styles = useStyles2((theme) => getItemLabelsStyles(theme, expanded));
+
   return (
     <div className={styles.itemLabelsWrap}>
       <div className={styles.valueNavigationWrapper}>
         {valueLabels.map((value, index) => (
           <span className={styles.valueNavigation} key={value.name}>
-            {value.name}
+            {formatValueName(value.name)}
           </span>
         ))}
       </div>
diff --git a/public/app/plugins/datasource/prometheus/datasource.tsx b/public/app/plugins/datasource/prometheus/datasource.tsx
index 06e1721fd18..afc3faf44ab 100644
--- a/public/app/plugins/datasource/prometheus/datasource.tsx
+++ b/public/app/plugins/datasource/prometheus/datasource.tsx
@@ -70,6 +70,8 @@ import { PrometheusVariableSupport } from './variables';
 const ANNOTATION_QUERY_STEP_DEFAULT = '60s';
 const GET_AND_POST_METADATA_ENDPOINTS = ['api/v1/query', 'api/v1/query_range', 'api/v1/series', 'api/v1/labels'];
 
+export const InstantQueryRefIdIndex = '-Instant';
+
 export class PrometheusDatasource
   extends DataSourceWithBackend<PromQuery, PromOptions>
   implements DataSourceWithQueryImportSupport<PromQuery>, DataSourceWithQueryExportSupport<PromQuery>
@@ -430,7 +432,7 @@ export class PrometheusDatasource
         },
         {
           ...processedTarget,
-          refId: processedTarget.refId + '-Instant',
+          refId: processedTarget.refId + InstantQueryRefIdIndex,
           range: false,
         }
       );