QueryStats: Fix comparison of relative and absolute timeranges (#65035)

* add missing fix of relative timeranges

* add doc

public/app/plugins/datasource/loki/components/stats.test.ts

@@ -17,7 +17,7 @@ describe('shouldUpdateStats', () => {
     const query = '{job="grafana"}';
     const prevQuery = '{job="grafana"}';
     const timerange = getDefaultTimeRange();
-    timerange.from = dateTime(Date.now() - 1000000);
+    timerange.raw.from = 'now-14h';
     const prevTimerange = getDefaultTimeRange();
     expect(shouldUpdateStats(query, prevQuery, timerange, prevTimerange)).toBe(true);
   });
@@ -29,6 +29,26 @@ describe('shouldUpdateStats', () => {
     const prevTimerange = timerange;
     expect(shouldUpdateStats(query, prevQuery, timerange, prevTimerange)).toBe(false);
   });
+
+  it('should return false if the query and timerange have not changed', () => {
+    const query = '{job="grafana"}';
+    const prevQuery = '{job="grafana"}';
+    const timerange = getDefaultTimeRange();
+    const prevTimerange = getDefaultTimeRange();
+    expect(shouldUpdateStats(query, prevQuery, timerange, prevTimerange)).toBe(false);
+  });
+
+  it('should return false if the query and timerange with absolute and relative mixed have not changed', () => {
+    const query = '{job="grafana"}';
+    const prevQuery = '{job="grafana"}';
+    const now = dateTime(Date.now());
+    const timerange = getDefaultTimeRange();
+    timerange.raw.from = now;
+
+    const prevTimerange = getDefaultTimeRange();
+    prevTimerange.raw.from = now;
+    expect(shouldUpdateStats(query, prevQuery, timerange, prevTimerange)).toBe(false);
+  });
 });
 
 describe('makeStatsRequest', () => {

public/app/plugins/datasource/loki/components/stats.ts

@@ -1,4 +1,4 @@
-import { TimeRange } from '@grafana/data';
+import { DateTime, isDateTime, TimeRange } from '@grafana/data';
 
 import { LokiDatasource } from '../datasource';
 import { QueryStats } from '../types';
@@ -12,13 +12,36 @@ export async function getStats(datasource: LokiDatasource, query: string): Promi
   return Object.values(response).every((v) => v === 0) ? undefined : response;
 }
 
+/**
+ * This function compares two time values. If the first is absolute, it compares them using `DateTime.isSame`.
+ *
+ * @param {(DateTime | string)} time1
+ * @param {(DateTime | string | undefined)} time2
+ */
+function compareTime(time1: DateTime | string, time2: DateTime | string | undefined) {
+  const isAbsolute = isDateTime(time1);
+
+  if (isAbsolute) {
+    return time1.isSame(time2);
+  }
+
+  return time1 === time2;
+}
+
 export function shouldUpdateStats(
   query: string,
   prevQuery: string | undefined,
   timerange: TimeRange,
   prevTimerange: TimeRange | undefined
 ): boolean {
-  if (query === prevQuery && timerange.from.isSame(prevTimerange?.from) && timerange.to.isSame(prevTimerange?.to)) {
+  if (query !== prevQuery) {
+    return true;
+  }
+
+  if (
+    compareTime(timerange.raw.from, prevTimerange?.raw.from) &&
+    compareTime(timerange.raw.to, prevTimerange?.raw.to)
+  ) {
     return false;
   }