Panel: Histogram tooltip unit unexpected show (#100163)

* unit unexpected show

* format

* Build display in while building the counts, and remove the post processing iteration over the counts.

---------

Co-authored-by: Kristina Durivage <kristina.durivage@grafana.com>

packages/grafana-data/src/transformations/transformers/histogram.ts

@@ -326,7 +326,11 @@ export function getHistogramFields(frame: DataFrame): HistogramFields | undefine
 /**
  * @alpha
  */
-export function buildHistogram(frames: DataFrame[], options?: HistogramTransformerOptions): HistogramFields | null {
+export function buildHistogram(
+  frames: DataFrame[],
+  options?: HistogramTransformerOptions,
+  theme?: GrafanaTheme2
+): HistogramFields | null {
   let bucketSize = options?.bucketSize;
   let bucketCount = options?.bucketCount ?? DEFAULT_BUCKET_COUNT;
   let bucketOffset = options?.bucketOffset ?? 0;
@@ -413,13 +417,20 @@ export function buildHistogram(frames: DataFrame[], options?: HistogramTransform
       if (field.type === FieldType.number) {
         let fieldHist = histogram(field.values, getBucket, histFilter, histSort);
         histograms.push(fieldHist);
-        counts.push({
+
+        const count = {
           ...field,
           config: {
             ...field.config,
             unit: field.config.unit === 'short' ? 'short' : undefined,
           },
+        };
+
+        count.display = getDisplayProcessor({
+          field: count,
+          theme: theme ?? createTheme(),
         });
+        counts.push(count);
         if (!config && field.config.unit) {
           config = field.config;
         }
@@ -574,12 +585,6 @@ export function histogramFieldsToFrame(info: HistogramFields, theme?: GrafanaThe
     info.xMax.display = display;
   }
 
-  // ensure updated units are reflected on the count field used for y axis formatting
-  info.counts[0].display = getDisplayProcessor({
-    field: info.counts[0],
-    theme: theme ?? createTheme(),
-  });
-
   return {
     length: info.xMin.values.length,
     meta: {

public/app/plugins/panel/histogram/HistogramPanel.tsx

@@ -46,7 +46,7 @@ export const HistogramPanel = ({ data, options, width, height }: Props) => {
         return histogramFieldsToFrame(joinHistograms(histograms), theme);
       }
     }
-    const hist = buildHistogram(data.series, options);
+    const hist = buildHistogram(data.series, options, theme);
     if (!hist) {
       return undefined;
     }