From c51f3136ddad6b3cc689f397cffec13bead3cf3f Mon Sep 17 00:00:00 2001
From: SergeantPanda <chester.cullen@gmail.com>
Date: Sun, 27 Apr 2025 14:51:13 -0500
Subject: [PATCH] Add tooltip for stream profile and add clarity to user-agent.

---
 frontend/src/pages/Stats.jsx | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/frontend/src/pages/Stats.jsx b/frontend/src/pages/Stats.jsx
index ef15d605..3fb818e3 100644
--- a/frontend/src/pages/Stats.jsx
+++ b/frontend/src/pages/Stats.jsx
@@ -299,7 +299,14 @@ const ChannelCard = ({ channel, clients, stopClient, stopChannel, logos, channel
         </Center>
       </Box>
     ),
-    renderDetailPanel: ({ row }) => <Box>{row.original.user_agent}</Box>,
+    renderDetailPanel: ({ row }) => (
+      <Box p="xs">
+        <Group spacing="xs" align="flex-start">
+          <Text size="xs" fw={500} color="dimmed">User Agent:</Text>
+          <Text size="xs">{row.original.user_agent || "Unknown"}</Text>
+        </Group>
+      </Box>
+    ),
     mantineExpandButtonProps: ({ row, table }) => ({
       size: 'xs',
       style: {
@@ -407,10 +414,12 @@ const ChannelCard = ({ channel, clients, stopClient, stopChannel, logos, channel
             <Text fw={500}>{channelName}</Text>
           </Group>
 
-          <Group gap={5}>
-            <Video size="18" />
-            {streamProfileName}
-          </Group>
+          <Tooltip label="Active Stream Profile">
+            <Group gap={5}>
+              <Video size="18" />
+              {streamProfileName}
+            </Group>
+          </Tooltip>
         </Flex>
 
         {/* Display M3U profile information */}