added tooltips for the icons in the chat menu

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,6 +91,7 @@ export function ChatDrawer(props: Props) {
             borderRight: `1px solid ${theme.palette.divider}`,
           })}
         >
+          <Tooltip title={team.name()} placement="right">
             <IconButton
               onClick={() => setSelectedTeam(team)}
               sx={{
@@ -100,25 +101,29 @@ export function ChatDrawer(props: Props) {
             >
               <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 (
+              <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%",
                   }}
-                key={"chat-team-"+i}
                 >
                   <Avatar src={t.settings?.avatar} />
                 </IconButton>
+              </Tooltip>
             )
           })}
         </Box>