diff --git a/web-common/src/features/dashboards/dimension-table/DimensionFilterGutter.svelte b/web-common/src/features/dashboards/dimension-table/DimensionFilterGutter.svelte
index 52ab1276bbf..86d03f0fb75 100644
--- a/web-common/src/features/dashboards/dimension-table/DimensionFilterGutter.svelte
+++ b/web-common/src/features/dashboards/dimension-table/DimensionFilterGutter.svelte
@@ -18,6 +18,7 @@
   export let excludeMode = false;
   export let isBeingCompared = false;
   export let dimensionName: string;
+  export let toggleComparisonDimension: (dimensionName: string) => void;
 
   function getColor(i: number) {
     const posInSelection = selectedIndex.indexOf(i);
@@ -37,7 +38,11 @@
     style:height="{config.columnHeaderHeight}px"
     class="sticky left-0 top-0 surface z-40 flex items-center"
   >
-    <DimensionCompareMenu {dimensionName} />
+    <DimensionCompareMenu
+      {dimensionName}
+      {isBeingCompared}
+      {toggleComparisonDimension}
+    />
   </div>
   {#each virtualRowItems as row (`row-${row.key}`)}
     {@const isSelected = selectedIndex.includes(row.index)}
diff --git a/web-common/src/features/dashboards/dimension-table/DimensionTable.svelte b/web-common/src/features/dashboards/dimension-table/DimensionTable.svelte
index 1e9fb399028..260b4cd2b14 100644
--- a/web-common/src/features/dashboards/dimension-table/DimensionTable.svelte
+++ b/web-common/src/features/dashboards/dimension-table/DimensionTable.svelte
@@ -29,7 +29,10 @@ TableCells – the cell contents.
   export let isFetching: boolean;
 
   const {
-    actions: { dimensionTable },
+    actions: {
+      dimensionTable,
+      comparison: { toggleComparisonDimension },
+    },
     selectors: {
       sorting: { sortMeasure },
       dimensionFilters: { isFilterExcludeMode },
@@ -228,6 +231,7 @@ TableCells – the cell contents.
             {isBeingCompared}
             {excludeMode}
             {dimensionName}
+            {toggleComparisonDimension}
             on:select-item={(event) => onSelectItem(event)}
           />
           <DimensionValueHeader
diff --git a/web-common/src/features/dashboards/leaderboard/DimensionCompareMenu.svelte b/web-common/src/features/dashboards/leaderboard/DimensionCompareMenu.svelte
index d92311b2d15..63feca3b478 100644
--- a/web-common/src/features/dashboards/leaderboard/DimensionCompareMenu.svelte
+++ b/web-common/src/features/dashboards/leaderboard/DimensionCompareMenu.svelte
@@ -6,16 +6,14 @@
 
   export let dimensionName: string | undefined;
   export let isBeingCompared: boolean;
-  export let toggleComparisonDimension: (
-    dimensionName: string | undefined,
-  ) => void;
+  export let toggleComparisonDimension: (dimensionName: string) => void;
 </script>
 
 <IconButton
   ariaLabel="Toggle breakdown for {dimensionName} dimension"
   on:click={(e) => {
     e.stopPropagation();
-    toggleComparisonDimension(dimensionName);
+    if (dimensionName) toggleComparisonDimension(dimensionName);
   }}
 >
   <Tooltip location="left" distance={8}>
diff --git a/web-common/src/features/dashboards/state-managers/actions/comparison.ts b/web-common/src/features/dashboards/state-managers/actions/comparison.ts
index 657e7b93a3c..8a7c8faefdc 100644
--- a/web-common/src/features/dashboards/state-managers/actions/comparison.ts
+++ b/web-common/src/features/dashboards/state-managers/actions/comparison.ts
@@ -2,12 +2,13 @@ import type { DashboardMutables } from "./types";
 
 export const toggleComparisonDimension = (
   { dashboard }: DashboardMutables,
-  dimensionName: string | undefined,
+  dimensionName: string,
 ) => {
   // Temporary until we make these not mutually exclusive
   dashboard.showTimeComparison = false;
   const isCurrentDimension =
     dashboard.selectedComparisonDimension === dimensionName;
+
   if (!isCurrentDimension) {
     dashboard.selectedComparisonDimension = dimensionName;
   } else {