diff --git a/ui/src/pages/Dashboard/Dashboard.tsx b/ui/src/pages/Dashboard/Dashboard.tsx
index 2e3ab8aa..08a48dac 100644
--- a/ui/src/pages/Dashboard/Dashboard.tsx
+++ b/ui/src/pages/Dashboard/Dashboard.tsx
@@ -7,7 +7,7 @@ import {
 } from '@cameleer/design-system';
 import type { Column } from '@cameleer/design-system';
 import { useSearchExecutions, useExecutionStats, useStatsTimeseries, useExecutionDetail } from '../../api/queries/executions';
-import { useDiagramByRoute } from '../../api/queries/diagrams';
+import { useDiagramLayout } from '../../api/queries/diagrams';
 import { useGlobalFilters } from '@cameleer/design-system';
 import type { ExecutionSummary } from '../../api/types';
 import { mapDiagramToRouteNodes } from '../../utils/diagram-mapping';
@@ -46,8 +46,7 @@ export default function Dashboard() {
     [searchResult],
   );
 
-  const selectedRow = rows.find(r => r.id === selectedId);
-  const { data: diagram } = useDiagramByRoute(detail?.groupName ?? selectedRow?.groupName, detail?.routeId);
+  const { data: diagram } = useDiagramLayout(detail?.diagramContentHash ?? null);
 
   const totalCount = stats?.totalCount ?? 0;
   const failedCount = stats?.failedCount ?? 0;
diff --git a/ui/src/pages/ExchangeDetail/ExchangeDetail.tsx b/ui/src/pages/ExchangeDetail/ExchangeDetail.tsx
index 1d5b8b18..8f30f43f 100644
--- a/ui/src/pages/ExchangeDetail/ExchangeDetail.tsx
+++ b/ui/src/pages/ExchangeDetail/ExchangeDetail.tsx
@@ -6,7 +6,7 @@ import {
 } from '@cameleer/design-system';
 import { useExecutionDetail, useProcessorSnapshot } from '../../api/queries/executions';
 import { useCorrelationChain } from '../../api/queries/correlation';
-import { useDiagramByRoute } from '../../api/queries/diagrams';
+import { useDiagramLayout } from '../../api/queries/diagrams';
 import { mapDiagramToRouteNodes } from '../../utils/diagram-mapping';
 import styles from './ExchangeDetail.module.css';
 
@@ -41,7 +41,7 @@ export default function ExchangeDetail() {
   const { data: detail, isLoading } = useExecutionDetail(id ?? null);
   const [timelineView, setTimelineView] = useState<'gantt' | 'flow'>('gantt');
   const { data: correlationData } = useCorrelationChain(detail?.correlationId ?? null);
-  const { data: diagram } = useDiagramByRoute(detail?.groupName, detail?.routeId);
+  const { data: diagram } = useDiagramLayout(detail?.diagramContentHash ?? null);
 
   const procList = detail ? (detail.processors?.length ? detail.processors : (detail.children ?? [])) : [];