From d5a559777a2b5bf8eafc248e21de469aa7827097 Mon Sep 17 00:00:00 2001
From: adibarra <93070681+adibarra@users.noreply.github.com>
Date: Thu, 19 Mar 2026 17:55:55 -0500
Subject: [PATCH] fix export PNG title wrapping and hide dropdown chevron in
 export

---
 packages/app/src/components/inference/ui/ChartDisplay.tsx | 2 +-
 packages/app/src/hooks/useChartExport.ts                  | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/app/src/components/inference/ui/ChartDisplay.tsx b/packages/app/src/components/inference/ui/ChartDisplay.tsx
index f35c8be..e768ce8 100644
--- a/packages/app/src/components/inference/ui/ChartDisplay.tsx
+++ b/packages/app/src/components/inference/ui/ChartDisplay.tsx
@@ -70,7 +70,7 @@ function E2eXAxisDropdown({
           onClick={(e) => e.stopPropagation()}
         >
           vs. {xAxisLabel}
-          <ChevronDown className="h-3.5 w-3.5 shrink-0 opacity-60" />
+          <ChevronDown className="no-export h-3.5 w-3.5 shrink-0 opacity-60" />
         </button>
       </PopoverTrigger>
       <PopoverContent className="w-48 p-1" align="start">
diff --git a/packages/app/src/hooks/useChartExport.ts b/packages/app/src/hooks/useChartExport.ts
index 02ec052..eeadd60 100644
--- a/packages/app/src/hooks/useChartExport.ts
+++ b/packages/app/src/hooks/useChartExport.ts
@@ -198,6 +198,10 @@ export function useChartExport({ chartId, setIsLegendExpanded }: UseChartExportO
       // CSS custom properties (e.g. text-muted-foreground → var(--muted-foreground)).
       const figcaption = clone.querySelector('figcaption');
       if (figcaption) {
+        // Prevent title from wrapping mid-phrase in the export (e.g. "End-to-end Latency")
+        const heading = figcaption.querySelector('h2');
+        if (heading) (heading as HTMLElement).style.whiteSpace = 'nowrap';
+
         const origCaption = element.querySelector('figcaption');
         if (origCaption) {
           const origEls = [