From 21b98037433feda836808cab51f5ae745ca458a3 Mon Sep 17 00:00:00 2001
From: dalthecow <dalcowboiz@gmail.com>
Date: Wed, 1 Oct 2025 15:52:12 -0400
Subject: [PATCH] fix inconsistent use of abbreviations in ui

Signed-off-by: dalthecow <dalcowboiz@gmail.com>
---
 .../MetricsSummary.component.tsx               |  8 ++++----
 .../WorkloadMetrics.component.tsx              | 18 +++++++++---------
 2 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/ui/lib/components/MetricsSummary/MetricsSummary.component.tsx b/src/ui/lib/components/MetricsSummary/MetricsSummary.component.tsx
index 33c4bee4..8f5e3aed 100644
--- a/src/ui/lib/components/MetricsSummary/MetricsSummary.component.tsx
+++ b/src/ui/lib/components/MetricsSummary/MetricsSummary.component.tsx
@@ -123,7 +123,7 @@ export const Component = () => {
           <FieldsContainer data-id="fields-container">
             <FieldCell data-id="field-cell-1">
               <Input
-                label="TTFT (ms)"
+                label="TIME TO FIRST TOKEN (ms)"
                 value={ttftSLO}
                 onChange={handleTtft}
                 fullWidth
@@ -133,7 +133,7 @@ export const Component = () => {
             </FieldCell>
             <FieldCell data-id="field-cell-2">
               <Input
-                label="ITL (ms)"
+                label="INTER-TOKEN LATENCY (ms)"
                 value={itlSLO}
                 onChange={handleItl}
                 fullWidth
@@ -212,7 +212,7 @@ export const Component = () => {
         </MiddleColumn>
         <MiddleColumn item xs={3}>
           <MetricValue
-            label="TTFT"
+            label="time to first token"
             value={`${formatNumber(interpolatedMetricData.ttft.enforcedPercentileValue)} ms`}
             match={isTtftMatch}
             valueColor={LineColor.Primary}
@@ -230,7 +230,7 @@ export const Component = () => {
         </MiddleColumn>
         <MiddleColumn item xs={3}>
           <MetricValue
-            label="ITL"
+            label="inter-token latency"
             value={`${formatNumber(interpolatedMetricData.itl.enforcedPercentileValue)} ms`}
             match={isItlMatch}
             valueColor={LineColor.Secondary}
diff --git a/src/ui/lib/components/WorkloadMetrics/WorkloadMetrics.component.tsx b/src/ui/lib/components/WorkloadMetrics/WorkloadMetrics.component.tsx
index 7b36ffd1..e7e632ca 100644
--- a/src/ui/lib/components/WorkloadMetrics/WorkloadMetrics.component.tsx
+++ b/src/ui/lib/components/WorkloadMetrics/WorkloadMetrics.component.tsx
@@ -57,7 +57,7 @@ export const Component = () => {
       <BlockHeader label="Metrics Details" />
       <Box display="flex" flexDirection="row" gap={3} mt={3}>
         <MetricsContainer
-          header="TTFT"
+          header="TIME TO FIRST TOKEN"
           leftColumn={leftColumn(
             formattedRequestRate,
             formatNumber(ttftAtRPS.mean),
@@ -65,19 +65,19 @@ export const Component = () => {
           )}
           rightColumn={columnContent(formattedRequestRate, ttftAtRPS.percentiles, 'ms')}
         >
-          <GraphTitle title="TTFS vs RPS" />
+          <GraphTitle title="Time to First Token vs RPS" />
           <GraphsWrapper>
             <DashedLine
               data={ttft}
               margins={{ left: 50, bottom: 50 }}
               xLegend="request per sec"
-              yLegend="ttft (ms)"
+              yLegend="time to first token (ms)"
               minX={minX}
             />
           </GraphsWrapper>
         </MetricsContainer>
         <MetricsContainer
-          header="ITL"
+          header="INTER-TOKEN LATENCY"
           leftColumn={leftColumn3(
             formattedRequestRate,
             formatNumber(itlAtRPS.mean),
@@ -85,13 +85,13 @@ export const Component = () => {
           )}
           rightColumn={columnContent(formattedRequestRate, itlAtRPS.percentiles, 'ms')}
         >
-          <GraphTitle title="ITL vs RPS" />
+          <GraphTitle title="Inter-token Latency vs RPS" />
           <GraphsWrapper>
             <DashedLine
               data={itl}
               margins={{ left: 50, bottom: 50 }}
               xLegend="request per sec"
-              yLegend="itl (ms)"
+              yLegend="inter-token latency (ms)"
               minX={minX}
             />
           </GraphsWrapper>
@@ -99,7 +99,7 @@ export const Component = () => {
       </Box>
       <Box display="flex" flexDirection="row" gap={3} mt={3}>
         <MetricsContainer
-          header="E2E Latency"
+          header="Time Per Request"
           leftColumn={leftColumn(
             formattedRequestRate,
             formatNumber(timePerRequestAtRPS.mean),
@@ -111,13 +111,13 @@ export const Component = () => {
             's'
           )}
         >
-          <GraphTitle title="E2E Latency vs RPS" />
+          <GraphTitle title="Time Per Request vs RPS" />
           <GraphsWrapper>
             <DashedLine
               data={timePerRequest}
               margins={{ left: 50, bottom: 50 }}
               xLegend="request per sec"
-              yLegend="latency (s)"
+              yLegend="time per request (s)"
               minX={minX}
             />
           </GraphsWrapper>