From 94ed2ee5689a1e18de1f441cc077ceabac627126 Mon Sep 17 00:00:00 2001
From: Aviral Jain <aviral.jain@devrev.ai>
Date: Thu, 11 Jun 2026 22:31:19 +0530
Subject: [PATCH] feat(canvas): gracefully filter excluded fields based on
 metrics security policy

When a metrics view security policy excludes a measure or dimension,
canvas components now silently drop the excluded fields instead of
showing a ComponentError or stuck loading state.

- KPI Grid: filters out excluded measures before rendering; shows
  only the KPIs the current user can access
- Table (flat): filters inaccessible columns; only errors if no
  columns remain
- Pivot: filters inaccessible measures/dimensions; only errors if
  nothing usable remains
- Leaderboard: filters inaccessible measures/dimensions consistently
- Pivot display now passes loading state to validator to avoid a
  brief "Metrics view not found" flash on initial load

Closes #8850
---
 .../canvas/components/kpi-grid/KPIGrid.svelte | 35 +++++---
 .../canvas/components/leaderboard/selector.ts | 37 ++------
 .../pivot/CanvasPivotDisplay.svelte           | 62 +++++++++++--
 .../pivot/CanvasPivotRenderer.svelte          |  1 +
 .../canvas/components/pivot/selector.ts       | 90 +++++++------------
 5 files changed, 118 insertions(+), 107 deletions(-)

diff --git a/web-common/src/features/canvas/components/kpi-grid/KPIGrid.svelte b/web-common/src/features/canvas/components/kpi-grid/KPIGrid.svelte
index c2eee69328d0..07aa2313d6f5 100644
--- a/web-common/src/features/canvas/components/kpi-grid/KPIGrid.svelte
+++ b/web-common/src/features/canvas/components/kpi-grid/KPIGrid.svelte
@@ -13,22 +13,35 @@
   $: ({
     specStore,
     timeAndFilterStore,
-    parent: { name: canvasName },
+    parent: { name: canvasName, metricsView },
     visible,
   } = component);
   $: kpiGridProperties = $specStore;
   $: schema = validateKPIGridSchema(kpiGridProperties);
 
