From bc43e6e6eaa76f78b66618d3687fa4fbc602dd60 Mon Sep 17 00:00:00 2001
From: Nawaz Dhandala <hello@nawazdhandala.com>
Date: Wed, 22 Oct 2025 11:44:53 +0100
Subject: [PATCH] feat(traces): make card title/description reflect active tab
 (All / Root Spans)

---
 .../src/Components/Traces/TraceTable.tsx      | 24 ++++++++++++++++---
 1 file changed, 21 insertions(+), 3 deletions(-)

diff --git a/Dashboard/src/Components/Traces/TraceTable.tsx b/Dashboard/src/Components/Traces/TraceTable.tsx
index aa9ce76e7e..74682aa281 100644
--- a/Dashboard/src/Components/Traces/TraceTable.tsx
+++ b/Dashboard/src/Components/Traces/TraceTable.tsx
@@ -96,6 +96,25 @@ const TraceTable: FunctionComponent<ComponentProps> = (
     setActiveTab("all");
   }, []);
 
+  const cardContent: {
+    title: string;
+    description: string;
+  } = useMemo(() => {
+    if (activeTab === "root") {
+      return {
+        title: "Root Spans",
+        description:
+          "Root spans act as entry points in a trace. They represent requests without a parent span and help you spot top-level operations quickly.",
+      };
+    }
+
+    return {
+      title: "All Spans",
+      description:
+        "Collection of spans make up a trace. Spans are the building blocks of a trace and represent individual units of work done in a distributed system.",
+    };
+  }, [activeTab]);
+
   const getQueryForActiveTab: Query<Span> = useMemo(() => {
     const baseQuery: Query<Span> = {
       ...(spanQuery || {}),
@@ -273,9 +292,8 @@ const TraceTable: FunctionComponent<ComponentProps> = (
             props.isMinimalTable
               ? undefined
               : {
-                  title: "Spans",
-                  description:
-                    "Collection of spans make up a trace. Spans are the building blocks of a trace and represent the individual units of work done in a distributed system.",
+                  title: cardContent.title,
+                  description: cardContent.description,
                 }
           }
           query={getQueryForActiveTab}