fix: time UI integration issues

web-admin/src/routes/[organization]/[project]/-/share/[token]/+page.ts

@@ -1,8 +1,7 @@
 import { getExploreStates } from "@rilldata/web-common/features/explores/selectors";
 
 export const load = async ({ url, parent }) => {
-  const { explore, metricsView, timeRanges, defaultExplorePreset, token } =
-    await parent();
+  const { explore, metricsView, defaultExplorePreset, token } = await parent();
   const exploreName = token?.resourceName;
   const metricsViewSpec = metricsView.metricsView?.state?.validSpec;
   const exploreSpec = explore.explore?.state?.validSpec;
@@ -14,6 +13,5 @@ export const load = async ({ url, parent }) => {
     metricsViewSpec,
     exploreSpec,
     defaultExplorePreset,
-    timeRanges,
   );
 };

web-admin/src/routes/[organization]/[project]/explore/[dashboard]/+page.ts

@@ -1,8 +1,7 @@
 import { getExploreStates } from "@rilldata/web-common/features/explores/selectors";
 
 export const load = async ({ url, parent, params }) => {
-  const { explore, metricsView, timeRanges, defaultExplorePreset } =
-    await parent();
+  const { explore, metricsView, defaultExplorePreset } = await parent();
   const { organization, project, dashboard: exploreName } = params;
   const metricsViewSpec = metricsView.metricsView?.state?.validSpec;
   const exploreSpec = explore.explore?.state?.validSpec;
@@ -16,7 +15,6 @@ export const load = async ({ url, parent, params }) => {
       metricsViewSpec,
       exploreSpec,
       defaultExplorePreset,
-      timeRanges,
     ),
   };
 };

web-common/src/features/dashboards/time-controls/rill-time-ranges.ts

@@ -1,53 +1,99 @@
+import {
+  normaliseRillTime,
+  parseRillTime,
+  validateRillTime,
+} from "@rilldata/web-common/features/dashboards/url-state/time-ranges/parser";
 import { dedupe } from "@rilldata/web-common/lib/arrayUtils";
-import { derived, get } from "svelte/store";
+import type { DashboardTimeControls } from "@rilldata/web-common/lib/time/types";
+import { get } from "svelte/store";
 import { runtime } from "@rilldata/web-common/runtime-client/runtime-store";
-import { useExploreValidSpec } from "../../explores/selectors";
 import {
-  createQueryServiceMetricsViewTimeRanges,
   getQueryServiceMetricsViewTimeRangesQueryKey,
   queryServiceMetricsViewTimeRanges,
+  type V1ExplorePreset,
   type V1ExploreSpec,
-  type V1MetricsViewTimeRangesResponse,
 } from "@rilldata/web-common/runtime-client";
-import type { CreateQueryResult } from "@tanstack/svelte-query";
 import { queryClient } from "@rilldata/web-common/lib/svelte-query/globalQueryClient";
 