-  // Convert measures to KPI specs
-  $: kpis = (kpiGridProperties.measures || []).map((measure) => ({
-    metrics_view: kpiGridProperties.metrics_view,
-    measure,
-    sparkline: kpiGridProperties.sparkline,
-    hide_time_range: kpiGridProperties.hide_time_range,
-    comparison: kpiGridProperties.comparison,
-    dimension_filters: kpiGridProperties.dimension_filters,
-    time_filters: kpiGridProperties.time_filters,
-  }));
+  $: metricsViewQuery = metricsView.getMetricsViewFromName(
+    kpiGridProperties.metrics_view,
+  );
+  $: accessibleMeasureNames = new Set(
+    $metricsViewQuery.metricsView?.measures?.map((m) => m.name as string) ?? [],
+  );
+
+  // Convert measures to KPI specs, filtering out any excluded by a security
+  // policy (those will be absent from the metrics view's validSpec).
+  $: kpis = (kpiGridProperties.measures || [])
+    .filter(
+      (measure) =>
+        $metricsViewQuery.isLoading || accessibleMeasureNames.has(measure),
+    )
+    .map((measure) => ({
+      metrics_view: kpiGridProperties.metrics_view,
+      measure,
+      sparkline: kpiGridProperties.sparkline,
+      hide_time_range: kpiGridProperties.hide_time_range,
+      comparison: kpiGridProperties.comparison,
+      dimension_filters: kpiGridProperties.dimension_filters,
+      time_filters: kpiGridProperties.time_filters,
+    }));
 
   $: filters = {
     time_filters: kpiGridProperties.time_filters,
diff --git a/web-common/src/features/canvas/components/leaderboard/selector.ts b/web-common/src/features/canvas/components/leaderboard/selector.ts
index e2666d1a1062..4c8ebecf7245 100644
--- a/web-common/src/features/canvas/components/leaderboard/selector.ts
+++ b/web-common/src/features/canvas/components/leaderboard/selector.ts
@@ -1,8 +1,4 @@
 import type { LeaderboardSpec } from "@rilldata/web-common/features/canvas/components/leaderboard";
-import {
-  validateDimensions,
-  validateMeasures,
-} from "@rilldata/web-common/features/canvas/components/validators";
 import type { V1MetricsViewSpec } from "@rilldata/web-common/runtime-client";
 
 export function validateLeaderboardSchema(
@@ -35,8 +31,14 @@ export function validateLeaderboardSchema(
   const allDimensions =
     metricsView?.dimensions?.map((d) => d.name || (d.column as string)) || [];
 
-  let measures = leaderboardSpec?.measures || [];
-  let dimensions = leaderboardSpec?.dimensions || [];
+  // Filter to only accessible fields, silently dropping any excluded by a
+  // security policy.
+  const measures = (leaderboardSpec?.measures || []).filter((m) =>
+    allMeasures.includes(m),
+  );
+  const dimensions = (leaderboardSpec?.dimensions || []).filter((d) =>
+    allDimensions.includes(d),
+  );
 
   if (!measures.length || !dimensions.length) {
     return {
@@ -45,29 +47,6 @@ export function validateLeaderboardSchema(
     };
   }
 
-  measures = measures.filter((c) => allMeasures.includes(c));
-  dimensions = dimensions.filter((c) => allDimensions.includes(c));
-
-  const validateMeasuresRes = validateMeasures(metricsView, measures);
-  if (!validateMeasuresRes.isValid) {
-    const invalidMeasures = validateMeasuresRes.invalidMeasures.join(", ");
-    return {
-      isValid: false,
-      error: `Invalid measure(s) "${invalidMeasures}" selected for the table`,
-    };
-  }
-
-  const validateDimensionsRes = validateDimensions(metricsView, dimensions);
-
-  if (!validateDimensionsRes.isValid) {
-    const invalidDimensions =
-      validateDimensionsRes.invalidDimensions.join(", ");
-
-    return {
-      isValid: false,
-      error: `Invalid dimension(s) "${invalidDimensions}" selected for the table`,
-    };
-  }
   return {
     isValid: true,
     error: undefined,
diff --git a/web-common/src/features/canvas/components/pivot/CanvasPivotDisplay.svelte b/web-common/src/features/canvas/components/pivot/CanvasPivotDisplay.svelte
index 4b33042a9542..b27bce551863 100644
--- a/web-common/src/features/canvas/components/pivot/CanvasPivotDisplay.svelte
+++ b/web-common/src/features/canvas/components/pivot/CanvasPivotDisplay.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
   import type { PivotCanvasComponent } from "@rilldata/web-common/features/canvas/components/pivot";
+  import { isTimeDimension } from "@rilldata/web-common/features/dashboards/pivot/pivot-utils";
   import ComponentHeader from "../../ComponentHeader.svelte";
   import CanvasPivotRenderer from "./CanvasPivotRenderer.svelte";
   import { validateTableSchema } from "./selector";
@@ -36,12 +37,58 @@
 
   $: _metricViewSpec = getMetricsViewFromName(tableSpec.metrics_view);
   $: metricsViewSpec = $_metricViewSpec.metricsView;
+  $: metricsViewLoading = $_metricViewSpec.isLoading;
 
-  $: schema = validateTableSchema(metricsViewSpec, tableSpec);
+  $: schema = validateTableSchema(metricsViewSpec, tableSpec, metricsViewLoading);
   $: widthScopeKey = `canvas:${component.parent.name}:${component.id}`;
 
+  // Build accessible field lists by filtering out any fields not present in the
+  // metrics view spec (e.g. excluded by a security policy).
+  $: accessibleColumns =
+    "columns" in tableSpec
+      ? (tableSpec.columns || []).filter((c) => {
+          const allMeasures =
+            metricsViewSpec?.measures?.map((m) => m.name as string) || [];
+          const allDimensions =
+            metricsViewSpec?.dimensions?.map(
+              (d) => d.name || (d.column as string),
+            ) || [];
+          return allMeasures.includes(c) || allDimensions.includes(c);
+        })
+      : [];
+
+  $: accessibleMeasures =
+    !("columns" in tableSpec)
+      ? (tableSpec.measures || []).filter((m) =>
+          metricsViewSpec?.measures?.some((mv) => mv.name === m),
+        )
+      : [];
+
+  $: accessibleRowDimensions =
+    !("columns" in tableSpec)
+      ? (tableSpec.row_dimensions || []).filter(
+          (d) =>
+            metricsViewSpec?.dimensions?.some(
+              (mv) => mv.name === d || mv.column === d,
+            ) ||
+            (metricsViewSpec?.timeDimension !== undefined &&
+              isTimeDimension(d, metricsViewSpec.timeDimension)),
+        )
+      : [];
+
+  $: accessibleColDimensions =
+    !("columns" in tableSpec)
+      ? (tableSpec.col_dimensions || []).filter(
+          (d) =>
+            metricsViewSpec?.dimensions?.some(
+              (mv) => mv.name === d || mv.column === d,
+            ) ||
+            (metricsViewSpec?.timeDimension !== undefined &&
+              isTimeDimension(d, metricsViewSpec.timeDimension)),
+        )
+      : [];
+
   $: if ("columns" in tableSpec && schema.isValid) {
-    const columns = tableSpec?.columns || [];
     pivotState.update((state) => ({
       ...state,
       sorting: [],
@@ -49,14 +96,11 @@
       activeCell: null,
       columnPage: 1,
       rowPage: 1,
-      columns: tableFieldMapper(columns, metricsViewSpec),
+      columns: tableFieldMapper(accessibleColumns, metricsViewSpec),
       showTotalsColumn: tableSpec.hide_totals_col !== true,
       showTotalsRow: tableSpec.hide_totals_row !== true,
     }));
   } else if (!("columns" in tableSpec) && schema.isValid) {
-    const measures = tableSpec.measures || [];
-    const colDimensions = tableSpec.col_dimensions || [];
-    const rowDimensions = tableSpec.row_dimensions || [];
     pivotState.update((state) => ({
       ...state,
       sorting: [],
@@ -65,10 +109,10 @@
       columnPage: 1,
       rowPage: 1,
       columns: [
-        ...tableFieldMapper(colDimensions, metricsViewSpec),
-        ...tableFieldMapper(measures, metricsViewSpec),
+        ...tableFieldMapper(accessibleColDimensions, metricsViewSpec),
+        ...tableFieldMapper(accessibleMeasures, metricsViewSpec),
       ],
-      rows: tableFieldMapper(rowDimensions, metricsViewSpec),
+      rows: tableFieldMapper(accessibleRowDimensions, metricsViewSpec),
       showTotalsColumn: tableSpec.hide_totals_col !== true,
       showTotalsRow: tableSpec.hide_totals_row !== true,
     }));
diff --git a/web-common/src/features/canvas/components/pivot/CanvasPivotRenderer.svelte b/web-common/src/features/canvas/components/pivot/CanvasPivotRenderer.svelte
index a7edeb8257db..f3d250d71d67 100644
--- a/web-common/src/features/canvas/components/pivot/CanvasPivotRenderer.svelte
+++ b/web-common/src/features/canvas/components/pivot/CanvasPivotRenderer.svelte
@@ -21,6 +21,7 @@
   export let schema: {
     isValid: boolean;
     error?: string;
+    isLoading?: boolean;
   };
   export let pivotDataStore: PivotDataStore | undefined;
   export let pivotConfig: Readable<PivotDataStoreConfig> | undefined;
diff --git a/web-common/src/features/canvas/components/pivot/selector.ts b/web-common/src/features/canvas/components/pivot/selector.ts
index 25db644879de..b8da018fc968 100644
--- a/web-common/src/features/canvas/components/pivot/selector.ts
+++ b/web-common/src/features/canvas/components/pivot/selector.ts
@@ -1,18 +1,20 @@
-import {
-  validateDimensions,
-  validateMeasures,
-} from "@rilldata/web-common/features/canvas/components/validators";
 import { isTimeDimension } from "@rilldata/web-common/features/dashboards/pivot/pivot-utils";
-import type { PivotSpec, TableSpec } from "./";
+import type { PivotSpec, TableSpec } from ".";
 import type { V1MetricsViewSpec } from "@rilldata/web-common/runtime-client";
 
 export function validateTableSchema(
   metricsView: V1MetricsViewSpec | undefined,
   tableSpec: PivotSpec | TableSpec,
+  isLoading?: boolean,
 ): {
   isValid: boolean;
   error?: string;
+  isLoading?: boolean;
 } {
+  if (isLoading) {
+    return { isValid: true, isLoading: true };
+  }
+
   if (!metricsView) {
     return {
       isValid: false,
@@ -31,37 +33,20 @@ function validateFlat(tableSpec: TableSpec, metricsView: V1MetricsViewSpec) {
   const allMeasures = metricsView?.measures?.map((m) => m.name as string) || [];
   const allDimensions =
     metricsView?.dimensions?.map((d) => d.name || (d.column as string)) || [];
-  const columns = tableSpec?.columns || [];
 
-  const measures = columns.filter((c) => allMeasures.includes(c));
-  const dimensions = columns.filter((c) => allDimensions.includes(c));
+  // Filter columns to only those accessible in the metrics view, silently
+  // dropping any excluded by a security policy.
+  const accessibleColumns = (tableSpec?.columns || []).filter(
+    (c) => allMeasures.includes(c) || allDimensions.includes(c),
+  );
 
-  if (!columns.length) {
+  if (!accessibleColumns.length) {
     return {
       isValid: false,
       error: "Select at least one measure or dimension for the table",
     };
   }
-  const validateMeasuresRes = validateMeasures(metricsView, measures);
-  if (!validateMeasuresRes.isValid) {
-    const invalidMeasures = validateMeasuresRes.invalidMeasures.join(", ");
-    return {
-      isValid: false,
-      error: `Invalid measure(s) "${invalidMeasures}" selected for the table`,
-    };
-  }
-
-  const validateDimensionsRes = validateDimensions(metricsView, dimensions);
 
-  if (!validateDimensionsRes.isValid) {
-    const invalidDimensions =
-      validateDimensionsRes.invalidDimensions.join(", ");
-
-    return {
-      isValid: false,
-      error: `Invalid dimension(s) "${invalidDimensions}" selected for the table`,
-    };
-  }
   return {
     isValid: true,
     error: undefined,
@@ -69,9 +54,25 @@ function validateFlat(tableSpec: TableSpec, metricsView: V1MetricsViewSpec) {
 }
 
 function validatePivot(tableSpec: PivotSpec, metricsView: V1MetricsViewSpec) {
-  const measures = tableSpec.measures || [];
-  const rowDimensions = tableSpec.row_dimensions || [];
-  const colDimensions = tableSpec.col_dimensions || [];
+  const allMeasures = metricsView?.measures?.map((m) => m.name as string) || [];
+  const allDimensions =
+    metricsView?.dimensions?.map((d) => d.name || (d.column as string)) || [];
+
+  // Filter each list to only accessible fields, silently dropping any
+  // excluded by a security policy.
+  const measures = (tableSpec.measures || []).filter((m) =>
+    allMeasures.includes(m),
+  );
+  const rowDimensions = (tableSpec.row_dimensions || []).filter(
+    (d) =>
+      allDimensions.includes(d) ||
+      (metricsView.timeDimension && isTimeDimension(d, metricsView.timeDimension)),
+  );
+  const colDimensions = (tableSpec.col_dimensions || []).filter(
+    (d) =>
+      allDimensions.includes(d) ||
+      (metricsView.timeDimension && isTimeDimension(d, metricsView.timeDimension)),
+  );
 
   if (!measures.length && !rowDimensions.length && !colDimensions.length) {
     return {
@@ -79,34 +80,7 @@ function validatePivot(tableSpec: PivotSpec, metricsView: V1MetricsViewSpec) {
       error: "Select at least one measure or dimension for the table",
     };
   }
-  const validateMeasuresRes = validateMeasures(metricsView, measures);
-  if (!validateMeasuresRes.isValid) {
-    const invalidMeasures = validateMeasuresRes.invalidMeasures.join(", ");
-    return {
-      isValid: false,
-      error: `Invalid measure(s) "${invalidMeasures}" selected for the table`,
-    };
-  }
-
-  const allDimensions = rowDimensions
-    .concat(colDimensions)
-    .filter(
-      (d) =>
-        !metricsView.timeDimension ||
-        !isTimeDimension(d, metricsView.timeDimension),
-    );
 
-  const validateDimensionsRes = validateDimensions(metricsView, allDimensions);
-
-  if (!validateDimensionsRes.isValid) {
-    const invalidDimensions =
-      validateDimensionsRes.invalidDimensions.join(", ");
-
-    return {
-      isValid: false,
-      error: `Invalid dimension(s) "${invalidDimensions}" selected for the table`,
-    };
-  }
   return {
     isValid: true,
     error: undefined,