From e5aeb7c32207733a257ae1ae70c6cba3278a337d Mon Sep 17 00:00:00 2001
From: Leon Sorokin <leeoniya@gmail.com>
Date: Fri, 28 Apr 2023 23:35:32 -0500
Subject: [PATCH] TimeSeries: Fix leading null-fill for missing intervals
 (#67570)

---
 .../GraphNG/nullInsertThreshold.test.ts       | 28 +++++++++++++++++++
 .../components/GraphNG/nullInsertThreshold.ts | 11 ++++----
 2 files changed, 33 insertions(+), 6 deletions(-)

diff --git a/packages/grafana-ui/src/components/GraphNG/nullInsertThreshold.test.ts b/packages/grafana-ui/src/components/GraphNG/nullInsertThreshold.test.ts
index 9e8af37ccf8..ab3343aa1b2 100644
--- a/packages/grafana-ui/src/components/GraphNG/nullInsertThreshold.test.ts
+++ b/packages/grafana-ui/src/components/GraphNG/nullInsertThreshold.test.ts
@@ -152,6 +152,34 @@ describe('nullInsertThreshold Transformer', () => {
     ]);
   });
 
+  // this tests that intervals at 24hr but starting not at 12am UTC are not always snapped to 12am UTC
+  test('should insert leading null at beginning +interval when timeRange.from.valueOf() exceeds threshold 11PM UTC', () => {
+    const df = new MutableDataFrame({
+      refId: 'A',
+      fields: [
+        {
+          name: 'Time',
+          type: FieldType.time,
+          config: { interval: 86400000 },
+          values: [1679439600000, 1679526000000, 1679612400000, 1679698800000, 1679785200000],
+        },
+        { name: 'One', type: FieldType.number, values: [0, 1, 2, 3, 4] },
+      ],
+    });
+
+    const result = applyNullInsertThreshold({
+      frame: df,
+      refFieldName: null,
+      refFieldPseudoMin: 1679320395828,
+      refFieldPseudoMax: 1679815217157,
+    });
+
+    expect(result.fields[0].values).toEqual([
+      1679266800000, 1679353200000, 1679439600000, 1679526000000, 1679612400000, 1679698800000, 1679785200000,
+    ]);
+    expect(result.fields[1].values).toEqual([null, null, 0, 1, 2, 3, 4]);
+  });
+
   test('should insert trailing null at end +interval when timeRange.to.valueOf() exceeds threshold', () => {
     const df = new MutableDataFrame({
       refId: 'A',
diff --git a/packages/grafana-ui/src/components/GraphNG/nullInsertThreshold.ts b/packages/grafana-ui/src/components/GraphNG/nullInsertThreshold.ts
index de02223c02c..a4a71c1c190 100644
--- a/packages/grafana-ui/src/components/GraphNG/nullInsertThreshold.ts
+++ b/packages/grafana-ui/src/components/GraphNG/nullInsertThreshold.ts
@@ -1,4 +1,4 @@
-import { DataFrame, FieldType, incrRoundDn } from '@grafana/data';
+import { DataFrame, FieldType } from '@grafana/data';
 
 type InsertMode = (prev: number, next: number, threshold: number) => number;
 
@@ -108,11 +108,11 @@ function nullInsertThreshold(
   const len = refValues.length;
   const refValuesNew: number[] = [];
 
-  // Continiuously subtract the threshold from the first data
-  // point filling in insert values accordingly
+  // Continuously subtract the threshold from the first data point, filling in insert values accordingly
   if (refFieldPseudoMin != null && refFieldPseudoMin < refValues[0]) {
+    let preFillCount = Math.ceil((refValues[0] - refFieldPseudoMin) / threshold);
     // this will be 0 or 1 threshold increment left of visible range
-    let prevSlot = incrRoundDn(refFieldPseudoMin, threshold);
+    let prevSlot = refValues[0] - preFillCount * threshold;
 
     while (prevSlot < refValues[0]) {
       // (prevSlot - threshold) is used to simulate the previous 'real' data point, as getInsertValue expects
@@ -126,8 +126,7 @@ function nullInsertThreshold(
 
   let prevValue: number = refValues[0];
 
-  // Fill nulls when a value is greater than
-  // the threshold value
+  // Fill nulls when a value is greater than the threshold value
   for (let i = 1; i < len; i++) {
     const curValue = refValues[i];