fix: display explore display name on hover (#8469)

mindspank · mindspank · commit 228f514b235d · 2025-12-16T10:17:38.000+01:00
* fix: display explore display name on hover

* a pre-push hook would make my life so much easier
diff --git a/web-common/src/features/canvas/explore-link/ExploreLink.svelte b/web-common/src/features/canvas/explore-link/ExploreLink.svelte
@@ -40,6 +40,7 @@
 {#if $exploreAvailability.isAvailable}
   <ExploreLink
     exploreName={$context.exploreName}
+    displayName={$exploreAvailability.displayName}
     {organization}
     {project}
     {exploreState}
diff --git a/web-common/src/features/components/charts/ChartContainer.svelte b/web-common/src/features/components/charts/ChartContainer.svelte
@@ -71,7 +71,11 @@
 
   $: exploreAvailability = showExploreLink
     ? useExploreAvailability($runtime.instanceId, $spec?.metrics_view)
-    : readable({ isAvailable: false, exploreName: null });
+    : readable({
+        isAvailable: false,
+        exploreName: null,
+        displayName: undefined,
+      });
 
   $: exploreName = derived(
     exploreAvailability,
@@ -131,6 +135,7 @@
         {#if showExploreLink && $exploreAvailability.isAvailable}
           <ExploreLink
             exploreName={$exploreName}
+            displayName={$exploreAvailability.displayName}
             {organization}
             {project}
             exploreState={$exploreState}
diff --git a/web-common/src/features/explore-mappers/explore-validation.ts b/web-common/src/features/explore-mappers/explore-validation.ts
@@ -39,6 +39,9 @@ export function useExploreAvailability(
     return {
       isAvailable: true,
       exploreName: selectedDashboard?.meta?.name?.name,
+      displayName:
+        selectedDashboard?.explore?.spec?.displayName ||
+        selectedDashboard?.explore?.state?.validSpec?.displayName,
     };
   });
 }
diff --git a/web-common/src/features/explore-mappers/types.ts b/web-common/src/features/explore-mappers/types.ts
@@ -37,6 +37,7 @@ export type TransformerArgs<R extends TransformerProperties> = {
 export interface ExploreAvailabilityResult {
   isAvailable: boolean;
   exploreName?: string;
+  displayName?: string;
   error?: string;
 }
 
diff --git a/web-common/src/features/explores/explore-link/ExploreLink.svelte b/web-common/src/features/explores/explore-link/ExploreLink.svelte
@@ -14,6 +14,7 @@
   import type { ExploreState } from "@rilldata/web-common/features/dashboards/stores/explore-state";
 
   export let exploreName: string;
+  export let displayName: string | undefined = undefined;
   export let organization: string | undefined = undefined;
   export let project: string | undefined = undefined;
   export let exploreState: Partial<ExploreState> | undefined = undefined;
@@ -56,6 +57,9 @@
   }
 
   $: canNavigate = !isNavigating && !!exploreState && !disabled;
+  $: tooltipText = displayName
+    ? `Go to ${displayName}`
+    : "Go to Explore Dashboard";
 </script>
 
 {#if mode === "dropdown-item"}
@@ -72,15 +76,15 @@
     on:click={gotoExplorePage}
     size={28}
     disabled={!canNavigate}
-    ariaLabel="Go to Explore Dashboard"
+    ariaLabel={tooltipText}
     disableHover={!canNavigate}
   >
     {#if isNavigating}
       <Spinner status={EntityStatus.Running} size="18px" />
     {:else}
       <ExploreIcon size="18px" />
     {/if}
-    <div slot="tooltip-content">Go to Explore Dashboard</div>
+    <div slot="tooltip-content">{tooltipText}</div>
   </IconButton>
 {:else}
   <button
@@ -92,7 +96,7 @@
     {#if isNavigating}
       <Spinner status={EntityStatus.Running} size="1em" />
     {/if}
-    Go to Explore Dashboard
+    {tooltipText}
   </button>
 {/if}
 

Original file line number	Diff line number	Diff line change
`@@ -37,6 +37,7 @@ export type TransformerArgs<R extends TransformerProperties> = {`
`37`	`37`	`export interface ExploreAvailabilityResult {`
`38`	`38`	`isAvailable: boolean;`
`39`	`39`	`exploreName?: string;`
	`40`	`+ displayName?: string;`
`40`	`41`	`error?: string;`
`41`	`42`	`}`
`42`	`43`