From 7fe0963309c64b553edee9224908a9c7a1a9a015 Mon Sep 17 00:00:00 2001
From: royendo <67675319+royendo@users.noreply.github.com>
Date: Mon, 20 Apr 2026 17:03:00 -0400
Subject: [PATCH] fix: `Back to home` href on dashboard error pages in preview
 mode

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 web-local/src/routes/(viz)/canvas/[name]/+page.svelte  | 6 +++++-
 web-local/src/routes/(viz)/explore/[name]/+page.svelte | 9 ++++++++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/web-local/src/routes/(viz)/canvas/[name]/+page.svelte b/web-local/src/routes/(viz)/canvas/[name]/+page.svelte
index ca2fc569cc3..ea31706f517 100644
--- a/web-local/src/routes/(viz)/canvas/[name]/+page.svelte
+++ b/web-local/src/routes/(viz)/canvas/[name]/+page.svelte
@@ -12,6 +12,7 @@
     isNotFoundError,
     extractErrorStatusCode,
   } from "@rilldata/web-common/lib/errors";
+  import { previewModeStore } from "@rilldata/web-common/layout/preview-mode-store";
   import { queryClient } from "@rilldata/web-common/lib/svelte-query/globalQueryClient";
   import type { PageData } from "./$types";
 
@@ -32,6 +33,8 @@
     !$canvasQuery.data &&
     $canvasQuery.isError &&
     isNotFoundError($canvasQuery.error);
+
+  $: homeHref = $previewModeStore ? "/dashboards" : "/";
 </script>
 
 {#key `${runtimeClient.instanceId}::${canvasName}`}
@@ -40,9 +43,10 @@
       statusCode={extractErrorStatusCode($canvasQuery.error)}
       header="This user can't access this dashboard"
       body="The security policy for this dashboard may make contents invisible to you. If you deploy this dashboard, {$selectedMockUserStore?.email} will see a 404."
+      href={homeHref}
     />
   {:else if isCanvasNotFound}
-    <ErrorPage statusCode={404} header="Dashboard not found" />
+    <ErrorPage statusCode={404} header="Dashboard not found" href={homeHref} />
   {:else}
     <div class="flex h-full overflow-hidden">
       <div class="flex-1 overflow-hidden">
diff --git a/web-local/src/routes/(viz)/explore/[name]/+page.svelte b/web-local/src/routes/(viz)/explore/[name]/+page.svelte
index 3609db8b2d8..f58035a7fdc 100644
--- a/web-local/src/routes/(viz)/explore/[name]/+page.svelte
+++ b/web-local/src/routes/(viz)/explore/[name]/+page.svelte
@@ -23,6 +23,7 @@
   } from "@rilldata/web-common/lib/errors";
   import { eventBus } from "@rilldata/web-common/lib/event-bus/event-bus";
   import { queryClient } from "@rilldata/web-common/lib/svelte-query/globalQueryClient";
+  import { previewModeStore } from "@rilldata/web-common/layout/preview-mode-store";
   import { useRuntimeClient } from "@rilldata/web-common/runtime-client/v2";
   import type { PageData } from "./$types";
 
@@ -76,6 +77,8 @@
   $: mockUserHasNoAccess =
     $selectedMockUserStore && isNotFoundError($exploreResource.error);
 
+  $: homeHref = $previewModeStore ? "/dashboards" : "/";
+
   onNavigate(({ from, to }) => {
     const changedDashboard =
       !from || !to || from?.params?.name !== to?.params?.name;
@@ -97,9 +100,10 @@
     statusCode={extractErrorStatusCode($exploreResource.error)}
     header="This user can't access this dashboard"
     body="The security policy for this dashboard may make contents invisible to you. If you deploy this dashboard, {$selectedMockUserStore?.email} will see a 404."
+    href={homeHref}
   />
 {:else if isDashboardNotFound}
-  <ErrorPage statusCode={404} header="Dashboard not found" />
+  <ErrorPage statusCode={404} header="Dashboard not found" href={homeHref} />
 {:else if $exploreResource.isSuccess}
   {#if isExploreReconcilingForFirstTime($exploreResource.data)}
     <DashboardBuilding />
@@ -108,17 +112,20 @@
       header="Error building dashboard"
       body={$exploreResource.data?.explore?.meta?.reconcileError ??
         "An unknown error occurred while building the dashboard."}
+      href={homeHref}
     />
   {:else if dashboardFileHasParseError && dashboardFileHasParseError.length > 0}
     <ErrorPage
       header="Error parsing dashboard"
       body="Please check your dashboard's YAML file for errors."
+      href={homeHref}
     />
   {:else if measures.length === 0 && $selectedMockUserStore !== null}
     <ErrorPage
       statusCode={extractErrorStatusCode($exploreResource.error)}
       header="Error fetching dashboard"
       body="No measures available"
+      href={homeHref}
     />
   {:else if metricsViewName}
     <div class="h-full overflow-hidden">