-export function getTimeRanges(exploreName: string) {
-  return derived(
-    [useExploreValidSpec(get(runtime).instanceId, exploreName)],
-    ([validSpecResp], set) => {
-      if (!validSpecResp.data?.explore) {
-        return;
+export async function fetchTimeRanges(
+  exploreSpec: V1ExploreSpec,
+  defaultPreset: V1ExplorePreset,
+) {
+  const rillTimes = dedupe(
+    [
+      ...(defaultPreset.timeRange ? [defaultPreset.timeRange] : []),
+      ...(exploreSpec.timeRanges?.length
+        ? exploreSpec.timeRanges.map((t) => t.range!)
+        : []),
+    ].map(normaliseRillTime),
+  );
+  const rillTimesWithTimezones = rillTimes.map((tr) => {
+    try {
+      const rillTime = parseRillTime(tr);
+      if (defaultPreset.timezone) {
+        rillTime.addTimezone(defaultPreset.timezone);
       }
+      return rillTime.toString();
+    } catch {
+      return tr;
+    }
+  });
 
-      const explore = validSpecResp.data.explore;
-      const defaultPreset = explore.defaultPreset ?? {};
-      const rillTimes = dedupe([
-        ...(defaultPreset.timeRange ? [defaultPreset.timeRange] : []),
-        ...(explore.timeRanges?.length
-          ? explore.timeRanges.map((t) => t.range!)
-          : []),
-      ]);
+  const instanceId = get(runtime).instanceId;
+  const metricsViewName = exploreSpec.metricsView!;
 
-      createQueryServiceMetricsViewTimeRanges(
-        get(runtime).instanceId,
-        explore.metricsView!,
-        {
-          expressions: rillTimes,
-        },
-      ).subscribe(set);
-    },
-  ) as CreateQueryResult<V1MetricsViewTimeRangesResponse>;
+  const timeRangesResp = await queryClient.fetchQuery({
+    queryKey: getQueryServiceMetricsViewTimeRangesQueryKey(
+      instanceId,
+      metricsViewName,
+      { expressions: rillTimesWithTimezones },
+    ),
+    queryFn: () =>
+      queryServiceMetricsViewTimeRanges(instanceId, metricsViewName, {
+        expressions: rillTimesWithTimezones,
+      }),
+  });
+  return (
+    timeRangesResp.timeRanges?.map((tr, i) => ({
+      start: tr.start,
+      end: tr.end,
+      expression: rillTimes[i],
+    })) ?? []
+  );
 }
 
-export async function fetchTimeRanges(exploreSpec: V1ExploreSpec) {
-  const defaultPreset = exploreSpec.defaultPreset ?? {};
-  const rillTimes = dedupe([
-    ...(defaultPreset.timeRange ? [defaultPreset.timeRange] : []),
-    ...(exploreSpec.timeRanges?.length
-      ? exploreSpec.timeRanges.map((t) => t.range!)
-      : []),
-  ]);
+export async function resolveTimeRanges(
+  exploreSpec: V1ExploreSpec,
+  timeRanges: (DashboardTimeControls | undefined)[],
+  timezone: string | undefined,
+) {
+  const rillTimes: string[] = [];
+  const rillTimeToTimeRange = new Map<number, number>();
+  const timeRangesToReturn = new Array<DashboardTimeControls | undefined>(
+    timeRanges.length,
+  );
+
+  timeRanges.forEach((tr, i) => {
+    timeRangesToReturn[i] = tr;
+    if (
+      !tr?.name ||
+      // already resolved
+      tr.start ||
+      tr.end ||
+      !validateRillTime(tr.name)
+    )
+      return;
+
+    const rillTime = parseRillTime(tr.name);
+    if (timezone) {
+      rillTime.addTimezone(timezone);
+    }
+    rillTimeToTimeRange.set(rillTimes.length, i);
+    rillTimes.push(rillTime.toString());
+  });
+
+  if (rillTimes.length === 0) return timeRangesToReturn;
+
   const instanceId = get(runtime).instanceId;
   const metricsViewName = exploreSpec.metricsView!;
 
@@ -61,6 +107,14 @@ export async function fetchTimeRanges(exploreSpec: V1ExploreSpec) {
       queryServiceMetricsViewTimeRanges(instanceId, metricsViewName, {
         expressions: rillTimes,
       }),
+    staleTime: Infinity,
   });
-  return timeRangesResp.timeRanges ?? [];
+  timeRangesResp.timeRanges?.forEach((tr, index) => {
+    const mappedIndex = rillTimeToTimeRange.get(index);
+    if (mappedIndex === undefined || !timeRangesToReturn[mappedIndex]) return;
+    timeRangesToReturn[mappedIndex].start = new Date(tr.start!);
+    timeRangesToReturn[mappedIndex].end = new Date(tr.end!);
+  });
+
+  return timeRangesToReturn;
 }

web-common/src/features/dashboards/time-controls/time-control-store.ts

@@ -1,6 +1,7 @@
 import type { StateManagers } from "@rilldata/web-common/features/dashboards/state-managers/state-managers";
 import type { MetricsExplorerEntity } from "@rilldata/web-common/features/dashboards/stores/metrics-explorer-entity";
 import { getOrderedStartEnd } from "@rilldata/web-common/features/dashboards/time-series/utils";
+import { normaliseRillTime } from "@rilldata/web-common/features/dashboards/url-state/time-ranges/parser";
 import {
   getComparionRangeForScrub,
   getComparisonRange,
@@ -490,7 +491,8 @@ export function findTimeRange(
   name: string,
   timeRanges: V1TimeRange[],
 ): DashboardTimeControls | undefined {
-  const tr = timeRanges.find((tr) => tr.expression === name);
+  const normalisedName = normaliseRillTime(name);
+  const tr = timeRanges.find((tr) => tr.expression === normalisedName);
   if (!tr) return undefined;
   return {
     name: name as TimeRangePreset,

web-common/src/features/dashboards/url-state/DashboardURLStateSync.svelte

@@ -5,6 +5,7 @@
   import { getStateManagers } from "@rilldata/web-common/features/dashboards/state-managers/state-managers";
   import { metricsExplorerStore } from "@rilldata/web-common/features/dashboards/stores/dashboard-stores";
   import type { MetricsExplorerEntity } from "@rilldata/web-common/features/dashboards/stores/metrics-explorer-entity";
+  import { resolveTimeRanges } from "@rilldata/web-common/features/dashboards/time-controls/rill-time-ranges";
   import {
     getTimeControlState,
     type TimeControlState,
@@ -206,7 +207,14 @@
     // isLoading will never be true when the query is disabled, so we need this check before waiting for it.
     if (metricsSpec.timeDimension) {
       await waitUntil(() => !timeRangeSummaryIsLoading);
+      [initState.selectedTimeRange, initState.selectedComparisonTimeRange] =
+        await resolveTimeRanges(
+          exploreSpec,
+          [initState.selectedTimeRange, initState.selectedComparisonTimeRange],
+          initState.selectedTimezone,
+        );
     }
+    console.log(initState.selectedTimeRange);
     metricsExplorerStore.init(exploreName, initState);
     timeControlsState ??= getTimeControlState(
       metricsSpec,

web-common/src/features/dashboards/url-state/DashboardURLStateSyncWrapper.svelte

@@ -55,7 +55,6 @@
         metricsViewSpec,
         exploreSpec,
         defaultExplorePreset,
-        [], // TODO
       ));
   }