Replace useMetricsView - Pass 1

rilldata · Sep 18, 2024 · 27499d2 · 27499d2
1 parent 8734756
commit 27499d2
Show file tree

Hide file tree

Showing 20 changed files with 105 additions and 90 deletions.
diff --git a/web-common/src/features/dashboards/DashboardThemeProvider.svelte b/web-common/src/features/dashboards/DashboardThemeProvider.svelte
@@ -1,17 +1,16 @@
 <script lang="ts">
   import { page } from "$app/stores";
-  import { useMetricsView } from "@rilldata/web-common/features/dashboards/selectors/index";
   import { getStateManagers } from "@rilldata/web-common/features/dashboards/state-managers/state-managers";
   import { setTheme } from "@rilldata/web-common/features/themes/actions";
   import { useTheme } from "@rilldata/web-common/features/themes/selectors";
   import { runtime } from "@rilldata/web-common/runtime-client/runtime-store";
   import { onMount } from "svelte";
 
-  const metricsView = useMetricsView(getStateManagers());
+  const { validSpecStore } = getStateManagers();
   $: themeFromUrl = $page.url.searchParams.get("theme");
 
   let theme: ReturnType<typeof useTheme>;
-  $: themeName = themeFromUrl ?? $metricsView.data?.defaultTheme;
+  $: themeName = themeFromUrl ?? $validSpecStore.data?.explore?.theme;
   $: if (themeName) theme = useTheme($runtime.instanceId, themeName);
 
   $: if ($theme?.data?.theme) {

diff --git a/web-common/src/features/dashboards/dimension-table/dimension-table-export-utils.ts b/web-common/src/features/dashboards/dimension-table/dimension-table-export-utils.ts
@@ -6,7 +6,6 @@ import {
 } from "@rilldata/web-common/features/dashboards/filters/measure-filters/measure-filter-entry";
 import { mergeMeasureFilters } from "@rilldata/web-common/features/dashboards/filters/measure-filters/measure-filter-utils";
 import { SortDirection } from "@rilldata/web-common/features/dashboards/proto-state/derived-types";
-import { useMetricsView } from "@rilldata/web-common/features/dashboards/selectors/index";
 import type { StateManagers } from "@rilldata/web-common/features/dashboards/state-managers/state-managers";
 import { sanitiseExpression } from "@rilldata/web-common/features/dashboards/stores/filter-utils";
 import { MetricsExplorerEntity } from "@rilldata/web-common/features/dashboards/stores/metrics-explorer-entity";
@@ -32,12 +31,16 @@ export function getDimensionTableExportArgs(
       ctx.metricsViewName,
       ctx.dashboardStore,
       useTimeControlStore(ctx),
-      useMetricsView(ctx),
+      ctx.validSpecStore,
     ],
-    ([metricViewName, dashboardState, timeControlState, metricsView]) => {
-      if (!metricsView.data || !timeControlState.ready) return undefined;
+    ([metricViewName, dashboardState, timeControlState, validSpecStore]) => {
+      if (!validSpecStore.data?.explore || !timeControlState.ready)
+        return undefined;
 
-      const timeRange = mapTimeRange(timeControlState, metricsView.data);
+      const timeRange = mapTimeRange(
+        timeControlState,
+        validSpecStore.data.explore,
+      );
       if (!timeRange) return undefined;
 
       const comparisonTimeRange = mapComparisonTimeRange(

diff --git a/web-common/src/features/dashboards/filters/FilterChips.svelte b/web-common/src/features/dashboards/filters/FilterChips.svelte
@@ -10,7 +10,6 @@ The main feature-set component for dashboard filters
   import { getMapFromArray } from "@rilldata/web-common/lib/arrayUtils";
   import { flip } from "svelte/animate";
   import { fly } from "svelte/transition";
-  import { useMetricsView } from "../selectors/index";
   import { getStateManagers } from "../state-managers/state-managers";
   import FilterButton from "./FilterButton.svelte";
   import DimensionFilter from "./dimension-filters/DimensionFilter.svelte";
@@ -29,20 +28,20 @@ The main feature-set component for dashboard filters
       filters: { clearAllFilters },
     },
     selectors: {
+      dimensions: { allDimensions },
       dimensionFilters: { getDimensionFilterItems, getAllDimensionFilterItems },
+      measures: { allMeasures },
       measureFilters: { getMeasureFilterItems, getAllMeasureFilterItems },
     },
   } = StateManagers;
 
-  const metricsView = useMetricsView(StateManagers);
-
-  $: dimensions = $metricsView.data?.dimensions ?? [];
+  $: dimensions = $allDimensions;
   $: dimensionIdMap = getMapFromArray(
     dimensions,
     (dimension) => dimension.name as string,
   );
 
-  $: measures = $metricsView.data?.measures ?? [];
+  $: measures = $allMeasures;
   $: measureIdMap = getMapFromArray(measures, (m) => m.name as string);
 
   $: currentDimensionFilters = $getDimensionFilterItems(dimensionIdMap);

diff --git a/web-common/src/features/dashboards/filters/Filters.svelte b/web-common/src/features/dashboards/filters/Filters.svelte
@@ -9,7 +9,6 @@
   import { flip } from "svelte/animate";
   import { fly } from "svelte/transition";
   import { useModelHasTimeSeries } from "../selectors";
-  import { useMetricsView } from "../selectors/index";
   import { getStateManagers } from "../state-managers/state-managers";
   import ComparisonPill from "../time-controls/comparison-pill/ComparisonPill.svelte";
   import SuperPill from "../time-controls/super-pill/SuperPill.svelte";
@@ -35,14 +34,15 @@
       filters: { clearAllFilters },
     },
     selectors: {
+      dimensions: { allDimensions },
       dimensionFilters: { getDimensionFilterItems, getAllDimensionFilterItems },
+      measures: { allMeasures },
       measureFilters: { getMeasureFilterItems, getAllMeasureFilterItems },
       pivot: { showPivot },
     },
   } = StateManagers;
 
   const timeControlsStore = useTimeControlStore(StateManagers);
