From 9ab1d530e7eb831b61900be6eb7c35e7307bc156 Mon Sep 17 00:00:00 2001
From: Carter <carter@adaptiveagriculture.ca>
Date: Wed, 25 Feb 2026 15:19:58 -0600
Subject: [PATCH] added tooltips for the icons in the chat menu

---
 src/chat/ChatDrawer.tsx | 55 ++++++++++++++++++++++-------------------
 1 file changed, 30 insertions(+), 25 deletions(-)

diff --git a/src/chat/ChatDrawer.tsx b/src/chat/ChatDrawer.tsx
index 2ae3081..ecf83b7 100644
--- a/src/chat/ChatDrawer.tsx
+++ b/src/chat/ChatDrawer.tsx
@@ -1,5 +1,5 @@
 import { ChevronRight } from "@mui/icons-material";
-import { Avatar, Box, Divider, Drawer, IconButton, Theme, Typography } from "@mui/material";
+import { Avatar, Box, Divider, Drawer, IconButton, Theme, Tooltip, Typography } from "@mui/material";
 import { makeStyles } from "@mui/styles";
 import { useMobile } from "hooks";
 import { Team } from "models";
@@ -91,34 +91,39 @@ export function ChatDrawer(props: Props) {
             borderRight: `1px solid ${theme.palette.divider}`,
           })}
         >
-          <IconButton
-            onClick={() => setSelectedTeam(team)}
-            sx={{
-              border: selectedTeam.settings?.key === team.settings.key ? "1px solid white" : "1px solid transparent",
-              borderRadius: "50%",
-            }}
-          >
-            <Avatar src={team.settings.avatar} />
-          </IconButton>
-          <IconButton
-            onClick={openCrisp}
-          >
-            <RobotIcon />
-          </IconButton>
+          <Tooltip title={team.name()} placement="right">
+            <IconButton
+              onClick={() => setSelectedTeam(team)}
+              sx={{
+                border: selectedTeam.settings?.key === team.settings.key ? "1px solid white" : "1px solid transparent",
+                borderRadius: "50%",
+              }}
+            >
+              <Avatar src={team.settings.avatar} />
+            </IconButton>
+          </Tooltip>
+          <Tooltip title={"Chat Assistant"} placement="right">
+            <IconButton
+              onClick={openCrisp}
+            >
+              <RobotIcon />
+            </IconButton>
+          </Tooltip>
           <Box width={"100%"} borderBottom={"1px solid grey"} />
           {teams.map((t, i)=> {
             if (t.settings?.key === team.key()) return null;
             return (
-              <IconButton
-                onClick={() => setSelectedTeam(Team.create(t))}
-                sx={{
-                  border: selectedTeam.key() === t.settings?.key ? "1px solid white" : "1px solid transparent",
-                  borderRadius: "50%",
-                }}
-                key={"chat-team-"+i}
-              >
-                <Avatar src={t.settings?.avatar} />
-              </IconButton>
+              <Tooltip title={t.settings?.name} key={"chat-team-"+i} placement="right">
+                <IconButton
+                  onClick={() => setSelectedTeam(Team.create(t))}
+                  sx={{
+                    border: selectedTeam.key() === t.settings?.key ? "1px solid white" : "1px solid transparent",
+                    borderRadius: "50%",
+                  }}
+                >
+                  <Avatar src={t.settings?.avatar} />
+                </IconButton>
+              </Tooltip>
             )
           })}
         </Box>