Refactor date range initialization to fetch earliest timestamp from API and update date picker accordingly.

We use the on-disk earliest timestamp to get the complete range.

Signed-off-by: Adam Warner <[email protected]>

Author: PromoFaux

scripts/js/queries.js

@@ -9,10 +9,12 @@
 
 "use strict";
 
-const beginningOfTime = 1_262_304_000; // Jan 01 2010, 00:00 in seconds
-const endOfTime = 2_147_483_647; // Jan 19, 2038, 03:14 in seconds
-let from = beginningOfTime;
-let until = endOfTime;
+// These values are provided by the API (/info/database).
+// We initialize them as null and populate them during page init.
+let beginningOfTime = null; // seconds since epoch (set from API: info/database.earliest_timestamp)
+let endOfTime = null; // seconds since epoch (set to end of today)
+let from = null;
+let until = null;
 
 const dateformat = "LLL dd yyyy, HH:mm";
 
@@ -40,39 +42,60 @@ function getDnssecConfig() {
   });
 }
 
+// Fetch database info (earliest timestamp, sizes, ...) from the API and
+// initialize related globals.
+function getDatabaseInfo() {
+  $.getJSON(document.body.dataset.apiurl + "/info/database", data => {
+    // earliest_timestamp is provided in seconds since epoch
+    beginningOfTime = Number(data.earliest_timestamp_disk);
+    // Round down to nearest 5-minute segment (300 seconds)
+    beginningOfTime = Math.floor(beginningOfTime / 300) * 300;
+
+    // endOfTime should be the start of tomorrow in seconds since epoch
+    // We don't use 23:59:59 as the picker increments are set to 5 minutes
+    endOfTime = luxon.DateTime.now().plus({ days: 1 }).startOf("day").toSeconds();
+
+    // If from/until were not provided via GET, default them
+    from ??= beginningOfTime;
+    until ??= endOfTime;
+
+    initDateRangePicker();
+  });
+}
+
 function initDateRangePicker() {
+  const now = luxon.DateTime.now();
+  const minDateDt = luxon.DateTime.fromSeconds(beginningOfTime);
+  const maxDateDt = luxon.DateTime.fromSeconds(endOfTime);
+
   $("#querytime").daterangepicker(
     {
       timePicker: true,
       timePickerIncrement: 5,
       timePicker24Hour: true,
       locale: { format: dateformat },
-      startDate: luxon.DateTime.fromMillis(from * 1000), // convert to milliseconds since epoch
-      endDate: luxon.DateTime.fromMillis(until * 1000), // convert to milliseconds since epoch
+      // Use Luxon DateTime objects for the picker ranges/start/end. The
+      // daterangepicker in this build expects Luxon DateTime or ISO strings.
+      startDate: luxon.DateTime.fromSeconds(from),
+      endDate: luxon.DateTime.fromSeconds(until),
       ranges: {
-        "Last 10 Minutes": [luxon.DateTime.now().minus({ minutes: 10 }), luxon.DateTime.now()],
-        "Last Hour": [luxon.DateTime.now().minus({ hours: 1 }), luxon.DateTime.now()],
-        Today: [luxon.DateTime.now().startOf("day"), luxon.DateTime.now().endOf("day")],
-        Yesterday: [
-          luxon.DateTime.now().minus({ days: 1 }).startOf("day"),
-          luxon.DateTime.now().minus({ days: 1 }).endOf("day"),
-        ],
-        "Last 7 Days": [luxon.DateTime.now().minus({ days: 6 }), luxon.DateTime.now().endOf("day")],
-        "Last 30 Days": [
-          luxon.DateTime.now().minus({ days: 29 }),
-          luxon.DateTime.now().endOf("day"),
-        ],
-        "This Month": [luxon.DateTime.now().startOf("month"), luxon.DateTime.now().endOf("month")],
+        "Last 10 Minutes": [now.minus({ minutes: 10 }), now],
+        "Last Hour": [now.minus({ hours: 1 }), now],
+        Today: [now.startOf("day"), maxDateDt],
+        Yesterday: [now.minus({ days: 1 }).startOf("day"), now.minus({ days: 1 }).endOf("day")],
+        "Last 7 Days": [now.minus({ days: 6 }), maxDateDt],
+        "Last 30 Days": [now.minus({ days: 29 }), maxDateDt],
+        "This Month": [now.startOf("month"), now.endOf("month")],
         "Last Month": [
-          luxon.DateTime.now().minus({ months: 1 }).startOf("month"),
-          luxon.DateTime.now().minus({ months: 1 }).endOf("month"),
+          now.minus({ months: 1 }).startOf("month"),
+          now.minus({ months: 1 }).endOf("month"),
         ],
-        "This Year": [luxon.DateTime.now().startOf("year"), luxon.DateTime.now().endOf("year")],
-        "All Time": [
-          luxon.DateTime.fromMillis(beginningOfTime * 1000),
-          luxon.DateTime.fromMillis(endOfTime * 1000),
-        ], // convert to milliseconds since epoch
+        "This Year": [now.startOf("year"), now.endOf("year")],
+        "All Time": [minDateDt, maxDateDt],
       },
+      // Don't allow selecting dates outside the database range
+      minDate: minDateDt,
+      maxDate: maxDateDt,
       opens: "center",
       showDropdowns: true,
       autoUpdateInput: true,
@@ -504,14 +527,15 @@ $(() => {
   const apiURL = getAPIURL(GETDict);
 
   if ("from" in GETDict) {
-    from = GETDict.from;
+    from = Number(GETDict.from);
   }
 
   if ("until" in GETDict) {
-    until = GETDict.until;
+    until = Number(GETDict.until);
   }
 
-  initDateRangePicker();
+  // Fetch earliest timestamp from API and initialize date picker / table
+  getDatabaseInfo();
 
   table = $("#all-queries").DataTable({
     ajax: {