-  const metricsView = useMetricsView(StateManagers);
 
   $: ({
     selectedTimeRange,
@@ -54,13 +54,13 @@
 
   $: ({ instanceId } = $runtime);
 
-  $: dimensions = $metricsView.data?.dimensions ?? [];
+  $: dimensions = $allDimensions;
   $: dimensionIdMap = getMapFromArray(
     dimensions,
     (dimension) => (dimension.name || dimension.column) as string,
   );
 
-  $: measures = $metricsView.data?.measures ?? [];
+  $: measures = $allMeasures;
   $: measureIdMap = getMapFromArray(measures, (m) => m.name as string);
 
   $: currentDimensionFilters = $getDimensionFilterItems(dimensionIdMap);

diff --git a/web-common/src/features/dashboards/pivot/pivot-data-store.ts b/web-common/src/features/dashboards/pivot/pivot-data-store.ts
@@ -1,7 +1,8 @@
 import { mergeMeasureFilters } from "@rilldata/web-common/features/dashboards/filters/measure-filters/measure-filter-utils";
 import { mergeFilters } from "@rilldata/web-common/features/dashboards/pivot/pivot-merge-filters";
-import { useMetricsView } from "@rilldata/web-common/features/dashboards/selectors/index";
 import { memoizeMetricsStore } from "@rilldata/web-common/features/dashboards/state-managers/memoize-metrics-store";
+import { allDimensions } from "@rilldata/web-common/features/dashboards/state-managers/selectors/dimensions";
+import { allMeasures } from "@rilldata/web-common/features/dashboards/state-managers/selectors/measures";
 import type { StateManagers } from "@rilldata/web-common/features/dashboards/state-managers/state-managers";
 import { metricsExplorerStore } from "@rilldata/web-common/features/dashboards/stores/dashboard-stores";
 import { createAndExpression } from "@rilldata/web-common/features/dashboards/stores/filter-utils";
@@ -68,11 +69,11 @@ export function getPivotConfig(
   ctx: StateManagers,
 ): Readable<PivotDataStoreConfig> {
   return derived(
-    [useMetricsView(ctx), ctx.timeRangeSummaryStore, ctx.dashboardStore],
-    ([metricsView, timeRangeSummary, dashboardStore]) => {
+    [ctx.validSpecStore, ctx.timeRangeSummaryStore, ctx.dashboardStore],
+    ([validSpec, timeRangeSummary, dashboardStore]) => {
       if (
-        !metricsView.data?.measures ||
-        !metricsView.data?.dimensions ||
+        !validSpec?.data?.metricsView ||
+        !validSpec?.data?.explore ||
         timeRangeSummary.isFetching
       ) {
         return {
@@ -89,9 +90,12 @@ export function getPivotConfig(
         };
       }
 
+      const { metricsView, explore } = validSpec.data;
+
       // This indirection makes sure only one update of dashboard store triggers this
       const timeControl = timeControlStateSelector([
         metricsView,
+        explore,
         timeRangeSummary,
         dashboardStore,
       ]);
@@ -100,7 +104,7 @@ export function getPivotConfig(
         timeStart: timeControl.timeStart,
         timeEnd: timeControl.timeEnd,
         timeZone: dashboardStore?.selectedTimezone || "UTC",
-        timeDimension: metricsView?.data?.timeDimension || "",
+        timeDimension: metricsView.timeDimension || "",
       };
 
       const enableComparison =
@@ -151,8 +155,14 @@ export function getPivotConfig(
         measureNames,
         rowDimensionNames,
         colDimensionNames,
-        allMeasures: metricsView.data?.measures || [],
-        allDimensions: metricsView.data?.dimensions || [],
+        allMeasures: allMeasures({
+          validMetricsView: metricsView,
+          validExplore: explore,
+        }),
+        allDimensions: allDimensions({
+          validMetricsView: metricsView,
+          validExplore: explore,
+        }),
         whereFilter: mergeMeasureFilters(dashboardStore),
         pivot: dashboardStore.pivot,
         enableComparison,

diff --git a/web-common/src/features/dashboards/pivot/pivot-export.ts b/web-common/src/features/dashboards/pivot/pivot-export.ts
@@ -1,5 +1,4 @@
 import { mergeMeasureFilters } from "@rilldata/web-common/features/dashboards/filters/measure-filters/measure-filter-utils";
-import { useMetricsView } from "@rilldata/web-common/features/dashboards/selectors/index";
 import { sanitiseExpression } from "@rilldata/web-common/features/dashboards/stores/filter-utils";
 import { MetricsExplorerEntity } from "@rilldata/web-common/features/dashboards/stores/metrics-explorer-entity";
 import { useTimeControlStore } from "@rilldata/web-common/features/dashboards/time-controls/time-control-store";
@@ -87,7 +86,7 @@ export function getPivotExportArgs(ctx: StateManagers) {
   return derived(
     [
       ctx.metricsViewName,
-      useMetricsView(ctx),
+      ctx.validSpecStore,
       useTimeControlStore(ctx),
       ctx.dashboardStore,
       getPivotConfig(ctx),
@@ -96,7 +95,7 @@ export function getPivotExportArgs(ctx: StateManagers) {
     ],
     ([
       metricsViewName,
-      metricsView,
+      validSpecStore,
       timeControlState,
       dashboardState,
       configStore,
@@ -107,8 +106,9 @@ export function getPivotExportArgs(ctx: StateManagers) {
       const comparisonTime = configStore.comparisonTime;
       const pivotState = configStore.pivot;
 
-      const metricsViewSpec = metricsView.data ?? {};
-      const timeRange = mapTimeRange(timeControlState, metricsViewSpec);
+      const metricsViewSpec = validSpecStore.data?.metricsView ?? {};
+      const exploreSpec = validSpecStore.data?.explore ?? {};
+      const timeRange = mapTimeRange(timeControlState, exploreSpec);
       if (!timeRange) return undefined;
 
       return getPivotAggregationRequest(

diff --git a/web-common/src/features/dashboards/state-managers/selectors/active-measure.ts b/web-common/src/features/dashboards/state-managers/selectors/active-measure.ts
@@ -10,7 +10,7 @@ export const activeMeasure = (
   }
 
   const activeMeasure = dashData.validMetricsView.measures.find(
-    (measure) => measure === activeMeasureName(dashData),
+    (measure) => measure.name === activeMeasureName(dashData),
   );
   return activeMeasure;
 };

diff --git a/web-common/src/features/dashboards/state-managers/selectors/dimensions.ts b/web-common/src/features/dashboards/state-managers/selectors/dimensions.ts
@@ -2,11 +2,16 @@ import type { MetricsViewSpecDimensionV2 } from "@rilldata/web-common/runtime-cl
 import type { DashboardDataSources } from "./types";
 
 export const allDimensions = ({
-  validExplore,
   validMetricsView,
-}: DashboardDataSources): MetricsViewSpecDimensionV2[] | undefined => {
-  return validMetricsView?.dimensions?.filter((d) =>
-    validExplore?.dimensions?.includes(d.name ?? ""),
+  validExplore,
+}: Pick<
+  DashboardDataSources,
+  "validMetricsView" | "validExplore"
+>): MetricsViewSpecDimensionV2[] => {
+  return (
+    validMetricsView?.dimensions?.filter((d) =>
+      validExplore?.dimensions?.includes(d.name ?? ""),
+    ) ?? []
   );
 };
 

diff --git a/web-common/src/features/dashboards/state-managers/selectors/measures.ts b/web-common/src/features/dashboards/state-managers/selectors/measures.ts
@@ -10,7 +10,10 @@ import type { DashboardDataSources } from "./types";
 export const allMeasures = ({
   validMetricsView,
   validExplore,
-}: DashboardDataSources): MetricsViewSpecMeasureV2[] => {
+}: Pick<
+  DashboardDataSources,
+  "validMetricsView" | "validExplore"
+>): MetricsViewSpecMeasureV2[] => {
   return (
     validMetricsView?.measures?.filter((m) =>
       validExplore?.measures?.includes(m.name ?? ""),

diff --git a/web-common/src/features/dashboards/stores/AdvancedMeasureCorrector.ts b/web-common/src/features/dashboards/stores/AdvancedMeasureCorrector.ts
@@ -11,6 +11,8 @@ import {
 /**
  * Single use class to correct incorrect use of advanced measures.
  * Reason to use a class here is to avoid too many arguments in methods (especially measureIsValidForComponent).
+ * NOTE: this doesnt have to deal with V1ExploreSpec since it is assumed measures/dimensions not present are already removed
+ * TODO: this should not be necessary once we use V1ExplorePreset for everything
  */
 export class AdvancedMeasureCorrector {
   private measuresMap: Map<string, MetricsViewSpecMeasureV2>;

diff --git a/web-common/src/features/dashboards/time-controls/comparison-pill/ComparisonPill.svelte b/web-common/src/features/dashboards/time-controls/comparison-pill/ComparisonPill.svelte
@@ -1,6 +1,5 @@
 <script lang="ts">
   import * as Elements from "../super-pill/components";
-  import { useMetricsView } from "@rilldata/web-common/features/dashboards/selectors/index";
   import { getStateManagers } from "@rilldata/web-common/features/dashboards/state-managers/state-managers";
   import {
     DashboardTimeControls,
@@ -21,12 +20,12 @@
   export let selectedComparisonTimeRange: DashboardTimeControls | undefined;
 
   const ctx = getStateManagers();
-  const metricsView = useMetricsView(ctx);
   const {
     metricsViewName,
     selectors: {
       timeRangeSelectors: { timeComparisonOptionsState },
     },
+    validSpecStore,
   } = ctx;
 
   $: metricViewName = $metricsViewName;
@@ -42,7 +41,7 @@
       )
     : Interval.fromDateTimes(allTimeRange.start, allTimeRange.end);
 
-  $: metricsViewSpec = $metricsView.data ?? {};
+  $: metricsViewSpec = $validSpecStore.data?.metricsView ?? {};
 
   $: activeTimeGrain = selectedTimeRange?.interval;
 

diff --git a/web-common/src/features/dashboards/time-controls/super-pill/SuperPill.svelte b/web-common/src/features/dashboards/time-controls/super-pill/SuperPill.svelte
@@ -8,7 +8,6 @@
     RangeBuckets,
     deriveInterval,
   } from "../new-time-controls";
-  import { useMetricsView } from "@rilldata/web-common/features/dashboards/selectors/index";
   import { getStateManagers } from "@rilldata/web-common/features/dashboards/state-managers/state-managers";
   import { getValidComparisonOption } from "@rilldata/web-common/features/dashboards/time-controls/time-range-store";
   import { getDefaultTimeGrain } from "@rilldata/web-common/lib/time/grains";
@@ -31,24 +30,26 @@
   export let selectedTimeRange: DashboardTimeControls | undefined;
 
   const ctx = getStateManagers();
-  const metricsView = useMetricsView(ctx);
   const {
     metricsViewName,
     selectors: {
       timeRangeSelectors: { timeRangeSelectorState },
       charts: { canPanLeft, canPanRight, getNewPanRange },
     },
+    validSpecStore,
   } = ctx;
 
   $: localUserPreferences = initLocalUserPreferenceStore(metricViewName);
 
   $: metricViewName = $metricsViewName;
+  $: metricsViewSpec = $validSpecStore.data?.metricsView ?? {};
+  $: exploreSpec = $validSpecStore.data?.explore ?? {};
 
   $: dashboardStore = useDashboardStore(metricViewName);
   $: selectedRange =
     $dashboardStore?.selectedTimeRange?.name ?? ALL_TIME_RANGE_ALIAS;
 
-  $: defaultTimeRange = $metricsView.data?.defaultTimeRange;
+  $: defaultTimeRange = exploreSpec.presets?.[0]?.timeRange;
 
   $: interval = selectedTimeRange
     ? Interval.fromDateTimes(
@@ -59,9 +60,7 @@
 
   $: activeTimeZone = $dashboardStore?.selectedTimezone;
 
-  $: availableTimeZones = $metricsView?.data?.availableTimeZones ?? [];
-
-  $: metricsViewSpec = $metricsView.data ?? {};
+  $: availableTimeZones = exploreSpec.timeZones ?? [];
 
   $: ({
     latestWindowTimeRanges,
@@ -157,10 +156,9 @@
 
     // Get valid option for the new time range
     const validComparison =
-      $metricsView.data &&
       allTimeRange &&
       getValidComparisonOption(
-        $metricsView.data,
+        exploreSpec,
         range,
         $dashboardStore.selectedComparisonTimeRange?.name as
           | TimeComparisonOption

diff --git a/web-common/src/features/dashboards/time-controls/time-range-mappers.ts b/web-common/src/features/dashboards/time-controls/time-range-mappers.ts
@@ -5,7 +5,7 @@ import {
   TimeRangePreset,
 } from "@rilldata/web-common/lib/time/types";
 import {
-  V1MetricsViewSpec,
+  V1ExploreSpec,
   V1TimeGrain,
   V1TimeRange,
 } from "@rilldata/web-common/runtime-client";
@@ -42,14 +42,14 @@ export const PreviousCompleteRangeMap: Partial<
  */
 export function mapTimeRange(
   timeControlState: TimeControlState,
-  metricsView: V1MetricsViewSpec,
+  explore: V1ExploreSpec,
 ) {
   if (!timeControlState.selectedTimeRange?.name) return undefined;
 
   const timeRange: V1TimeRange = {};
   switch (timeControlState.selectedTimeRange.name) {
     case TimeRangePreset.DEFAULT:
-      timeRange.isoDuration = metricsView.defaultTimeRange;
+      timeRange.isoDuration = explore.presets?.[0]?.timeRange;
       break;
 
     case TimeRangePreset.CUSTOM: