diff --git a/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/shared/TimingWaterfall.tsx b/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/shared/TimingWaterfall.tsx
index 7ff64bae6a..03ce7cf2de 100644
--- a/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/shared/TimingWaterfall.tsx
+++ b/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/shared/TimingWaterfall.tsx
@@ -1,5 +1,6 @@
"use client";
+import { useTranslations } from "next-intl";
import type { InterceptedRequest } from "@/mitm/inspector/types";
interface TimingWaterfallProps {
@@ -7,6 +8,7 @@ interface TimingWaterfallProps {
}
export function TimingWaterfall({ request }: TimingWaterfallProps) {
+ const t = useTranslations("trafficInspector");
const { proxyLatencyMs, upstreamLatencyMs, totalLatencyMs } = request;
const total = totalLatencyMs ?? (proxyLatencyMs ?? 0) + (upstreamLatencyMs ?? 0);
@@ -16,12 +18,12 @@ export function TimingWaterfall({ request }: TimingWaterfallProps) {
const segments: Array<{ label: string; ms: number; color: string }> = [
{
- label: "Proxy overhead",
+ label: t("timingProxyOverhead"),
ms: proxyLatencyMs ?? 0,
color: "bg-blue-500",
},
{
- label: "Upstream response",
+ label: t("timingUpstreamResponse"),
ms: upstreamLatencyMs ?? 0,
color: "bg-green-500",
},
diff --git a/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/ConversationTab.tsx b/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/ConversationTab.tsx
index cb09a1baa7..6c71b2ea12 100644
--- a/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/ConversationTab.tsx
+++ b/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/ConversationTab.tsx
@@ -15,10 +15,7 @@ export function ConversationTab({ request }: ConversationTabProps) {
if (!conversation) {
return (
-
- Conversation data not available. This may not be an LLM request or the body
- could not be parsed.
-
+ {t("conversationNotAvailable")}
);
}
@@ -26,7 +23,7 @@ export function ConversationTab({ request }: ConversationTabProps) {
if (allTurns.length === 0) {
return (
- No messages found in this request.
+ {t("conversationNoMessages")}
);
}
@@ -34,7 +31,7 @@ export function ConversationTab({ request }: ConversationTabProps) {
{conversation.contextKey && (
- Context fingerprint:{" "}
+ {t("contextFingerprint")}{" "}
#{conversation.contextKey.slice(0, 12)}
)}
diff --git a/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/StatsCharts.tsx b/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/StatsCharts.tsx
index 4ba75211ba..91bdfd7c1e 100644
--- a/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/StatsCharts.tsx
+++ b/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/StatsCharts.tsx
@@ -10,6 +10,7 @@ import {
LineChart,
Line,
} from "recharts";
+import { useTranslations } from "next-intl";
import type { InterceptedRequest } from "@/mitm/inspector/types";
interface StatsChartsProps {
@@ -17,6 +18,8 @@ interface StatsChartsProps {
}
export default function StatsCharts({ requests }: StatsChartsProps) {
+ const t = useTranslations("trafficInspector");
+
const statusDist = requests.reduce
>((acc, r) => {
const key =
typeof r.status === "number" ? `${Math.floor(r.status / 100)}xx` : String(r.status);
@@ -34,7 +37,7 @@ export default function StatsCharts({ requests }: StatsChartsProps) {
- Status distribution
+ {t("statsStatusDistribution")}
@@ -51,7 +54,7 @@ export default function StatsCharts({ requests }: StatsChartsProps) {
{latencyData.length > 1 && (
- Latency (last 50 requests)
+ {t("statsLatency")}
@@ -75,13 +78,13 @@ export default function StatsCharts({ requests }: StatsChartsProps) {
{requests.length}
-
Total requests
+
{t("statsTotalRequests")}
{requests.filter((r) => typeof r.status === "number" && r.status < 400).length}
-
Successful
+
{t("statsSuccessful")}
@@ -92,7 +95,7 @@ export default function StatsCharts({ requests }: StatsChartsProps) {
).length
}
-
Errors
+
{t("statsErrors")}
diff --git a/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/StatsTab.tsx b/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/StatsTab.tsx
index 2392c569a2..f85745d0e1 100644
--- a/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/StatsTab.tsx
+++ b/src/app/(dashboard)/dashboard/tools/traffic-inspector/components/tabs/StatsTab.tsx
@@ -1,6 +1,7 @@
"use client";
import dynamic from "next/dynamic";
+import { useTranslations } from "next-intl";
import type { InterceptedRequest } from "@/mitm/inspector/types";
interface StatsTabProps {
@@ -10,15 +11,19 @@ interface StatsTabProps {
// Recharts bundle is split via Next.js dynamic() — not included in the initial page chunk.
const StatsCharts = dynamic(() => import("./StatsCharts"), {
ssr: false,
- loading: () =>
Loading charts…
,
+ loading: () =>
,
});
+function LoadingCharts() {
+ const t = useTranslations("trafficInspector");
+ return
{t("loadingCharts")}
;
+}
+
export function StatsTab({ requests }: StatsTabProps) {
+ const t = useTranslations("trafficInspector");
if (requests.length === 0) {
return (
-
- No requests yet. Start a session recording to capture data for stats.
-
+
{t("statsNoData")}
);
}
return
;